﻿function swapImage(id,which) {
	document.getElementById(id).src = which;
}

var t;
stopWidth = 272;
function moveThis (where, speed, accessories) {

	layerWidth = document.getElementById('maskedLayer').offsetWidth;
	stopPoint = parseInt(layerWidth - stopWidth);	
	speed = parseInt(speed)
	clearInterval(t)

	//if stopping
	if(where == "stop") {
		clearInterval(t);
	}

	// if moving right
	if (where == "right" && parseInt(document.getElementById("maskedLayer").style.left) < 0 ) {
		document.getElementById("maskedLayer").style.left = (parseInt(document.getElementById("maskedLayer").style.left) + speed) + "px";
		t = setTimeout("moveThis('right', '"+speed+"')",1)
		document.getElementById("rightarrowholder").style.display = "block";
	} else if (where == "right" && parseInt(document.getElementById("maskedLayer").style.left) >= 0) {
		clearTimeout(t);
		//document.getElementById("leftarrowholder").style.src = "none";
		//document.getElementById("maskedLayer").style.left = "0px"
		//alert('clear right')
	}

	//if moving left
	if (where == "left" && parseInt(document.getElementById("maskedLayer").style.left) > (-1 * stopPoint)) {
		document.getElementById("maskedLayer").style.left = (parseInt(document.getElementById("maskedLayer").style.left) - speed) + "px";
		t = setTimeout("moveThis('left', '"+speed+"')",1)
		document.getElementById("leftarrowholder").style.display = "block";
	} else if (where == "left" && parseInt(document.getElementById("maskedLayer").style.left) <= (-1 * stopPoint)) {
		clearTimeout(t);
//		document.getElementById("rightarrowholder").style.display = "none";
		//document.getElementById("maskedLayer").style.left = (-1 * stopPoint) + "px"
	}

}

function getReady(imageCount) {


	 maskedLayerwidth = document.getElementById('maskedLayer').offsetWidth;
	 layerMaskwidth = document.getElementById('layerMask').offsetWidth;
	 wheretostart = parseInt((layerMaskwidth - maskedLayerwidth) /2)
	 layerWidth = document.getElementById('maskedLayer').offsetWidth;
    
	 if (imageCount > 3) {
	 	document.getElementById("leftarrowholder").style.display = "block";
		document.getElementById("rightarrowholder").style.display = "block";
		document.getElementById("maskedLayer").style.left ="0px";
		document.getElementById("maskedLayer").style.visibility = "visible";
	 } else {
	 	document.getElementById("leftarrowholder").style.display = "block";
	 	document.getElementById("leftarrowholder").style.visibility = "hidden";
		document.getElementById("rightarrowholder").style.display = "none";
		document.getElementById("maskedLayer").style.left = "1px";
		document.getElementById("maskedLayer").style.visibility = "visible";
	 }

}
