/**
 * class imgFllow
 * @description 图片动态显示类
 * @require ae.js
 */
if( !AE.widget.imgFllow ){
	AE.widget.imgFllow = function(){
			var _self = this,
					// 图片DOM数组
					defImgs = [],
					// 当前图片索引值
					currentImgInx = 0,
					// 当前图片子容器
					currentSubContainer = null,
					// 模拟滚动窗口(显示区)
					scrollMask = null;
	
			var defConfig = {
				container: {
					// 模拟滚动窗口(显示区)ID
					scrollMaskId: '',
					// 滚动容器ID
					scrollBodyId: '',
					// 滚动时间
					scrollRotation: 0.3
				},
				image : {
					// 图片组ID,用于getElementsByClassName() parentNode参数
					groupId: '',
					// 当前图片子容器TagName
					subContainerTag: '',
					// 图片子容器默认样式
					subContainerClass: '',
					// 当前图片子容器样式
					subContainerCurrentClass: '',
					// 图片动画事件触发类型
					handleEvent: '',
					// 图片默认样式
					styleClass: '',
					// 当前图片样式
					currentClass: 'current',
					// 图片尺寸最小值
					zoomOutSize: [98,71],
					// 图片尺寸最大值
					zoomInSize: [140,104],
					// 缩放事件
					zoomRotation: 0.3,
					// 图片默认透明度
					opacityNormal: 0.5,
					// 当前图片透明度
					opacityActive: 1,
					// 透明度渐变周期
					opacityRotation: 0.2
				},
				control : {
					// 前向控制按钮ID
					btnPrevId: '',
					// 后向控制按钮ID
					btnNextId: '',
					// 控制按钮事件触发类型
					handleEvent: 'click'
				}
			};
			
			_self.init = function(userConifg){
				defConfig = YL.merge(defConfig,userConifg);
				
				var imageInitResult = initImages(defConfig.image);
				var totalSize = imageInitResult.totalSize;
				defImgs = imageInitResult.imgArray;
				
				var containerInitResult = initContainer(defConfig.container, totalSize);
				scrollMask = containerInitResult.scrollMask;
				
				initControl(defConfig.control);
				_self.view(defConfig.image.currentClass);
			};
			
			_self.view = function(imgFlag){
				if(!currentImg && defImgs.length == 0){return;}
				var imgConfig = defConfig.image,
						zoomOutSize = imgConfig.zoomOutSize,
						zoomInSize = imgConfig.zoomInSize,
						zoomRotation = imgConfig.zoomRotation,
						opacityNormal = imgConfig.opacityNormal,
						opacityActive = imgConfig.opacityActive,
						opacityRotation = imgConfig.opacityRotation,
						currentClass = imgConfig.currentClass,
						subContainerTag = imgConfig.subContainerTag,
						subContainerClass = imgConfig.subContainerClass,
						subContainerCurrentClass = imgConfig.subContainerCurrentClass,
						scrollRotation = defConfig.container.scrollRotation;
				
				var imgInx = getImgInx(imgFlag),
						img = defImgs[imgInx],
						currentImg = defImgs[currentImgInx],
						subContainer = getTheParent(img, subContainerTag);
				
				var zoomOutStart = function(){
					currentSubContainer.className = '';
					YUD.removeClass(currentImg,currentClass);
					YUE.addListener(currentImg, 'mouseout', _self.imgOnMouseout);
				};
				
				var zoomOutEnd = function(){
					currentSubContainer.className = subContainerClass;
				};
				
				var zoomInEnd = function(){
					subContainer.className = subContainerCurrentClass;
					YUD.addClass(img, currentClass);
					YUE.removeListener(img, 'mouseout', _self.imgOnMouseout);
					displayMsg(img.alt, imgConfig.msgBoxId);
					_scroll(img, scrollMask, scrollRotation);
					currentImgInx = imgInx;
					currentSubContainer = subContainer;
				};
				
				if(imgInx != currentImgInx){
					zoomTo(currentImg, zoomOutSize, zoomRotation, {onStart: zoomOutStart, onComplete: zoomOutEnd});
					imgAlpha(currentImg, opacityNormal, scrollRotation);
				}
				
				zoomTo(img, zoomInSize, zoomRotation, {onComplete: zoomInEnd});
				imgAlpha(img, opacityActive, opacityRotation);
			};
			
			_self.viewPrev = function(){
				if(currentImgInx <=0){return;}
				_self.view(currentImgInx - 1);
				return false;
			};
	
			_self.viewNext = function(){
				if(currentImgInx >= defImgs.length - 1){return;}
				_self.view(currentImgInx + 1);
				return false;
			};
			
			_self.imgOnMouseover = function(){
				var img = this,
						imgConfig = defConfig.image,
						opacity = imgConfig.opacityActive,
						rotation = imgConfig.opacityRotation;
				//displayMsg(img.alt, imgConfig.msgBoxId);
				imgAlpha(img, opacity, rotation);
			};
			
			_self.imgOnMouseout  = function(){
				var img = this,
						imgConfig = defConfig.image,
						opacity = imgConfig.opacityNormal,
						rotation = imgConfig.opacityRotation;
				displayMsg(defImgs[currentImgInx].alt, imgConfig.msgBoxId);
				imgAlpha(img, opacity, rotation);
			};
			
			var initContainer = function(containerConfig, totalImgSize){
				var cfg = containerConfig,
						scrollMask = get(cfg.scrollMaskId),
						scrollBody = get(cfg.scrollBodyId);
				YUD.setStyle(scrollMask,'overflow','hidden');
				if(cfg.scrollDirect == 'lr'){
					YUD.setStyle(scrollBody,'width',(totalImgSize[0] * 3) + 'px');
				}else if(cfg.scrollDirect == 'ud'){
					YUD.setStyle(scrollBody,'height',(totalImgSize[1] * 3) + 'px');
				}
				return {scrollMask: scrollMask, scrollBody: scrollBody};
			};
			
			var initImages = function(imageConfig){
				var cfg = imageConfig
						imgGroup = get(cfg.groupId),
						imgs = YUD.getElementsByClassName(cfg.styleClass, 'img', imgGroup),
						result = {imgArray: [], totalSize: [0,0]};
				if(imgs.length == 0){return result;}
				if(!!cfg.handleEvent && cfg.handleEvent != ''){
					var f = function(e){_self.view(this);}
					YUE.on(imgs, cfg.handleEvent,f);
				}
				YUE.on(imgs, 'mouseover', _self.imgOnMouseover);
				YUE.on(imgs, 'mouseout', _self.imgOnMouseout);
				result = {imgArray: imgs, totalSize: totalImgSize(imgs)};
				return result;
			};
			
			var initControl = function(controlConfig){
				var cfg = controlConfig,
						btnPrev = get(cfg.btnPrevId),
						btnNext = get(cfg.btnNextId),
						handle = (cfg.handleEvent == '') ? 'click' : cfg.handleEvent;
				YUE.on([btnPrev, btnNext], 'focus' ,function(){this.blur();});
				YUE.on(btnPrev, handle, _self.viewPrev);
				YUE.on(btnNext, handle, _self.viewNext);
			};
			
			var _scroll = function(el, scrollMask, rotation){
				var coordinate = getScrollXY(el,scrollMask);
				var attributes = {scroll: {to: coordinate}}
				var Scroll = new YAHOO.util.Scroll(scrollMask, attributes, rotation);
				Scroll.animate();
			};
			
			var zoomTo = function(el, size, rotation, eventMethodObj){
				var w = size[0], h = size[1];
				var attributes = {width: {to: w}, height: {to: h}}
				var newZoom = new YAHOO.util.Anim(el, attributes, rotation);
				if(YL.isObject(eventMethodObj)){
					for(var p in eventMethodObj){
						newZoom[p].subscribe(eventMethodObj[p]);
					}
				}
				newZoom.animate();
			};
	
			var imgAlpha = function(el, opacity, rotation){
				var attributes = {opacity: {to: opacity}};
				var f = function(){
					var ieVer = YAHOO.env.ua.ie;
					if(ieVer == 0 || ieVer > 6){return;}
					var el = this.getEl(),
							opacity = this.getAttribute('opacity') * 100;
					if(!el.filters.item('Alpha')){
						YUD.setStyle(el, 'filter', 'Alpha(opacity=' + opacity + ')');
					} else {
						el.filters.item('Alpha').opacity = opacity;
					}
				}
				var animAlpha = new YAHOO.util.Anim(el, attributes, rotation);
				animAlpha.animate();
			}
			
			var displayMsg = function(msg, boxId){
				if(boxId && boxId != ''){
					get(boxId).innerHTML = msg;
				}
			};
			
			var getXYBy = function(el, container){
				var relativeX  = 0,
						relativeY  = 0,
						offsetP    = el;
				while(offsetP && offsetP != container){
					relativeX += offsetP.offsetLeft;
					relativeY += offsetP.offsetTop;
					offsetP    = offsetP.offsetParent;
					}
					return [relativeX,relativeY];
			};
					
			var getScrollXY = function(el, container){
				var relativeXY = getXYBy(el,container),
						elWH  = [el.offsetWidth, el.offsetHeight],
						containerWH = [container.offsetWidth, container.offsetHeight];
				var scrollX = relativeXY[0] - 0.5 * (containerWH[0] - elWH[0]),
						scrollY = relativeXY[1] - 0.5 * (containerWH[1] - elWH[1]);
				return [scrollX, scrollY];
			};
					
			var totalImgSize = function(imgs){
				var img = imgs, w = 0, h = 0;
				for(var i = 0, j = imgs.length; i < j; i++){
					var img = imgs[i];
					w = w + img.offsetWidth;
					h = h + img.offsetHeight;
				}
				return [w, h];
			};
					
			var getImgInx = function(imgFlag){
				var img = imgFlag;
				if(YL.isNumber(imgFlag)){
					return imgFlag;
				}else	if(YL.isString(imgFlag)){
					img = YUD.getElementsByClassName(imgFlag, 'img', scrollMask);
					if(img.length == 0){
						img = get(imgFlag);
					}else{
						img = img[0];
					}
				}
				for(var i = 0, j = defImgs.length; i < j; i++){
					if(img === defImgs[i]){
						return i;
					}
				}
				return 0;
			};
			
			var getTheParent = function(el, tag){
				if(!tag){return}
				var p = el.parentNode;
				while(p){
					p = p.parentNode;
					if(p.tagName.toLowerCase() == tag.toLowerCase()){
						return p;
					}
				}
				return null;
			};
	};
}
