/********************************************************************************************************
 * D-ImageChange
 *----------------------------------------------------------------------------------------------------
 * @Desc 图片轮换插件
 *----------------------------------------------------------------------------------------------------
 * @Author D.夏亦知非
 * @Email DeclanZhang@gmail.com
 * @QQ 29540200
 * @Blog http://onblur.javaeye.com
 * @Date 2009-10-19
 * @Version V1.3@2010-03-16
 * @JQueryVersion 1.3.2+ (建议使用1.4以上版本)
 * 
 * @update v1.1 增加清空原始内容功能,以免页面加载完成之前显示大片空白
 * 		   v1.2 修正IE6每次从服务器读取背景图片的BUG
 *         v1.3 修正了宽度过大产生的BUG, 兼容JQ1.4.1, 建议使用JQ1.4+, 效率更高
 **/

// 修正IE6每次从服务器读取背景图片的BUG
try {
	document.execCommand('BackgroundImageCache', false, true);
}catch(e){

}


(function($){

jQuery.fn.extend({
	
	d_imagechange:function(setting){
		
		var config = $.extend({
			bg:false,						// 是否背景色
			title:false,						// 是否有标题
			desc:false,						// 是否有描述
			btn:true,						// 是否显示按钮
			repeat:'no-repeat',				// 重复规则 'no-repeat' 'repeat-x' 'repeat-y' 'repeat'
			
			bgColor:'#000',					// 背景色
			bgOpacity:.5,					// 背景透明度
			bgHeight:40,					// 背景高
			
			titleSize:14,					// 标题文字大小
			titleFont:'Verdana,宋体',		// 标题文本字体
			titleColor:'#FFF',				// 标题文本颜色
			titleTop:4,						// 标题上边距
			titleLeft:4,					// 标题左边距
			
			descSize:12,					// 描述文字大小
			descFont:'Verdana,宋体',			// 描述文本字体
			descColor:'#FFF',				// 描述文本颜色
			descTop:2,						// 描述上边距
			descLeft:4,						// 描述左边距
			
			btnColor:'#FFF',				// 按钮颜色1 
			btnOpacity:.5,					// 未选中按钮透明度
			btnFont:'Verdana',				// 按钮文本字体
			btnFontSize:12,					// 按钮文字大小(注意:Chrome有默认最小字号的限制)
			btnFontColor:'#000',			// 按钮文本颜色
			btnText:true,					// 是否显示文本
			btnWidth:15,					// 按钮宽
			btnHeight:15,					// 按钮高
			btnMargin:4,					// 按钮间距
			btnTop:4,						// 按钮上边距
			
			playTime:4000,					// 轮换间隔时间,单位(毫秒)
			animateTime:500,				// 动画执行时间,单位(毫秒)
			animateStyle:'o',				// 动画效果:'o':渐显 'x':横向滚动 'y':纵向滚动 'show':原地收缩伸展 'show-x':横向收缩伸展 'show-y':纵向收缩伸展' none':无动画
			width:708,						// 宽, 不设定则从DOM读取
			height:400,						// 高, 不设定则从DOM读取			
			index:false,					//首页专用
			worksPic:false					//works页面图片专用
		},setting);
		
		return $(this).each(function(){
			var _this = $(this);
			var _w = config.width || _this.width();			// 宽
			var _h = config.height || _this.height();		// 高
			var _n = config.data.length;					// 数目
			var _i = 0;										// 当前显示的item序号
			
			_this.empty()
				 .css('overflow','hidden')
				 .width(_w)
				 .height(_h);
			
		
			// 半透明背景
			if(config.bg){
			$('<div />').appendTo(_this)
						.width(_w)
						.height(config.bgHeight)
						.css('background-color',config.bgColor)
						.css('opacity',config.bgOpacity)
						.css('position','absolute')
						.css('marginTop',_h-config.bgHeight)
						.css('zIndex',3333);
			}
			
			// 文字区
			var _textArea = 
			$('<div />').appendTo(_this)
						.width(_w)
						.height(config.bgHeight)
						.css('position','absolute')
						.css('marginTop',_h-config.bgHeight)
						.css('zIndex',6666);
			// 按钮区
			if(config.worksPic){
				var _btnArea = 
				$('<div class="list" />').appendTo(_this)
							//.width(config.data.length * (config.btnWidth + config.btnMargin))
							//.height(config.bgHeight)
							//.css('position','absolute')
							.css('top',(_h-12)+'px')
							.css('width',_w+'px')
							.css('zIndex',9999)
							//.css('display',config.btn?'block':'none');
			} else {
				var _btnArea = 
				$('<div class="list" />').appendTo(_this)
							//.width(config.data.length * (config.btnWidth + config.btnMargin))
							//.height(config.bgHeight)
							//.css('position','absolute')
							//.css('top',(_h-15)+'px')
							.css('zIndex',9999)
							//.css('display',config.btn?'block':'none');
			}
			
			// 插入空div修正IE的绝对定位BUG
			$('<div />').appendTo(_this);
			
			// 图片区
			var _imgArea = 
			$('<div class=show />').appendTo(_this)
						.width('x,show-x'.indexOf(config.animateStyle)!=-1?_w*_n:_w)
						//.height('y,show-y'.indexOf(config.animateStyle)!=-1?_h*_n:_h);			
						.height('y,show-y'.indexOf(config.animateStyle)!=-1?198:198)
						.css('width',_w+'px')
						.css('height',_h-22+'px')
						
			
			if(!config.index){$("<div class='bgBtn'><a href='"+data[0]['href']+"' title='play' onfocus ='this.blur();' class='sPlay thickbox'>play</a><a href='"+data[0]['file']+"' onfocus ='this.blur();' title='download' class='sDownload'>download</a></div>").appendTo($(".show"));}
			// 初始化图片 文字 按钮
			$.each(config.data,function(i,n){
				if(config.worksPic){
					$('<img />').appendTo(_imgArea)
							  //.width(_w)
							  //.height(198)
							  //.attr('href',n.href?n.href:'')
							  //.attr('target',n.target?n.target:'')
							  .attr('src',n.src)
							  .attr('title',n.title?n.title:'')
							  .css('width',_w+'px')
							  .css('height',_h-22+'px')
							  //.css('background-image','url('+n.src+')')
							  //.css('background-repeat',config.repeat)
							  //.css('display','block')
							 // .css('float','x,show-x'.indexOf(config.animateStyle)!=-1?'left':'');
				} else {
					$('<img />').appendTo(_imgArea)
							  .width(_w)
							  //.height(198)
							  //.attr('href',n.href?n.href:'')
							  //.attr('target',n.target?n.target:'')
							  .attr('src',n.src)
							  .attr('title',n.title?n.title:'')
							  //.css('width',_w+'px')
							  //.css('height',_h-22+'px')
							  //.css('background-image','url('+n.src+')')
							  //.css('background-repeat',config.repeat)
							  //.css('display','block')
							 // .css('float','x,show-x'.indexOf(config.animateStyle)!=-1?'left':'');
				}
				if(config.title){
				$('<b />').appendTo(_textArea)
						  .html(n.title?n.title:'')
						  .css('display',i==0?'block':'none')
						  .css('fontSize',config.titleSize)
						  .css('fontFamily',config.titleFont)
						  .css('color',config.titleColor)
						  .css('marginTop',config.titleTop)
						  .css('marginLeft',config.titleLeft);
				}
				
				if(config.desc){
				$('<p />').appendTo(_textArea)
						  .html(n.desc?n.desc:'')
						  .css('display',i==0?'block':'none')
						  .css('fontSize',config.descSize)
						  .css('fontFamily',config.descFont)
						  .css('color',config.descColor)
						  .css('marginTop',config.descTop)
						  .css('marginLeft',config.descLeft);
				}
				  
				if(!config.index){		  
					$('<a />').appendTo(_btnArea)
							  //.width(config.btnWidth)
							  //.height(config.btnHeight)
							  .html(n.title+'&nbsp;.&nbsp;')
							  //.css('fontSize',config.btnFontSize)
							  //.css('fontFamily',config.btnFont)
							  //.css('textAlign','center')
							  //.css('display','block')
							  //.css('float','left')
							  //.css('overflow','hidden')
							  //.css('marginTop',config.btnTop)
							  //.css('marginRight',config.btnMargin)
							  //.css('background-color',config.btnColor)
							  //.css('opacity',i==0?1:config.btnOpacity)
							  //.css('color',config.btnFontColor)
							  //.css('cursor','pointer')
							  .css('color',i==0?'#603813':'#ccc')
							  .addClass(i==0?'current_n':'')
				} else {
					$("<a class='prev first'></a><a class='next'></a>").appendTo(_btnArea)
						.html(n.title+'&nbsp;.&nbsp;')
				}

			});
			
			// 保存所有元素集合的引用,方便在事件中使用
			var _bs = _btnArea.children('a');
			var _ts = _textArea.children('b');
			var _ds = _textArea.children('p');
			var _is = _imgArea.children('img');

			// 针对不同的动画效果的附加设置, 主要是block的问题, 若在初始化时设置block:none会造成之后无block效果
			if('o,show,none'.indexOf(config.animateStyle)!=-1){
				_is.not(':first').hide();
				//_is.css('position','absolute');
			}
			
			_bs.mouseover(function(){
				$(this).addClass('current')
			})
			_bs.mouseout(function(){
				$(this).removeClass('current')
			})
			
			// 添加按钮事件
			_bs.mouseover(function(){
				config.animateStyle = 'o'
			})
			_bs.mouseout(function(){
				config.animateStyle = 'o'
			})
			
			//首页效果
			if(config.index){
				$('.list a.next').click(function(){
					inPlay(1)
				})
				$('.list a.prev').click(function(){
					inPlay(-1)
				})
			
			} else{
			
			_bs.click(function(){
				var ii = config.index?_i+1:_bs.index(this);
				if(ii==_i){return;}
				
				_ts.eq(_i).css('display','none');
				_ts.eq(ii).css('display','block');
				_ds.eq(_i).css('display','none');
				_ds.eq(ii).css('display','block');
				//_bs.eq(_i).css('opacity',config.bgOpacity);
				//_bs.eq(ii).css('opacity',1)
				_bs.eq(_i).css('color','#ccc');
				_bs.eq(_i).removeClass("current_n")
				_bs.eq(ii).addClass("current_n")
				
				$(".bgBtn a.sPlay").attr('href',data[ii]['href']).attr('target','_parent')
				$(".bgBtn a.sDownload").attr('href',data[ii]['file'])
				
				switch(config.animateStyle){
				case 'o' :
					_is.eq(_i).fadeOut(config.animateTime);
					_is.eq(ii).fadeIn(config.animateTime);
					break;
				case 'x' :
					_imgArea.animate({marginLeft:-ii*_w},config.animateTime);
					break;
				case 'y' :
					_imgArea.animate({marginTop:-ii*_h},config.animateTime);
					break;
				case 'show' :
				case 'show-x' :
				case 'show-y' :
					_is.eq(_i).hide(config.animateTime);
					_is.eq(ii).show(config.animateTime);
					break;				
				case 'none' :
					_is.eq(_i).hide();
					_is.eq(ii).show();
					break;				
				}
				_i = ii;
			});
			}
			
			function inPlay(iii){
				var ii = config.index?_i+iii:_bs.index(this);
					if(ii<=-1){
						$('.list a.prev').addClass("first")
						$('.list a.next').removeClass("last")
					} 
					else if(ii>=data.length){
						$('.list a.prev').removeClass("first")
						$('.list a.next').addClass("last")
					} else {
						if(ii<1){
							$('.list a.prev').addClass("first")
						} else {
							$('.list a.prev').removeClass("first")
						}
						if(ii>=data.length-1){
							$('.list a.next').addClass("last")
						} else {
							$('.list a.next').removeClass("last")
						}					
					
					switch(config.animateStyle){
					case 'o' :
						_is.eq(_i).fadeOut(config.animateTime);
						_is.eq(ii).fadeIn(config.animateTime);
						break;
					case 'x' :
						_imgArea.animate({marginLeft:-ii*_w},config.animateTime);
						break;
					case 'y' :
						_imgArea.animate({marginTop:-ii*_h},config.animateTime);
						break;
					case 'show' :
					case 'show-x' :
					case 'show-y' :
						_is.eq(_i).hide(config.animateTime);
						_is.eq(ii).show(config.animateTime);
						break;				
					case 'none' :
						_is.eq(_i).hide();
						_is.eq(ii).show();
						break;				
					}
					_i = ii;
				}	
			}
			
			// 添加轮换任务
			if(config.index){
				var _play = setInterval(play,30000);
			} else {
				var _play = setInterval(play,config.playTime);
			}
			
			function play(){
				_bs.eq((_i+1)%_n).click()
				
			}		
			// 鼠标进入事件
			_is.mouseover(function(){
				//clearInterval(_play);
			});
			_bs.mouseover(function(){
				//clearInterval(_play);
			});
			
			_bs.mousedown(function(){
				clearInterval(_play);			
				_play = setInterval(clickDlay,30000);
			})
			
			// 鼠标离开事件
			_is.mouseout(function(){
				//_play = setInterval(play,config.playTime);
			});
			_bs.mouseout(function(){
				//_play = setInterval(play,config.playTime);
			});
			
			function clickDlay(){
				clearInterval(_play)
				if(config.index){
					_play = setInterval(play,30000);
				} else {
					_play = setInterval(play,4000);
				}
			}
		});
	}
});
})(jQuery);