// JavaScript Document

	function swapImage(which, imageNote) {
		document.getElementById("mainImage").src = which;
		if (imageNote == true) {
			alert("true");
			document.getElementById("imageNote").style.visibility = "visible";
		} else if(imageNote) {
			document.getElementById("imageNote").style.visibility = "hidden";
		}
	}

	function moveThis (where, speed) {

		layerWidth = document.getElementById('maskedLayer').offsetWidth;
		stopPoint = parseInt(layerWidth - layerMaskWidth);
		speed = parseInt(speed)

		//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.display = "block";
			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 = "block";
			document.getElementById("maskedLayer").style.left = (-1 * stopPoint) + "px"
		}

	}
	
	function getReady() {
	
	// this function aligns the thumbnail layer and displays arrows if nessasary
		 layerMaskWidth = parseInt(document.getElementById('layerMask').style.width);
		 layerWidth = document.getElementById('maskedLayer').offsetWidth;
		 layerMaskwidth = document.getElementById('layerMask').offsetWidth;
		 wheretostart = parseInt((layerMaskwidth - layerWidth) /2)
		 
		 if (layerWidth > layerMaskWidth) {
		 	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 = "none";
			document.getElementById("rightarrowholder").style.display = "none";
			document.getElementById("maskedLayer").style.left = wheretostart+"px";
			document.getElementById("maskedLayer").style.visibility = "visible";
		 }
	
	}