(function($){

    $.fn.imageSlider = function(vars) {

        var timer       = null;
        var list_li     = $('#ks_slider li');
        var list_data   = $('#ks_slider .note_body');
        var current     = 0;
        var last        = list_data.count-1;
        var stat        = true;
        var mouseover   = false;
        var timeout     = (vars.timeout != undefined) ? vars.timeout : 4000;
        var instance    = false;
        var animating   = false;

        list_data.each(function(i) {

            $(list_li[i]).mouseover(function() {
                mouseover = true;
            });

            $(list_data[i]).mouseover(function() {
                mouseover = true;
            });

            $(list_li[i]).mouseout(function() {
                setTimeout(function (){
                    if (instance == false)
                    {
                        makeTimeOut();
                    }
                }, timeout);
                mouseover   = false;
            });

            $(list_data[i]).mouseout(function() {
                setTimeout(function (){
                    if (instance == false)
                    {
                        makeTimeOut();
                    }
                }, timeout);
                mouseover   = false;
            });

        });

        $.each(list_data, function(index, value){
            if (index > 0)
            {
                $(list_data[index]).css('opacity','0');
                $(list_data[index]).css('display','none');
                $(list_data[index]).find('div').hide();
            }
        });

        $(".note_mini").click(function (){
            if (!$(this).hasClass('sl_active'))
            {
                var id = parseInt(this.id.replace('ks_', ''), 0);
                $(list_li[last]).removeClass('sl_active');
                current = id-1;
                stat = true;
                clearTimeout(timer);
                makeTimeOut();
            }
        });

        var makeTimeOut = function()
        {
            instance = true;
            if (stat == true)
            {
                makeAnim();
            }
            else
            {
                timer = setTimeout(makeAnim,timeout);
            }
        }

        var makeAnim = function ()
        {
            if (animating == false)
            {
                animating = true;
                if (mouseover == false || stat == true)
                {
                    $(list_li[last]).removeClass('sl_active');
                    $(list_li[current]).addClass('sl_active');

                    $(list_data[current]).css('display','block');
                    $(list_data[current]).find('div').slideDown(500);
                    $(list_data[current]).animate({
                        opacity: 1
                    }, 500, function() {
                        });

                    $(list_data[last]).animate({
                        opacity: 0
                    }, 500, function() {
                        });
                    $(list_data[last]).find('div').slideUp(500);
                    $(list_data[last]).css('display','none');

                    last = current;
                    current++;
                    if (current >= list_data.length)
                    {
                        //
                        current = 0;
                    }
                    stat = false;
                }
                //
                if (mouseover == false)
                {
                    makeTimeOut();
                }
                else
                {
                    instance = false;
                }
                animating = false;
            }
        }

        makeTimeOut();
    };

})(jQuery);