/*
模块: 图像水平滚动[imageScroll]
更新: 10:26 2007-2-27
参数: 
	@param  elm{String|Dom node}  需要添加滚动效果的模块 id
	@param  opt{Object}  动画效果的一些设置
返回值: {Object}
功能: 将图片列表滚动起来(水平滚动)
页面结构限制: 
	在 div.image_list_box 之外添加id
	每个id 下面只能有1 个ul
	每个ul 下面的图片必须足够多(不能在1 行完全显示)才会滚动
*/

function ImageScroll(elmId, opt){
	var elmRoot;
	if(typeof elmId === 'string'){
		elmRoot= jQuery('#'+elmId);
	}else{
		elmRoot= jQuery(elmId);
	}
	if(!elmRoot.length){return;}
	var scrollDir= 'l';
	var scrollSpeed= 30;//1000/50 单位 ms/px
	var scrollPropName= 'left',
		itemSizePropName= 'offsetLeft',
		viewAreaSizePropName= 'width';

	var aviableDir= {'l':'l',
					 'left':'l',
					 'r':'r',
					 'right':'r',
					 'b':'b',
					 'bottom':'b',
					 't':'t',
					 'top':'t'};
	if(opt){
		('dir' in opt) && (opt.dir in aviableDir) && (scrollDir = aviableDir[opt.dir]);
	}
	var scrollH= (scrollDir === 'r' || scrollDir === 'l');
	if(!scrollH){
		scrollPropName= 'top';
		itemSizePropName= 'offsetTop';
		viewAreaSizePropName= 'height';
	}
    
	var items= elmRoot.find('> div > ul > li'),//所有图片框的集合
		itemNum= items.length,

		scroller= items.parent(),//存放图片的ul, 滚动动画就是靠控制它的位置来实现的(滚动的整体)
		scrollerW= scroller.parent(),
		item0= items[0],
		itemSize= items[1][itemSizePropName] - item0[itemSizePropName],//一个图片框的宽度,
		viewAreaSize= scrollerW[viewAreaSizePropName]();

	if(scrollH && (scroller.height() < (1.2 * items.height()))){//如果没有2 行，则返回
		return;
	}

	if(scrollH){
		scrollerW.css({ 'width':viewAreaSize,
						'position':'relative',
						'overflow':'hidden'});
		scroller.css({'width':9999, 'position':'relative'});
	}else{
		elmRoot.css('overflow', 'hidden');
		scroller.css('position', 'relative');
	}

	jQuery.each(items.slice(0, Math.ceil(viewAreaSize / itemSize)),
			 function(i, _item){
				 scroller.append(_item.cloneNode(true));
			 });
	items= scroller.children('li');
	var scrollArea= [0, -items[itemNum][itemSizePropName]];
	// 如果是向 左 或是 下 滚动，则互换滚动值域
	if(scrollDir === 'r' || scrollDir === 'b'){
		scrollArea[2]= scrollArea[0];
		scrollArea[0]= scrollArea[1];
		scrollArea[1]= scrollArea[2];
		scrollArea.length= 2;
	}

	function getScrollDuration(){
		return Math.abs(scrollSpeed * ((parseInt(scroller.css(scrollPropName), 10) || 0) - scrollArea[1]));
	}
	
    // 这个地方比较诡异，需要注意
	var scrollProp= {};
	scrollProp[scrollPropName]= scrollArea[1];
	scroller.css(scrollPropName, scrollArea[0]);
	function _scroll(){
		scroller.animate(scrollProp,
						 {"duration": getScrollDuration(),
						  "easing": "linear",
						  'complete': function(){scroller.css(scrollPropName, scrollArea[0]);_scroll();}
						 });
	}
    
	function startScroll(start){
		scroller.stop();
		// 明确给定说 start 才 start
		(start === true) && _scroll();
	}
	scrollerW.hover(startScroll, function(){startScroll(true);});
	startScroll(true);
}

function imageScroll(elmId, opt){
	
	jQuery(function(){
		var _f= new ImageScroll(elmId, opt);
		_f= null;
	});
}
function imageScrollV(elmId, opt){
	jQuery(function(){
		if(!opt || !('dir' in opt)){
			opt= {'dir': 't'};
		}
		var _f= new ImageScroll(elmId, opt);
		_f= null;
	});
}