//ARE WE USING EXPLORER?
var g_isIE = navigator.appName.indexOf("Microsoft")!=-1;
var currentImg = "img01";
var currentQ = 1;

//ABSTRACTED CONNECT EVENT FUNCTION FOR ANY BROWSER
function connectEvent(element, event, handler) {
	if (g_isIE) {
		element.detachEvent("on" + event, handler);
		element.attachEvent("on" + event, handler);
	} else {
		element.addEventListener(event, handler, false);
	}
}

//ABSTRACTED DISCONNECT EVENT FUNCTION FOR ANY BROWSER
function disconnectEvent(element, event, handler) {
	if (g_isIE) {
		element.detachEvent("on" + event, handler);
	} else {
		element.removeEventListener(event, handler, false);
	}
}

function loadUI() {
	connectEvent(document.getElementById("catchTop"), "mouseover", flipoff);
	connectEvent(document.getElementById("catchLeft"), "mouseover", flipoff);
	connectEvent(document.getElementById("catchBottom"), "mouseover", flipoff);
	connectEvent(document.getElementById("catchRight"), "mouseover", flipoff);
	var x = document.getElementById('photos').childNodes;
	for(i = 0; i < x.length; i++){
		if(x[i].nodeName == 'DIV'){
			if (g_isIE) {
				bg = x[i].currentStyle.backgroundImage;
				h = x[i].currentStyle.height;
				x[i].childNodes[0].style.backgroundImage = bg;
				x[i].childNodes[0].style.height = h;
				//FIREFOX ONLY - NOT NEEDED BECAUSE FX SUPPORTS INHERIT
				//alert(getComputedStyle(x[i],'').getPropertyValue('background-image'));
			}
			connectEvent(x[i], "mouseover", flipimg);
			connectEvent(x[i], "click", showQ);
		}
	}
	//UPDATED 6/15 SN
	var x = document.getElementById('questions').childNodes;
	for(i = 0; i < x.length; i++){
		if(x[i].nodeName == 'DIV'){
			myID = x[i].id;
			connectEvent(x[i], "click", showQ);
			var y = x[i].childNodes;
			for(j = 0; j < y.length; j++){
				if(y[j].nodeName == 'H3'){
					var z = y[j].childNodes;
					for(k = 0; k < z.length; k++){
						if(z[k].nodeName == 'SPAN'){
							s = myID.replace(/q/, "s");
							y[j].setAttribute("id", s);
							connectEvent(y[j], "click", showQ);
						}
					}
				}
			}
		}
	}
}

function flipimg(e) {
	if (!e) var e = window.event;
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) // defeat Safari bug
		targ = targ.parentNode;
	if (targ.id == "") // defeat Safari bug
		targ = targ.parentNode;
	p = targ.id;
	q = currentImg.replace(/img/, "q");
	flipimgAct(p,q);
}

function flipoff(e) {
	q = currentImg.replace(/img/, "q");
	document.getElementById(q).style.display="none";
	if (g_isIE) {
		document.getElementById(currentImg).childNodes[0].filters.alpha.opacity="0";
	} else {
		document.getElementById(currentImg).childNodes[0].style.opacity = 0;
	}
}

function flipimgAct(p,q) {
	document.getElementById(q).style.display="none";
	if (g_isIE) {
		document.getElementById(currentImg).childNodes[0].filters.alpha.opacity="0";
		document.getElementById(p).childNodes[0].filters.alpha.opacity="100";
	} else {
		document.getElementById(currentImg).childNodes[0].style.opacity = 0;
		document.getElementById(p).childNodes[0].style.opacity = 1;
	}
	q = p.replace(/img/, "q");
	document.getElementById(q).style.display="block";
	currentImg = p;
}

function showQ(e) { //UPDATED 6/15 SN
	if (!e) var e = window.event;
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) // defeat Safari bug
		targ = targ.parentNode;
	if (targ.id == "") // defeat Safari bug
		targ = targ.parentNode;
	p = targ.id;
	d = p.replace(/s/, "d");
	d = d.replace(/q/, "d");
	d = d.replace(/img/, "d");
	if(d != ""){
		document.getElementById("frame").style.display="block";
		document.getElementById(d).style.display="block";
		connectEvent(document.getElementById("frame"), "click", hideQ);
		var x = document.getElementById(d).childNodes;
		for(i = 0; i < x.length; i++){
			if(x[i].nodeName == 'H4'){
				if(x[i].childNodes[0]){
					x[i].childNodes[0].style.visibility = "visible";
				}
			}
		}
	}
}

function hideQ() {

	d = currentImg.replace(/img/, "d");
	document.getElementById("frame").style.display="none";
	document.getElementById(d).style.display="none";
	disconnectEvent(document.getElementById("frame"), "click", hideQ);
	var x = document.getElementById(d).childNodes;
	for(i = 0; i < x.length; i++){
		if(x[i].nodeName == 'H4'){
			if(x[i].childNodes[0]){
				x[i].childNodes[0].style.visibility = "hidden";
			}
		}
	}
}

connectEvent(window, "load", loadUI);