/*
 *	$("#slider").imageSlider();
 *
 * 	<div id="slider">
 *		<ul>
 *			<li><img src="images/01.jpg" alt="" /></li>
 *			<li><img src="images/02.jpg" alt="" /></li>
 *			<li><img src="images/03.jpg" alt="" /></li>
 *			<li><img src="images/04.jpg" alt="" /></li>
 *			<li><img src="images/05.jpg" alt="" /></li>
 *		</ul>
 *	</div>
 */

(function($) {

	$.fn.imageSlider = function(options){

		// 默认配置
		var defaults = {
			vertical:		false,
			speed: 			800,
			auto:			false,
			pause:			3000,
			continuous:		false,
			numericId: 		'imageSliderControls',
            textId: 		'imageSliderText',
            width:          false,
            height:         false,
            direct:         'next'
		};

		var options = $.extend(defaults, options);

		this.each(function() {
			var obj = $(this);
			var s = $("li", obj).length;
			var w = options.width ? options.width : obj.width();
			var h = options.height ? options.height : obj.height();
			var clickable = true;
			obj.css({"overflow":"hidden","position":"relative","width":w,"height":h});
			var ts = s-1;
			var t = 0;
			$("ul", obj).css({'padding':0,'margin':0,'list-style':'none'});
             //如果是水平移动的话
			if(!options.vertical) {
                $("ul", obj).css({'width':s*w,'height':h});
				$("li", obj).css('float','left');
			} else {
                $("ul", obj).css({'width':w,'height':s*h});
            }
            $("li", obj).css({"width":w,"height":h,'overflow':'hidden'});
            //TODO:不起作用
            $("img", obj).css({width:w,height:h,'border':'0 solid #ffffff'});

			if(options.continuous){
				//将最后一个复制一份放到头上
				$("ul", obj).prepend($("ul li:last-child", obj).clone().css(!options.vertical ? "margin-left" : "margin-top","-"+ (!options.vertical ? w : h) +"px"));
				//将每一个复制一份放到最后
				$("ul", obj).append($("ul li:nth-child(2)", obj).clone());
				$("ul", obj).css(!options.vertical ? 'width' : 'height',(s+1)*(!options.vertical ? w : h));
			}

            //文字说明
            $(obj).append('<div id="'+ options.textId +'"></div>');
            $("#"+ options.textId).css({'position':'absolute','background-color':'#000000','color':'#ffffff','opacity':'0.5','left':'0','bottom':'0','width':w-20,'line-height':'120%','padding':'8px 10px 23px 10px','font-size':'12px', 'display':'none'});

			//数字序号
			$(obj).append('<ol id="'+ options.numericId +'"></ol>');

			for(var i=0;i<s;i++){
				$(document.createElement("li"))
					.attr('id',options.numericId + (i+1))
					.html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>')
					.appendTo($("#"+ options.numericId))
					.click(function(){
						animate($("a",$(this)).attr('rel'),true);
					});
			}
			//设置透明效果
			$("#"+ options.numericId).css({'position':'absolute','opacity':'0.5','left':'2px','bottom':'2px','padding':'0','margin':'0','list-style':'none'})
				.find('li').css({'display':'block','float':'left','border':'1px solid black','margin-right':'2px','cursor':'pointer','width':15,'height':15,'text-align':'center','line-height':'15px','overflow':'hidden'})
				.find('a').css({'text-decoration':'none','font-size':'12px'});



			function setCurrent(i){
				i = parseInt(i)+1;
				$("li", "#" + options.numericId).removeClass("current").css({'backgroundColor':'#ffffff'});
				$("li#" + options.numericId + i).addClass("current").css({'backgroundColor':'#000000'});
                var text=$(obj).find('li img').eq(options.continuous ? i : i-1).attr('alt');
				if (text) {
					$("#"+ options.textId).html(text).slideDown('slow');
				}
			}

			function adjust(){
				if(t>ts) t=0;
				if(t<0) t=ts;
				if(!options.vertical) {
					$("ul",obj).css("margin-left",(t*w*-1));
				} else {
					$("ul",obj).css("margin-top",(t*h*-1));
				}
				clickable = true;
				setCurrent(t);
			}

			function animate(dir,clicked){
				if (clickable){
					clickable = false;
                    //隐藏文字
                    $("#"+ options.textId).slideUp();
                    if (clicked) {
						stop();
					}
                    var ot = t;
                    switch(dir){
                        case "next":
                            t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1;
                            //t = (ot>=ts) ? 0 : t+1;
                            break;
                        case "prev":
                            t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1;
                            //t = (t<=0) ? ts : t-1;
                            break;
                        case "first":
                            t = 0;
                            break;
                        case "last":
                            t = ts;
                            break;
                        default:
                            t = parseInt(dir);
                            break;
                    }


					//var diff = Math.abs(ot-t);
                    var diff = 1;
					var speed = diff*options.speed;
                    var speed = options.speed;
					if(!options.vertical) {
						p = (t*w*-1);
						$("ul",obj).animate(
							{ marginLeft: p },
							{ queue:false, duration:speed, complete:adjust }
						);
					} else {
						p = (t*h*-1);
						$("ul",obj).animate(
							{ marginTop: p },
							{ queue:false, duration:speed, complete:adjust }
						);
					}


					if(options.auto){
                        stop();
						timeout = setTimeout(function(){
							animate(options.direct,false);
						},diff*options.speed+options.pause);
					}

				}

			}


            var timeout;
            // init
            function start() {
                if(options.auto){
                    timeout = setTimeout(function(){
                        animate(options.direct,false);
                    },options.pause);
                }
            }

            function stop() {
                clearTimeout(timeout);
            }


            start();
			setCurrent(0);

		});

	};

})(jQuery);




