var isIE = false;
var req;
var images = new Array;
var selectedIndex = 0;
var mouseX;

function prepareThumbs() {
	if(!document.getElementById || !document.getElementsByTagName || !document.getElementById('gallerythumbs')) return false;
	
	var thumbList = document.getElementById('gallerythumbs');
	var thumbLI = thumbList.getElementsByTagName('LI');
	for (var i=0; i < thumbLI.length; i++) {
		var thumbDesc =  thumbLI[i].firstChild.firstChild.getAttribute('title');
		var thumbName =  thumbLI[i].firstChild.firstChild.getAttribute('alt');
		var thumbSrc = thumbLI[i].firstChild.firstChild.getAttribute('src');
		var bigpicSrc = thumbSrc.replace('_tn', '_lg');
		var image = new Array(bigpicSrc,thumbName,thumbDesc,thumbSrc);
		images[images.length] = image;

		thumbLI[i].ref = i;
		thumbLI[i].onclick = function () {
			selectedIndex = this.ref;
			swapImage();
			return false;
		}

		var biglink = document.getElementById('biglink');
		biglink.onclick = function () {
			//popupBigUn(this.getAttribute('href'));
			return false;
		}

	}
}


function swapImage() {
	var bigimage = document.getElementById('mainimage');
	var biglink = document.getElementById('biglink');
	var piclink = document.getElementById('piclink');

	setOpacity(bigimage,0);
	bigimage.setAttribute('src',images[selectedIndex][0]);
	bigimage.setAttribute('alt',images[selectedIndex][1]);
	biglink.setAttribute('title',images[selectedIndex][1]);
	piclink.setAttribute('title',images[selectedIndex][1]);
	piclink.setAttribute('href',images[selectedIndex][0]);
	document.getElementById('galleryimage').className = 'disc';

	bigimage.onload = function () {
		document.getElementById('galleryimage').className = 'nodisc';
		fadeIn('mainimage',0);
	};
	
	var imgTitle = document.getElementById('imgTitle');
	imgTitle.removeChild(imgTitle.firstChild);
	var price = document.getElementById('price');
	price.removeChild(price.firstChild);
	var desc = document.getElementById('desc');
	desc.removeChild(desc.firstChild);
	
	
	
	var titleString = images[selectedIndex][1];
	var firstBracket = titleString.indexOf('(');
	var lastBracket = titleString.indexOf(')');
	var newprice = titleString.substring(firstBracket+1,lastBracket);
	//alert('newprice=' + newprice);
	var newheader = titleString.substring(0,firstBracket-1);
	
	var newheader = document.createTextNode(newheader);
	imgTitle.appendChild(newheader);
	
	var newdesc = document.createTextNode(images[selectedIndex][2]);
	desc.appendChild(newdesc);
	
	var newprice = document.createTextNode(newprice);
	price.appendChild(newprice);
	
	//alert(firstBracket);
	
	
	
	
	var biglink = document.getElementById('biglink');
	biglink.setAttribute('href',images[selectedIndex][0]);

	var thumbList = document.getElementById('gallerythumbs');
	var thumbs = thumbList.getElementsByTagName('LI');
	for (var i=0; i<thumbs.length; i++) {
		if(thumbs[i].firstChild.className == 'selected') {
			thumbs[i].firstChild.className = '';
		}
	}
	for (var i=0; i<thumbs.length; i++) {
		if(i == selectedIndex) {
			thumbs[i].firstChild.className = 'selected';
		}
	}
}

function fadeIn(objId,opacity) {
  if (document.getElementById) {
    obj = document.getElementById(objId);
    if (opacity <= 100) {
      setOpacity(obj, opacity);
      opacity += 10;
      window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100);
    }
  }
}

function setOpacity(obj, opacity) {
  opacity = (opacity == 100)?99.999:opacity;
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;
  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
	return true;
}

function slider()  {
	addArrows();
	//add the styles for the slider
	
	css = document.createElement("link");
	css.setAttribute("href","slider.css");
	css.setAttribute("rel","stylesheet");
	css.setAttribute("type","text/css");
	document.getElementsByTagName("head")[0].appendChild(css);
	
	var thumbList = document.getElementById('gallerythumbs');
	var thumbs = thumbList.getElementsByTagName('LI');
	var panel = document.getElementById('panel2');
	panel.style.width = (thumbs.length * 83) +"px";

	var timer = null;
	
	var lefttimer = null;
	var righttimer = null;
	
	
	document.getElementById('rightArrow').onmousedown = function() {
		lefttimer = setInterval("moveThumbsLeft()",10);
		//alert('bob');
		return false;
	}
	document.getElementById('rightArrow').onmouseup = function() {
		clearInterval(lefttimer);
		return false;
	}
	
	document.getElementById('leftArrow').onmousedown = function() {
		righttimer = setInterval("moveThumbsRight()",10);
		return false;
	}
	document.getElementById('leftArrow').onmouseup = function() {
		clearInterval(righttimer);
		return false;
	}
	document.getElementById('leftArrow').onclick =function() {
	return false;	
	}
	document.getElementById('rightArrow').onclick =function() {
	return false;	
	}
	
	
	//document.getElementById('panel1').onmouseover = function() {
		//trackthemouse();
		//timer = setInterval("movePanel()",10);
	//}
	//document.getElementById('panel1').onmouseout = function() {
		//donttrackthemouse();
		//clearInterval(timer);
	//}

	var links = thumbList.getElementsByTagName('A');
	for (var i=0; i<links.length; i++) {
		if(links[i].getAttribute('id') == "moveLeft") {
			var ref = this;
			links[i].timerleft = null;
			links[i].onmouseover = function() {
				ref.timerleft = setInterval("moveLeft(2)",10);
			}
			links[i].onmouseout = function() {
				clearInterval(ref.timerleft);
			}
		}
		if(links[i].getAttribute('id') == "moveRight") {
			var ref = this;
			links[i].timerright = null;
			links[i].onmouseover = function() {
				ref.timerright = setInterval("moveRight(2)",10);
			}
			links[i].onmouseout = function() {
				clearInterval(ref.timerright);
			}
		}
	}
}


function addArrows () {
	
	var thumbs = document.getElementById('gallerythumbs');
	
	var leftarrow = document.createElement("a");
	var leftarrowtext = document.createTextNode('<');
	leftarrow.appendChild(leftarrowtext);
	thumbs.appendChild(leftarrow);
	leftarrow.setAttribute('id','leftArrow');
	leftarrow.setAttribute('href','#');
	
	var rightarrow = document.createElement("a");
	var rightarrowtext = document.createTextNode('>');
	rightarrow.appendChild(rightarrowtext);
	thumbs.appendChild(rightarrow);
	rightarrow.setAttribute('id','rightArrow');
	rightarrow.setAttribute('href','#');
}

function moveThumbsLeft() {
	moveLeft(5);
}
function moveThumbsRight() {
	moveRight(5);
}
///////////////////////////////


function trackthemouse() {
	document.onmousemove = getMouseXY;
	var IE = document.all?true:false;
	if (!IE) document.captureEvents(Event.MOUSEMOVE);
	function getMouseXY(e) {
		if (IE) {
			tempX = event.clientX + document.body.scrollLeft
		} else {
			tempX = e.pageX
		} 
	if (self.innerWidth) {
		frameWidth = self.innerWidth;
	}
	else if (document.documentElement && document.documentElement.clientWidth) {
		frameWidth = document.documentElement.clientWidth;
	}
	else if (document.body) {
		frameWidth = document.body.clientWidth;
	}

	var windowMiddle = (frameWidth/2);

	if (tempX < 0) {
		tempX = 0;
	}
		mouseX = tempX - windowMiddle;
	}
}

function donttrackthemouse() {
	document.onmousemove = null;
}


function movePanel() {
	var panel = document.getElementById('panel2');
	var distance = mouseX/30;
	if (distance < 0)	{
		distance = -(distance);
	}
	if (mouseX < 0) {
		moveRight(distance);
	}
	// If the mouse moves to the right, the photo will scroll to the left:
	if (mouseX > 0) {
		moveLeft(distance);
	}
}

function moveLeft(distance) {
	var panel1 = document.getElementById('panel1');
	var panel2 = document.getElementById('panel2');
	var panel1width = parseInt(panel1.offsetWidth);
	var panel2width = parseInt(panel2.offsetWidth);
	var panel2X = panel2.offsetLeft;
	var limit = 0 - panel2width + panel1width;
	if(panel2X <= 0 && panel2X > limit) {
		panel2X  = panel2X - distance;
		panel2.style.left = panel2X +"px";
		if(panel2X > limit && panel2X <= limit + distance) {
			panel2X  = limit;
			panel2.style.left = panel2X +"px";
		}
	}
}

function moveRight(distance) {
	var panel2 = document.getElementById('panel2');
	var panel2X = panel2.offsetLeft;
	if(panel2X >= 0 - distance) {
		panel2X  = panel2X + distance;
		panel2.style.left = 0 +"px";
	}
	if(panel2X < 0 ) {
		panel2X  = panel2X + distance;
		panel2.style.left = panel2X +"px";
	}
}



//addLoadEvent(addSlideshow);
addLoadEvent(prepareThumbs);
addLoadEvent(slider);