/*
 *   Document       : jquery.smallslider.js
 *   Created on     : 2009-7-3, 11:56:24
 *   Author         : smallchicken
 *   E-Mail         : microji@163.com
 *   Description    : JQuery plugin for switch images
 *   Version        : 0.1
 */
(function($) {
    $.fn.smallslider=function(options){
        var defaults={
            Change:  0,		    //改变量
	    Duration: 50,	    //滑动持续时间
	    Time: 10,		    //滑动延时
	    Pause: 2000,	    //停顿时间(Auto为true时有效)
	    ButtonImage:'',         // 按钮的背景图
            ButtonImageOn:'',       // 当播放到某按钮时，按钮的背景图
            ShowText:true,          // 是否显示标题，如果不显示，则只显示按钮
            TextLink:true,          // 是否给显示的标题加上链接，如果为false，则，只显示标题，标题不可单击，链接的地址自动和当前播放到的图片地址一致
            AutoStart:true,         // 是否自动开始播放
            SwitchMode:'Click',     // 图片切换的方式，Click为单击切换，Hover为鼠标移动到按钮上时切换
            SwitchEffect:'fadeOut', // 切换特效,fadeOut,fadeIn, slideUp,slideDown,none,
            SwitchTime:300,         // 切换时间，单位毫秒，1秒=1000毫秒
            Position:'RightBottom', // 按钮位置表示，共有四个值：LeftTop，LeftBottom,RightTop,RightBottom   
            OffsetX:10,             // 水平方向上的按钮偏移位置，指向中心部移动多少，这里是数值，不加px
            OffsetY:4,              // 竖直方向上的按钮偏移位置，指向中心部移动多少，这里是数值，不加px
            ButtonSpace:4           // 按钮之间的间隔 单位为像素，但不要加px
        };
        var opts = $.extend(defaults,options);
        var $this = $(this);
        var slider = new Array();
        var ButtonBgColor = '';
        var ButtonBgColorOn = '';
	var Tween = {
	    Linear: function(t,b,c,d){
		return c*t/d + b;
	    },
	    Quad: {
		easeIn: function(t,b,c,d){
		    return c*(t/=d)*t + b;
		},
		easeOut: function(t,b,c,d){
		    return -c *(t/=d)*(t-2) + b;
		},
		easeInOut: function(t,b,c,d){
		    if ((t/=d/2) < 1) return c/2*t*t + b;
		    return -c/2 * ((--t)*(t-2) - 1) + b;
		}
	    },
	    Cubic: {
		easeIn: function(t,b,c,d){
		    return c*(t/=d)*t*t + b;
		},
		easeOut: function(t,b,c,d){
		    return c*((t=t/d-1)*t*t + 1) + b;
		},
		easeInOut: function(t,b,c,d){
		    if ((t/=d/2) < 1) return c/2*t*t*t + b;
		    return c/2*((t-=2)*t*t + 2) + b;
		}
	    },
	    Quart: {
		easeIn: function(t,b,c,d){
		    return c*(t/=d)*t*t*t + b;
		},
		easeOut: function(t,b,c,d){
		    return -c * ((t=t/d-1)*t*t*t - 1) + b;
		},
		easeInOut: function(t,b,c,d){
		    if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
		    return -c/2 * ((t-=2)*t*t*t - 2) + b;
		}
	    },
	    Quint: {
		easeIn: function(t,b,c,d){
		    return c*(t/=d)*t*t*t*t + b;
		},
		easeOut: function(t,b,c,d){
		    return c*((t=t/d-1)*t*t*t*t + 1) + b;
		},
		easeInOut: function(t,b,c,d){
		    if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
		    return c/2*((t-=2)*t*t*t*t + 2) + b;
		}
	    },
	    Sine: {
		easeIn: function(t,b,c,d){
		    return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
		},
		easeOut: function(t,b,c,d){
		    return c * Math.sin(t/d * (Math.PI/2)) + b;
		},
		easeInOut: function(t,b,c,d){
		    return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
		}
	    },
	    Expo: {
		easeIn: function(t,b,c,d){
		    return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
		},
		easeOut: function(t,b,c,d){
		    return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
		},
		easeInOut: function(t,b,c,d){
		    if (t==0) return b;
		    if (t==d) return b+c;
		    if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
		    return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
		}
	    },
	    Circ: {
		easeIn: function(t,b,c,d){
		    return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
		},
		easeOut: function(t,b,c,d){
		    return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
		},
		easeInOut: function(t,b,c,d){
		    if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
		    return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
		}
	    },
	    Elastic: {
		easeIn: function(t,b,c,d,a,p){
		    if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
		    var s = 0;
		    if (!a || a < Math.abs(c)) {
			a=c; s=p/4;
		    }else s = p/(2*Math.PI) * Math.asin (c/a);
		    return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
		},
		easeOut: function(t,b,c,d,a,p){
		    if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
		    var s = 0;
		    if (!a || a < Math.abs(c)) {
			a=c; s=p/4;
		    }else s = p/(2*Math.PI) * Math.asin (c/a);
		    return (a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b);
		},
		easeInOut: function(t,b,c,d,a,p){
		    if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5);
		    var s = 0;
		    if (!a || a < Math.abs(c)) {
			a=c; s=p/4;
		    }else s = p/(2*Math.PI) * Math.asin (c/a);
		    if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
		    return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
		}
	    },
	    Back: {
		easeIn: function(t,b,c,d,s){
		    if (s == undefined) s = 1.70158;
		    return c*(t/=d)*t*((s+1)*t - s) + b;
		},
		easeOut: function(t,b,c,d,s){
		    if (s == undefined) s = 1.70158;
		    return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
		},
		easeInOut: function(t,b,c,d,s){
		    if (s == undefined) s = 1.70158;
		    if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
		    return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
		}
	    },
	    Bounce: {
		easeIn: function(t,b,c,d){
		    return c - Tween.Bounce.easeOut(d-t, 0, c, d) + b;
		},
		easeOut: function(t,b,c,d){
		    if ((t/=d) < (1/2.75)) {
			return c*(7.5625*t*t) + b;
		    } else if (t < (2/2.75)) {
			return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
		    } else if (t < (2.5/2.75)) {
			return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
		    } else {
			return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
		    }
		},
		easeInOut: function(t,b,c,d){
		    if (t < d/2) return Tween.Bounce.easeIn(t*2, 0, c, d) * .5 + b;
		    else return Tween.Bounce.easeOut(t*2-d, 0, c, d) * .5 + c*.5 + b;
		}
	    }
	};
	var Tn = Tween.Quad.easeOut;
	
        if($this.length>0){
            $.each($this,function(){
                Init(this);
                CreateButtons(this,0);
                if(opts.AutoStart) StartSlider(this,0);
                onImage(this);
            });
        }

        function onImage(obj){
            $(obj).find('img').hover(function(){
                StopSlider(obj);
            }, function(){
                var i= $(obj).find('li').index( $(obj).find('.current-li'));
                StartSlider(obj,i+1);
            });
        }
        function Slide(obj,index){
            StopSlider(obj); // 先清楚掉以前的setTimeOut;

            // index表示当前停止在哪个元素上上面，其上一张为 prev，后一个，也就是将要显示的为 next
            var listArr = $(obj).find('li');
            var count=listArr.length;
            if(index > count-1) index = 0;
            // index 可能会传入-1 值，表示当前需要切换到状态0，即第一张图片，那么next正好是0
            // 所以这里需要先经过运算，得出next，然后再进行限定0 - count-1之间
            var prev= index - 1 < -1 ? count-1 : index - 1 ;
            var next= index + 1 < count ? index + 1 : 0;

            if(index < 0) index = 0;
            if(next <0 ) next = 0 ;
            
            //listArr.hide();
            //listArr.eq(index).show();
            switch( opts.SwitchEffect){
                case 'fadeOut':
                    listArr.eq(index).fadeOut(opts.SwitchTime,function(){
                        listArr.eq(next).show();
                    });
                    break;
                case 'fadeIn':
                    listArr.eq(index).hide();
                    listArr.eq(next).fadeIn(opts.SwitchTime);
                    break;
                case 'slideUp':
                    listArr.eq(index).slideUp(opts.SwitchTime,function(){listArr.hide();listArr.eq(next).show();});
                    break;
                case 'slideDown':
                    //listArr.eq(index).hide();
                    listArr.eq(next).slideDown(opts.SwitchTime,function(){listArr.hide();listArr.eq(next).show();});
                    break;
                case 'none':
                    listArr.eq(index).hide();
                    listArr.eq(next).show();
                    break;
                default:
                    listArr.eq(index).hide();
                    listArr.eq(next).show();
                    break;
            }

            // 切换表示当前元素
            $(obj).find('li').removeClass('current-li');
            $(obj).find('li').eq(index).addClass('current-li');
            $(obj).find('span').removeClass('current-btn');
            $(obj).find('span').eq(next).addClass('current-btn');

            // 切背景图标
            if(opts.ButtonImageOn!=''){
                if(opts.ButtonImage!=''){
                    $(obj).find('span').css({background:'transparent url('+opts.ButtonImage+') no-repeat 0 0'});
                }else{
                    $(obj).find('span').css({backgroundColor:ButtonBgColor,backgroundImage:'',borderWidth:'1px'});
                }
                $(obj).find('span.current-btn').css({background:'transparent url('+opts.ButtonImageOn+') no-repeat 0 0',borderWidth:0});
            }
            //切换标题

            var tit = $(obj).find('img').eq(next).attr('alt');
            if(opts.TextLink){
                tit = '<a href="'+$(obj).find('img').eq(next).parent('a').attr('href')+'">'+ tit+'</a>';
            }
            $(obj).find('h3').html(tit);
            ++index;
            index = index > count -1  ? 0 : index;
            StartSlider(obj,index);
        }
	
	function Move()
	{
	    
	}

        function CreateButtons(obj,index)
        {
            var listArr = $(obj).find('li');
            var count=listArr.length;
            var buttons='';
            for(var i=1; i <= count; i++ ){
                buttons += '<span>'+i+'</span>';
            }
            buttons ='<div class="smallslider-btns">' + buttons + '</div>';
            var left=0,right=0,top =0,bottom=0;
            var style_btns={},style_lays={};
            switch(opts.Position){
                case 'LeftTop':
                    left = opts.OffsetX;
                    top  = opts.OffsetY;
                    style_btns={left: left + 'px' , top: top+'px'};
                    style_lays={left:0,top:0,textAlign:'right'};
                    break;
                case 'RightTop':
                    right = opts.OffsetX;
                    top  = opts.OffsetY;
                    style_btns={right: right + 'px' , top: top+'px'};
                    style_lays={left:0,top:0,textAlign:'left'};
                    break;
                case 'RightBottom':
                    right = opts.OffsetX;
                    bottom = opts.OffsetY;
                    style_btns={right: right + 'px' ,bottom: bottom+'px'};
                    style_lays={left:0,bottom:0,textAlign:'left'};
                    break;
                case 'LeftBottom':
                    left = opts.OffsetX;
                    bottom = opts.OffsetY;
                    style_btns={left: left + 'px' ,bottom: bottom+'px'};
                    style_lays={left:0,bottom:0,textAlign:'right'};
                    break;
            }
            $(buttons).css(style_btns).appendTo($(obj));
            if(opts.ShowText){
                $('<div class="smallslider-lay"></div>').css(style_lays).appendTo($(obj));
                var tit= $(obj).find('img').eq(index).attr('alt');
                if(opts.TextLink){
                        tit = '<a href="'+$(obj).find('img').eq(index).parent('a').attr('href')+'">'+ tit+'</a>';
                }
                $('<h3></h3>').html(tit).css(style_lays).appendTo($(obj));
            }
            $(obj).find('span:not(:first)').css({marginLeft:opts.ButtonSpace+'px'});
            $(obj).find('span').removeClass('current-btn');
            $(obj).find('span').eq(index).addClass('current-btn');

            if(opts.ButtonImage!=''){
                $(obj).find('span').css({border:0,background:'transparent url('+opts.ButtonImage+') no-repeat 0 0'});
            }

            if(opts.ButtonImageOn!=''){
                if(opts.ButtonImage!=''){
                    $(obj).find('span').css({background:'transparent url('+opts.ButtonImage+') no-repeat 0 0'});
                }else{
                    $(obj).find('span').css({backgroundColor:ButtonBgColor,backgroundImage:'',borderWidth:'1px'});
                }
                $(obj).find('span.current-btn').css({background:'transparent url('+opts.ButtonImageOn+') no-repeat 0 0',borderWidth:0});
            }

            if(opts.SwitchMode=='Click'){
                $(obj).find('span').click(function(){
                    var ix = $(obj).find('span').index($(this));
                    Slide(obj,ix-1); // 传入ix-1表示当前是他前面一个，则在调用函数后，就会自然的切换到下一张图片，正好是ix
                });
            }else if(opts.SwitchMode=='Hover'){
                 $(obj).find('span').hover(function(){
                    var ix = $(obj).find('span').index($(this));
                    Slide(obj,ix-1);
                });
            }
            ButtonBgColor   = $(obj).find('span:not(.current-btn)').css('backgroundColor');
            ButtonBgColorOn = $(obj).find('span.current-btn').css('backgroundColor');
        }

        function Init(obj){
            var listArr = $(obj).find('li');
            listArr.hide();
            listArr.eq(0).show();
        }
        function StartSlider(obj,index){
            // 由第几个序号开始 初始为-1
            var st =setTimeout(function(){
                Slide(obj,index);
            },opts.Time);
            var i= $this.index(obj);
            slider[i]=st;
        }
        function StopSlider(obj){
            var i= $this.index(obj);
            clearTimeout(slider[i]);
            slider[i]=0;
        }
        
        return this.each(function(){
            this.AccessStop=function(){
                $.each($this,function(){
                    StopSlider($this);
                });
            }
        });
        
    }
    
})(jQuery);