;(function($) {

    var timer = 0;
    var timerOn = 0;

    $.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,
        controlPanel: 1
    };
    
    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
        if(opts.controlPanel) {
            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,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
        timerOn = 1;
        restack($obj,opts);
        
    }
    
    function restack($obj,opts) {
        if(timerOn) {
            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").removeClass('selected');
                            $("div.slideButton:eq("+i+")").addClass('selected');
                        } else {
                            //$(this).hide();
                        }
                        $(this).css('z-index',parseInt($(this).css('z-index'))+1);
                    }
                });
                restack($obj,opts);
            },opts.speed);
        }
    }
    
    function mStack($obj,t) {
        if(timerOn) {
            clearTimeout(timer);
            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);