﻿/*--------------- 使用到的公用函数 ---------------*/

/** 获取id值为eleID的对象*/
function $id(eleID) {
	return document.getElementById(eleID);
}
/** 创建ele的父节点newprarent
 * @param newparent
 * @param ele
 */
function wrap(newparent,ele) {
	if(ele.nextSibling) {
		var n = ele.nextSibling;
		n.parentNode.insertBefore(newparent,n);
	}else if(ele.previousSibling) {
		insertAfter(newparent,ele.previousSibling);
	}else {
		ele.parentNode.appendChild(newparent);
	}
	newparent.appendChild(ele);
}
/** 将fn绑定到tar的ev事件
 * @param tar
 * @param ev
 * @param fn
 */
function addEvent(tar,ev,fn) {
	if(document.attachEvent) {
		tar.attachEvent('on'+ev,fn);
	}else if(document.addEventListener) {
		tar.addEventListener(ev,fn,false);
	}
}
/** 移除tar上ev事件里的fn
 * @param tar
 * @param ev
 * @param fn
 */
function removeEvent(tar,ev,fn) {
	if(document.detachEvent) {
		tar.detachEvent('on'+ev,fn);
	}else if(document.removeEventListener) {
		tar.removeEventListener(ev,fn,false);
	}
}
/** 在tarElement之后插入newElement对象
 * @param newElement 要被插入文档结构的对象。
 * @param targetElement 指定插入点。
 */
function insertAfter(newElement,tarElement) {
	var pnode = tarElement.parentNode;
	if (pnode.lastChild == tarElement) {
		pnode.appendChild(newElement);
	} else {
		pnode.insertBefore(newElement,tarElement.nextSibling);
	}
}
/** 将element插入到tarElement的前面
 * @param element
 * @param tarElement
 */
function prepend(element,tarElement) {
	if(tarElement.firstChild) {
		tarElement.insertBefore(element,tarElement.firstChild);
	}else {
		tarElement.appendChild(element);
	}
}
/** 获取ele的样式属性“value”的值
 * @param ele
 * @param attr
 */
function getStyle(ele,attr) {
	var rs;
	if(ele.style[attr]) {
		rs = ele.style[attr];
	}else if(window.getComputedStyle) {
		attr=attr.replace(/([A-Z])/g,"-$1");
		//value=value.toLowerCase();
		rs = window.getComputedStyle(ele,'').getPropertyValue(attr);
		if(attr == 'color') {rs = colorToHex(rs);} //格式化color为16进制表示
	}else if(ele.currentStyle) {
		rs = ele.currentStyle[attr];
	}else {
		return null;
	}
	return rs;
}
/** 获取ele的整体高度（height+padding+margin+borde），返回一个数值
 * @param ele
 */
function getTotalHeight(ele) {
	var rs = (ele.offsetHeight||0) + (parseInt(getStyle(ele,'marginTop'))||0) + (parseInt(getStyle(ele,'marginBottom'))||0);
	return rs;
}
/** 获取ele的整体宽度（width+padding+margin+border），返回一个数值
 * @param ele
 */
function getTotalWidth(ele) {
	var rs = (ele.offsetWidth||0) + (parseInt(getStyle(ele,'marginLeft')) || 0) + (parseInt(getStyle(ele,'marginRight')) || 0);
	return rs;
}

/*--------------- 使用到的公用函数 END ---------------*/




function moveElement(elem,final_x,final_y,interval) {/*-----  滚动元素  -----*/
/*-----
**参数说明**
elem：目标元素
final_x：在x轴上要移动的距离，等同于该元素最终的style.left值
final_y：在y轴上要移动的距离，等同于该元素最终的style.top值
interval：速度，毫秒
-----*/
	var elem = $id(elem) || elem;
	if(elem.style.position == '') {elem.style.position = 'relative';}
	if (elem.vvmoveElement) {clearInterval(elem.vvmoveElement);}
	if (!elem.style.left) {elem.style.left = "0px";}
	if (!elem.style.top) {elem.style.top = "0px";}
	var xpos = parseInt(elem.style.left);
	var ypos = parseInt(elem.style.top);
	if (xpos == final_x && ypos == final_y) {
		return true;
	}
	if (xpos < final_x) {
		var dist = Math.ceil((final_x - xpos)/10);
		xpos = xpos + dist;
	}
	if (xpos > final_x) {
		var dist = Math.ceil((xpos - final_x)/10);
		xpos = xpos - dist;
	}
	if (ypos < final_y) {
		var dist = Math.ceil((final_y - ypos)/10);
		ypos = ypos + dist;
	}
	if (ypos > final_y) {
		var dist = Math.ceil((ypos - final_y)/10);
		ypos = ypos - dist;
	}
	elem.style.left = xpos + "px";
	elem.style.top = ypos + "px";
	var ele = elem;
	var repeat = 'moveElement("'+elem.getAttribute('id')+'",'+final_x+','+final_y+','+interval+')';
	elem.vvmoveElement = setInterval(repeat,interval);
}

function SCROLLSINGLE() {
	var self = this;

	this.pause = false;

	this.scroll = function (way) {
		if(self.pause && (way != self.scrollKey1 && way!=self.scrollKey2)) {return false;}
		var LI = self.scrollElement.getElementsByTagName(self.child);
		//(左/上移动时)将首个节点移至末尾
		if(parseInt(self.scrollElement.style[self.scrollKey1]) != 0  && way!=self.scrollKey2) {
			self.scrollElement.appendChild(LI[0]);
			self.scrollElement.style[self.scrollKey1] = '0';
		}
		//(右/下移动时)将末尾元素移至首位
		if(way==self.scrollKey2 && parseInt(self.scrollElement.style.top) ==0) {
			var lc = LI[LI.length-1];
			var lcw;
			if(self.mode == 'x') {
				lcw = getTotalWidth(lc);
			}else if(self.mode == 'y') {
				lcw = getTotalHeight(lc);
			}
			self.scrollElement.style[self.scrollKey1] = -lcw + 'px';
			prepend(lc,self.scrollElement);
		}
		//取得scrollElement的左侧/顶部宽度(padding,margin,border)
		//var leftwidth = (parseInt(getStyle(self.scrollElement,'paddingLeft')) ||0)+(parseInt(getStyle(self.scrollElement,'marginLeft')) ||0)+(parseInt(getStyle(self.scrollElement,'borderLeftWidth')) ||0);
		var leftwidth = 0;
		//获取首个节点的宽度/高度
		var cw;
		if(self.mode == 'x') {
			cw = getTotalWidth(LI[0]);
		}else if(self.mode == 'y') {
			cw = getTotalHeight(LI[0]);
		}
		if(way == self.scrollKey2) {cw = leftwidth;}
		else {cw = -cw-leftwidth;}
		//获取当前scrollElement的left/top值
		var cl = getStyle(self.scrollElement,self.scrollKey1);
		cl = (cl=='auto')?0:parseInt(cl);
		//开始滚动
		if(self.mode == 'x') {
			moveElement(self.scrollElement,cw,0,30);
		}else if(self.mode == 'y') {
			moveElement(self.scrollElement,0,cw,30);
		}
	}
	this.creatBtn = function () {//按钮初始化
		var paused = function () {
			self.pause = true;
		};
		var goon = function () {
			self.pause = false;
		};
		var s1 = function () {
			self.scroll(self.scrollKey1);
		};
		var s2 = function () {
			self.scroll(self.scrollKey2);
		};
		var scrollwrap = $id(self.scrollElement.getAttribute('id')+'_scrollWrap_vv');
		if(self.btn1) {
			var botton1;
			if(self.btn1.nodeType) {
				botton1 = self.btn1;
			}else if(typeof(self.btn1) == 'string') {
				botton1 = document.createElement('a');
				botton1.className = self.btn1;
				scrollwrap.appendChild(botton1);
			}
			addEvent(botton1,'mouseover',paused);
			addEvent(botton1,'mouseout',goon);
			//addEvent(botton1,'click',s1);
			botton1.onclick = function () {
				s1();
				return false;
			}
		}
		if(self.btn2) {
			var botton2;
			if(self.btn2.nodeType) {
				botton2 = self.btn2;
			}else if(typeof(self.btn2) == 'string') {
				botton2 = document.createElement('a');
				botton2.className = self.btn2;
				scrollwrap.appendChild(botton2);
			}
			addEvent(botton2,'mouseover',paused);
			addEvent(botton2,'mouseout',goon);
			//addEvent(botton2,'click',s2);
			botton2.onclick = function () {
				s2();
				return false;
			}
		}
	}
	this.start = function () {
		if(self.mode == 'x') {
			self.scrollKey1 = 'left';
			self.scrollKey2 = 'right';
		}else if(self.mode == 'y') {
			self.scrollKey1 = 'top';
			self.scrollKey2 = 'bottom';
		}
		var LI = self.scrollElement.getElementsByTagName(self.child);
		if(LI.length <= self.num) {
			clearInterval(self.scrollElement.vvscrollSingle);
			try {
				(self.leftBtn).style.display = 'none';
				(self.rightBtn).style.display = 'none';
			}catch(e) {}
			return false;
		}
		if($id(self.scrollElement.getAttribute('id')+'_scrollWrap_vv')) {return false;}
		//创建外包层
		var h = self.h + 'px';
		var w = self.w + 'px';
		var scrollWrap = document.createElement('div');
		scrollWrap.setAttribute('id',self.scrollElement.getAttribute('id')+'_scrollWrap_vv');
		with(scrollWrap.style) {
			height = h;
			width = w;
			overflow = 'hidden';
			position = 'relative';
		}
		wrap(scrollWrap,self.scrollElement);
		//初始化scrollElement的样式
		if (!self.scrollElement.style.left) {self.scrollElement.style.left = "0px";}
		if (!self.scrollElement.style.top) {self.scrollElement.style.top = "0px";}
		with(self.scrollElement.style) {
			if(self.mode == 'x') {width = '999999px';}
			if(self.mode == 'y') {height = '999999px';}
			margin='0';
			padding='0';
			border='none';
		}

		self.creatBtn();
        if(self.delay != 0)
		    setInterval(self.scroll,self.delay);
	}

}
function scrollSingle(mode,element,w,h,childTag,num,delay,btn1,btn2) {
/*-----
**参数说明**
mode：必填项，滚动类型，“x”为横向滚动，“y”为纵向滚动
element：目标元素，必填
w：宽度，必填，纯数字
h：高度，必填，纯数字
childTag：目标元素的需要进行滚动的子节点tagName，必填
num:必要的子元素个数，默认为5（<=该数值时，按钮不显示，不滚动），纯数字
delay：延迟时间，可选，单位为毫秒，默认为3000，纯数字
leftBtn：左/上滚动按钮，可选；可以是已有元素或者该按钮的className（若是className，将会创建<a>节点，此法未完成）
rightBtn：右/下滚动按钮，可选；可以是已有元素或者该按钮的className（若是className，将会创建<a>节点，此法未完成）
-----*/
	var ss = new SCROLLSINGLE();
	ss.mode = mode;
	ss.scrollElement = element;
	ss.w = w;
	ss.h = h;
	ss.child = childTag; //子节点的tagName
	ss.num = num||5;
	ss.delay = delay;//暂停时间
	ss.btn1 = btn1;//左移按钮
	ss.btn2 = btn2;//右移按钮

	ss.start();
}

