//====================================================================================================
// [插件名称] jQuery ImageScroll
//----------------------------------------------------------------------------------------------------
// [描    述] jQuery ImageScroll图片展示插件，它是基于jQuery类库，实现了不使用flash也同样可以在
//             页面上展示图片的效果，支持数字导航，纵向滑动和横向滑动，自动滚动和连续滑动
//             可设置滑动速度、是否自动、停顿间隔,自定义容器高度和宽度,支持Jquery的easing效果
//        
//----------------------------------------------------------------------------------------------------
// [作者网名] Aries
// [邮    箱] helloaries@qq.com
// [作者博客] http://iw3c.com
// [更新日期] 2010-01-22
// [版 本 号] ver1.0
//====================================================================================================
(function($){
	$.fn.ImageScroll=function(settings){
		var defaults={
			width : 309, //图片的宽度
			height : 219, //图片的高度
			speed : 300,  //速度
			auto : true,  //自动开始
			effect : 1, //1=横向滚动，2=垂直滚动，3=渐变透明,
			pause : 2000, //两次滑动暂停时间,
			css : 'ari_image_scroll',
			border : 1,//容器是否有边框 0=无 大于0为边框的宽度
			padding : 0, //容器的padding 0=无 大于0为padding的值,
			control : true, //是否显示数字导航
			title : true ,//是否显示标题
			title_box_id : 'ari_title_box',  //标题容器ID
			title_id : 'ari_title' //标题ID
		}
		var timer;
		var obj=$(this);
		var index=1;
		var settings=$.extend(defaults,settings);
		if(!$(this).hasClass(settings.css)) $(this).addClass(settings.css);
		var container_width=settings.width,container_height=settings.height;
		if(settings.border>0){
			container_width+=settings.border;
			container_height+=settings.border;
		}
		if(settings.padding>0){
			container_width+=settings.padding;
			container_height+=settings.padding;
		}
		obj.css({
			'width':container_width,
			'height':container_height,
			'overflow':'hidden',
			'position':'relative'
		}).find('a').attr('target','_blank');
		obj.find('ul').css('display','block');
		this.each(function(){
			var image=obj.find('img');
			var image_nums=image.length;
			image.css({
				'width':settings.width,
				'height':settings.height
			});
			if(settings.control===true){
				var nav_output='<dl>';
				var nav_current='';
				for(var i=1;i<image_nums+1;i++){
					if(i==1) nav_current=' class="current"'
					else nav_current='';
					nav_output+='<dd'+nav_current+'>'+i+'</dd>';	
				}
				nav_output+='</dl>';
				obj.append(nav_output);
			
				if(settings.title===true){
					obj.append('<div id='+settings.title_box_id+'></div>');  //标题背景
					var href=image.parent().attr('href');
					obj.find('dl').wrap('<div id='+settings.title_id+'></div>').before('<span><a href="'+href+'" target="_blank">'+image.attr('alt')+'</a></span>');
					$('#'+settings.title_box_id).css({
						'position':'absolute',
						'z-index' : 100
					});
					$('#'+settings.title_id).css({
						'z-index':'200',
						'bottom' : '10px'
					});
				}else{
					obj.find('dl').css({
						'position':'absolute',
						'z-index' : 300,
						'bottom':'10px',
						'right':'10px'
					});	
				}
				$('dd',obj).hover(function(){
					var num=$(this).html();
					image_effect(num,true);
				}, function() {
                  	timer = setTimeout(function() {
                      	image_effect(parseInt(index)+1,false);
                  	}, settings.pause / 4);
            	});
			} //if(settings.control)
			function image_effect(num,hover){
				$("ul",obj).stop();
				var val=0;
				var next=(num===image_nums) ? 1 : parseInt(num)+1;
				index=num-1;
				set_current( (num-1) );
				set_title( (num-1) );
				if(settings.effect==1){
					$("li",obj).css('float','left');
					val=settings.width* (num-1) *-1;
					$("ul",obj).css({
							'width':settings.width*image_nums+'px',
							'height':settings.height+'px'
						}).animate(
						{ marginLeft: val },
						settings.speed, 'swing'
					);
				}else if(settings.effect==2){
					val=settings.height*(num-1)*-1;
					$("ul",obj).css({
							'width':settings.width+'px',
							'height':settings.height*image_nums+'px'
						}).animate(
						{ marginTop: val },
						settings.speed, 'swing'
					);	
				}else if(settings.effect==3){
					$("li",obj).eq((num-1)).fadeIn('fast').siblings().fadeOut('fast');	
				}
				if(hover===true) clearTimeout(timer);
				if(settings.auto===true && hover===false){
					timer = setTimeout(function() {
                       image_effect(next,false);
                    }, settings.speed + settings.pause);	
				}
			}
			function set_current(num){
				$("dd",obj).each(function(i){
					$(this).removeClass('current');		  
				}).eq(num).addClass('current');
			}
			
			function set_title(num){
				$('#'+settings.title_id+' a').html(obj.find('img').eq(num).attr('alt'));
			}
			if(settings.auto===true){
				timer = setTimeout(function() {
                    image_effect(2, false);
                }, settings.pause);
			}
		});
		
		
	}
})(jQuery);