// JavaScript Document



/* Rolling Banner Start */
function bingRolling(/* 리스트id */ target, /* 레프트버튼id */ leftBtn, /* 라이트버튼id */ rightBtn, /* 리스트가 움직일 갯수 */ listCnt, showIMG){
	this.xScrollTo = 0; // 목표지점
	this.xScrollFrom = 0; // 출발당시지점
	this.moveListCnt = listCnt; // 리스트가 움직일 갯수
	this.actionFlag = true; // 버튼클릭이 중복되지 않게 변수로 체크

	this.target = document.getElementById(target); /* 리스트타겟 */
	this.targetCoverWidth = this.target.parentNode.offsetWidth; /* 리스트를 감싸며 레이어속성인 놈의~ 총넓이(리스트레이어의 딱 넓이 만큼) */
	this.rollingList = this.target.getElementsByTagName("LI");
	this.rollingListWidth = this.rollingList[0].offsetWidth; /* 상품리스트들의 개별넓이 */
	this.leftBtn = document.getElementById(leftBtn); /* 레프트버튼 */
	this.rightBtn = document.getElementById(rightBtn); /* 라이트버튼 */
	this.showIMG = document.getElementById(showIMG); // 큰이미지 보여줄애
	this.visibleListCnt =  parseFloat(this.targetCoverWidth/this.rollingListWidth, 10)

	var target = this.target;
	target.style.left = this.getStyle(target, "left") + "px";
	target.style.top = this.getStyle(target, "top") + "px";
	target.style.width = (this.rollingListWidth * this.rollingList.length) + "px";
	this.showPicture();
}
bingRolling.prototype.init = function(num){ // 초기 페이지에 맞는 리스트목록으로 이동
	if(!num) return false;
	var target = this.target;
	this.xScrollTo = -(this.rollingListWidth * --num);
	this.xScrollFrom = 0;
	this.action();
}
bingRolling.prototype.showPicture = function(num){ // 이미지 보기와 활성화
	var img = this.target.getElementsByTagName("IMG");
	var showIMG = this.showIMG;
	var func = this;
	for(var i=0; i<img.length; i++){
		img[i].onclick = function(){
			for(var y=0; y<img.length; y++){ img[y].className = " "; }
			this.className = "current";
			showIMG.src = this.getAttribute("alt");
			return false;
		}
	}
}
bingRolling.prototype.getStyle = function(ele, what){ // css스타일을 얻을때 사용하는 함수
    var target = ele;
    var value = "";
    if(target.currentStyle){
        value = target.currentStyle[what];
    }else if(window.getComputedStyle){
        value = window.getComputedStyle(target,null)[what];
    }
    return parseInt(value, 10);
}
bingRolling.prototype.leftMove = function(){ // 왼쪽방향 << 이미지가 클릭되었을때
	if(this.actionFlag == false) return false;
	var target = this.target;
	if(this.getStyle(target, "left") >= 0){
		this.init(parseInt(this.rollingList.length/this.moveListCnt, 10)*this.moveListCnt+1);
		return false;
	}
	this.xScrollTo = this.getStyle(target, "left") + (this.rollingListWidth * this.moveListCnt);
	this.xScrollFrom = this.getStyle(target, "left");
	this.actionFlag = false;
	this.action();
}
bingRolling.prototype.rightMove = function(){ // 오른쪽방향 >> 이미지가 클릭되었을때
	if(this.actionFlag == false) return false;
	var target = this.target;
	if(this.getStyle(target, "left")-5 <= -(this.rollingListWidth*(this.rollingList.length - this.visibleListCnt))){
		this.init(1);
		return false;
	} 
	this.xScrollTo = this.getStyle(target, "left") - (this.rollingListWidth * this.moveListCnt);
	this.xScrollFrom = this.getStyle(target, "left");
	this.actionFlag = false;
	this.action();
}
bingRolling.prototype.action = function(){ // 리스트들 움직이는 동작부분
	var xScrollTo = this.xScrollTo;
	var xScrollFrom = this.xScrollFrom;
	var func = this;
	var target = this.target;
	var func_bingRolling = setInterval(function(){
		if(xScrollTo > xScrollFrom){
			var speed = Math.ceil((xScrollTo - xScrollFrom) * 0.2);
		}else if(xScrollTo <= xScrollFrom){
			var speed = Math.floor((xScrollTo - xScrollFrom) * 0.2);
		}
		target.style.left = (func.getStyle(target, "left") + speed) + "px";
		xScrollFrom = func.getStyle(target, "left");
		if(Math.abs(Math.abs(xScrollTo) - Math.abs(xScrollFrom)) == 0){
			func.actionFlag = true;
			clearInterval(func_bingRolling);
		}
	}, 36);
}