var pd = new Array();
var pr, pact, cp, fr;
function lp(id) {
	activeimg = 0;
	cp = 0;

	// (1) put "loading" spinner in catlight

	// (2) show catlight
	document.getElementById('catoview').innerHTML = '<p><i>loading...</i></p>';	
	document.getElementById('catshow').innerHTML = '<p><i>loading...</i></p>';	
	scl();

	// (3) fetch
	fp(id, 'sp(data)');
}
loadImg = function(){
	// check if has loaded allready, and if so, abandon it. 
	if( this.hasloaded ) { return; }
	// if not, mark it as having already run 
	this.hasloaded = true;
	// do the desired action
	scl();
}
function scl() {
	var vp = viewport();
	var cl = document.getElementById('catlight');
	fr = findPos(document.getElementById('catframeofref'));
	vp.x -= fr.x;
	vp.y -= fr.y;

	// these four lines are unnecessary but help prevent 'jump'
	if (cl.style.display != 'block') {
		cl.style.top = vp.y + Math.round((vp.h - 400) /2) + 'px';
		cl.style.left = vp.x + Math.round((vp.w - 500) /2) + 'px';
	}

	cl.style.display = 'block';
	
	if (cp) {
		if (tabstate == 'o') {
			var el = document.getElementById('catimgm');
			if (el) el.src = imgprefix + encodeURIComponent(cp.product.src) + '&size=' + cimgsizes.m; 
		} else { 
			var el = document.getElementById('catimge');
			if (el) el.src = imgprefix + encodeURIComponent(cp.product.src) + '&size=' + cimgsizes.e; 
		}
	}
	rewidth();

	var top = vp.y + Math.round((vp.h - cl.offsetHeight) /2); 
	if (top < vp.y) top = vp.y;
	cl.style.top = top + 'px';
	var left = vp.x + Math.round((vp.w - cl.offsetWidth) /2);
	if (left < vp.x) left = vp.x;
	cl.style.left = left + 'px';
}
function rewidth() {
	if (!document.getElementById('catlight')) return;
	if (tabstate == 'o') {
		document.getElementById('catlight').style.width = '480px';
	} else {
		var el = document.getElementById('catimge');
		if (el && el.offsetWidth > 10) document.getElementById('catlight').style.width = el.offsetWidth + 'px';
	}
}
setInterval('rewidth()', 500);
function fp(id, act) {
	for(var i=0; i<pd.length; i++) {
		if (pd[i].product.id == id) {
			var data = pd[i];
			try { eval(act); } catch (e) {}
			return;
		}
	}
	pact = act
	pr = new Ask( urlroot+'gen_ajax.php?target=mod_catalog&q=pd&id='+id, { handler: hp } );
}
function hp(xhr) {
	var data;
	try { eval('data=('+xhr.responseText+')'); }
	catch (e) { alert('Unable to fetch product data.'); return; }
	if (data.product) {
		pd.push(data);
		try { eval(pact); } catch (e) {}
	} else alert('here');
}
var tabstate = 'o';
function ttv(tab) {
	if (!cp.photos || cp.photos.length == 0) return;
	if (tab == 's') {
		document.getElementById('catimge').src = imgprefix + encodeURIComponent(cp.photos[activeimg].src) + '&size=' + cimgsizes.e;
		document.getElementById('cap_ss').innerHTML = (cp.photos[activeimg].caption? cp.photos[activeimg].caption : '');
		document.getElementById('button_slideshow').src = urlroot + 'images/catalog/slideshow1.gif';
		document.getElementById('button_overview').src = urlroot + 'images/catalog/overview2.gif';
		document.getElementById('catoview').style.display = 'none';
		document.getElementById('catshow').style.display = 'block';
		tabstate = 's';
		fadenav();
//		var el = document.getElementById('catimge');
	} else if (tab == 'o') {
		document.getElementById('catimgm').src = imgprefix + encodeURIComponent(cp.photos[activeimg].src) + '&size=' + cimgsizes.m;
		document.getElementById('cap_ov').innerHTML = (cp.photos[activeimg].caption? cp.photos[activeimg].caption : '');
		document.getElementById('button_slideshow').src = urlroot + 'images/catalog/slideshow2.gif';
		document.getElementById('button_overview').src = urlroot + 'images/catalog/overview1.gif';
		document.getElementById('catshow').style.display = 'none';
		document.getElementById('catoview').style.display = 'block';
		tabstate = 'o';
	}
	rewidth();
}
function sp(data) {
	cp = data;
//	var crap = new Image();
//	if (tabstate == 's') crap.src = imgprefix + encodeURIComponent(data.product.src) + '&size=' + cimgsizes.e;
//	else crap.src = imgprefix + encodeURIComponent(data.product.src) + '&size=' + cimgsizes.m;
//	crap.onload = scl;
//self.setTimeout("scl()", 100);	
	var esrc = imgprefix + encodeURIComponent(data.product.src) + '&size=' + cimgsizes.e;
	var msrc = imgprefix + encodeURIComponent(data.product.src) + '&size=' + cimgsizes.m;

	// figure out which is activeimg
	if (!data.photos || data.photos.length == 0) {
		activeimg = -1;
		document.getElementById('button_slideshow').style.visibility = 'hidden';
		document.getElementById('button_slideshow').src = urlroot + 'images/catalog/slideshow2.gif';
		document.getElementById('button_overview').src = urlroot + 'images/catalog/overview1.gif';
		tabstate = 'o';
	} else {
		for( var i=0; i<data.photos.length; i++) {
			if (data.photos[i].src == data.product.src) activeimg = i;
		}
		document.getElementById('button_slideshow').style.visibility = 'visible';
	}

	document.getElementById('catptitle').innerHTML = data.product.title;

	var out = '<div class="left_column">'
		+(activeimg > -1? '	<div class="photo">'
		+'		<a href="#"><img id="catimgm" src="'+msrc+'" alt="medium" class="medium" /></a>'
		+'		<div id="cap_ov">'+(data.product.caption? data.product.caption : '')+'</div>'
		+'	</div>'
		+'	<div class="larger">'
		+ '		<img onclick="ttv(\'s\')" class="enlarge" alt="Enlarged Slideshow" src="/images/catalog/enlarge.gif" />'
		+'		<p class="thumb_note">Click thumbnails to view larger</p>'
		+'	</div>':'')
		+'	<table class="details">';
	for (var i=0; i<data.product.data.length; i++) {
		out += '<tr><td class="names">' + data.product.data[i].field + '</td>'
			+'<td class="defs">' + data.product.data[i].value + '</td></tr>';
	}
	out +=	'	</table>'
		+'</div>'
		+'<div class="right_column">';
	for (var i=0; i<data.photos.length; i++) {
		out += '<img onclick="goshow('+i+')" class="thumb" src="' + imgprefix + encodeURIComponent(data.photos[i].src) + '&size=' + cimgsizes.tt + '" alt="" title="' + (data.photos[i].caption? data.photos[i].caption : '') + '" />';
	}
	out += '</div>';
	
	var el = document.getElementById('catoview');
	if (el) el.innerHTML = out;
	el.style.display = (tabstate == 'o'? 'block' : 'none');

	out = '<div class="slideshow_console"><div style="margin: 10px;">'
		+'	<img onclick="previmg()" alt="previous image" id="prev_button" src="/images/catalog/previous.gif" />'
		+'	<img onclick="nextimg()" alt="next image" id="next_button" src="/images/catalog/next.gif" />'
		+'	<span id="cap_ss">'+(data.product.caption? data.product.caption : '')+'</span>'
		+'</div></div>'
		+'<img id="catimge" src="'+esrc+'" alt="" />';
	var el = document.getElementById('catshow');
	if (el) el.innerHTML = out;
	el.style.display = (tabstate == 's'? 'block' : 'none');
	fadenav();

	// if it has loaded...
	var imgtag = (tabstate=='s'? 'catimge' : 'catimgm');
	document.getElementById(imgtag).hasloaded = false;
	document.getElementById(imgtag).onload = loadImg;
	if(document.getElementById(imgtag).complete) {
		document.getElementById(imgtag).onload();
	}
}
var activeimg = 0;
function goshow(i) {
	activeimg = i;
	if (activeimg > cp.photos.length-2) activeimg = cp.photos.length-1;
	if (activeimg <= 0) activeimg = 0;
	document.getElementById('catimgm').src = imgprefix + encodeURIComponent(cp.photos[activeimg].src) + '&size=' + cimgsizes.m;
	document.getElementById('cap_ov').innerHTML = (cp.photos[activeimg].caption? cp.photos[activeimg].caption : '');
}
function nextimg() {
	if (activeimg > cp.photos.length-2) { activeimg = cp.photos.length-1; return; }
	activeimg++;
	document.getElementById('catimge').src = imgprefix + encodeURIComponent(cp.photos[activeimg].src) + '&size=' + cimgsizes.e;
	document.getElementById('cap_ss').innerHTML = (cp.photos[activeimg].caption? cp.photos[activeimg].caption : '');
	fadenav();
	rewidth();
}
function previmg() {
	if (activeimg <= 0) { activeimg = 0; return; }
	activeimg--;
	document.getElementById('catimge').src = imgprefix + encodeURIComponent(cp.photos[activeimg].src) + '&size=' + cimgsizes.e;
	document.getElementById('cap_ss').innerHTML = (cp.photos[activeimg].caption? cp.photos[activeimg].caption : '');
	fadenav();
	rewidth();
}
function fadenav() {
	var el = document.getElementById('prev_button');
	if (activeimg > 0) {
		el.style.opacity = 0.999;
		el.style.filter = "alpha(opacity=100)";
		el.style.cursor = 'pointer';
		el.onclick = previmg;
	} else {
		el.style.opacity = 0.35;
		el.style.filter = "alpha(opacity=35)";
		el.style.cursor = 'default';
		el.onclick = null;
	}
	el = document.getElementById('next_button');
	if (activeimg < cp.photos.length-1) {
		el.style.opacity = 0.999;
		el.style.filter = "alpha(opacity=100)";
		el.style.cursor = 'pointer';
		el.onclick = nextimg;
	} else {
		el.style.opacity = 0.35;
		el.style.filter = "alpha(opacity=35)";
		el.style.cursor = 'default';
		el.onclick = null;
	}
}
var dw_owp, dw_omp, dw_override;
//var track;
function dw(e) {
	if (dw_override) {
		dw_override = false;
		return false;
	}
//track = document.getElementById('track');
//track.innerHTML = 'down';

	document.onselect = blah;
	document.onselectstart = blah;
	document.onmousedown = blah;
	document.onmouseover = blah;
	document.onmousemove = dw_move;
	document.onmouseup = dw_drop;
	dw_owp = findPos(document.getElementById('catlight'));
	dw_owp.x -= fr.x; dw_owp.y -= fr.y;
	dw_omp = mousepos(e);
	return false;
}
function blah() {return false;}
function dw_move(e) {
	var mpos = mousepos(e);
	var cl = document.getElementById('catlight');
//track.innerHTML = dw_owp.y + (mpos.y - dw_omp.y) + 'px';
	cl.style.top = dw_owp.y + (mpos.y - dw_omp.y) + 'px';
	cl.style.left = dw_owp.x + (mpos.x - dw_omp.x) + 'px';
}
function dw_drop(e) {
	document.onselect = null;
	document.onselectstart = null;
	document.onmousedown = null;
	document.onmouseover = null;
	document.onmousemove = null;
	document.onmouseup = null;
	dw_override = false;
}

// general
function viewport() {
	var x,y;
	if (self.innerHeight) // all except Explorer
	{
		x = self.innerWidth;
		y = self.innerHeight;
	}
	else if (document.documentElement && document.documentElement.clientHeight)
		// Explorer 6 Strict Mode
	{
		x = document.documentElement.clientWidth;
		y = document.documentElement.clientHeight;
	}
	else if (document.body) // other Explorers
	{
		x = document.body.clientWidth;
		y = document.body.clientHeight;
	}

	var sx,sy;
	if (self.pageYOffset) // all except Explorer
	{
		sx = self.pageXOffset;
		sy = self.pageYOffset;
	}
	else if (document.documentElement && document.documentElement.scrollTop)
		// Explorer 6 Strict
	{
		sx = document.documentElement.scrollLeft;
		sy = document.documentElement.scrollTop;
	}
	else if (document.body) // all other Explorers
	{
		sx = document.body.scrollLeft;
		sy = document.body.scrollTop;
	}
	return {w:x,h:y,x:sx,y:sy};
}
function mousepos(e) {
	var posx = 0;
	var posy = 0;
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) 	{
		posx = e.pageX;
		posy = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posx = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	// posx and posy contain the mouse position relative to the document
	return {x:posx,y:posy};
}
function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return {x:curleft,y:curtop};
}