;(function($) {


    $.fn.sfSlideShow = function(options) {
        var opts = $.extend({}, $.fn.sfSlideShow.defaults, options);
        return this.each(function() {
            init($(this),opts);
        });
    };
    
    $.fn.sfSlideShow.defaults = {
        speed: 2000,
        width: 556,
        height: 280,
		timer: 0,
		timerOn: 0
    };
    
    function init($obj,opts) {
        var delay = opts.speed;
        $obj.addClass('sfSlideShow')
            .css('width',opts.width+'px')
            .css('height',opts.height+'px');
        var len = $obj.find('li').length;
        var z = len;
        $obj.find('li').each(function() {
            $(this).css('z-index',z);
            if(z != len) {
                $(this).hide();
            }
            z--;
        });

        
        // add buttons to it
        var cp = $('<div/>')
                    .addClass('controlPanel')
                    .css('z-index',parseInt($obj.find('li').length)+1);
        
        // add button for every image
        $obj.find('li').each(function(i,v) {
            var dname = 'slide'+i;
            $(this).attr('name',dname);
            var div = $('<div/>')
                        .addClass('slideButton')
                        .text(i+1)
                        .click(function() {
                             mStack($obj,opts,dname);
                             $("div.slideButton").removeClass('selected');
                             $(this).addClass('selected');
                        })
                        .mouseenter(function() {
                            $(this).css('cursor','pointer')
                                   .addClass('over');
                        })
                        .mouseleave(function() {
                            $(this).removeClass('over');
                        });
            cp.append(div);
        });
        
        $obj.append(cp);
        
        // select first button
        $("div.slideButton:first").addClass('selected');
        
        // start slideshow
        opts.timerOn = 1;
        restack($obj,opts);
        
    }
    
    function restack($obj,opts) {
        if(opts.timerOn) {
            opts.timer = setTimeout(function() {
                var len = $obj.find('li').length;
                $obj.find('li').each(function(i,v) {
                    if($(this).css('z-index') == len) {
                        $(this).fadeOut().css('z-index',1);
                    } else {
                        if($(this).css('z-index') == len-1) {
                            $(this).hide().fadeIn();
                            var index = i;
                            $("div.slideButton", $obj).removeClass('selected');
                            $("div.slideButton:eq("+i+")", $obj).addClass('selected');
                        } else {
                            //$(this).hide();
                        }
                        $(this).css('z-index',parseInt($(this).css('z-index'))+1);
                    }
                });
                restack($obj,opts);
            },opts.speed);
        }
    }
    
    function mStack($obj,opts,t) {
        if(opts.timerOn) {
            clearTimeout(opts.timer);
            opts.timerOn = 0;
        }
        var len = $obj.find('li').length;
        $obj.find('li').each(function() {
            if(t == $(this).attr('name')) {
                $(this).fadeIn();
            } else if($(this).css('display') == 'list-item') {
                $(this).fadeOut();
            }
        });
    }

})(jQuery);