// Smart Flip Script
var alltags = document.getElementsByTagName('*');
var galores = new Array();
var gthumbs = new Array();

//All the Galore divs will have to have ids
//Identifies all elems with class 'galore'. Should be the container elements: divs or paras
for (i in alltags) {if (alltags[i].className == 'galore') galores.push(alltags[i]);}
//First get all the galore div ids and use them as the base name for the flip image (plus extension)
//In a hidden div, preload all the flip images (or use a preload if you can actually get that to work)
for (i in galores) {
	var thisId = galores[i].id;
	var newThumb = new Image();
	newThumb.src = '/images/thumbs/'+thisId+'.jpg'
	newThumb.id = thisId+'thumb';
	gthumbs.push(newThumb);
	//Us/e the id to determine which flip image to show
	galores[i].myThumb = gthumbs[gthumbs.length-1];
	//Stores orig. img src
	galores[i].origImgSrc = galores[i].getElementsByTagName('img')[0].src;
	/*Assign a mouseover listener for fn smartflip to each first img in each galore div
	galores[i].getElementsByTagName('img')[0].onmouseover = smartflip;*/
	//Assign a similar listener to each first heading in each galore div
	galores[i].getElementsByTagName('h3')[0].onmouseover = smartflip;
	galores[i].getElementsByTagName('h3')[0].onmouseout = smartflip;
	//galores[i].onmouseout = smartflip;
}



function smartflip(evt) {
	evt = evt || window.event;
	var theTarget = getTarget(evt);
	if (theTarget.tagName.toLowerCase() == 'a') theTarget = theTarget.parentNode;
	if (evt.type == 'mouseover') {
		//detect the parent element (should be the galore div) of the event target (the img or the heading) & use its stored vars to change the img
		theTarget.parentNode.getElementsByTagName('img')[0].src = theTarget.parentNode.myThumb.src;
		theTarget.parentNode.getElementsByTagName('img')[0].style.borderStyle = 'solid';
	}
	else {
		//Onmouseout (of the parent div if possible) change the image back to the original
		theTarget.parentNode.getElementsByTagName('img')[0].src = theTarget.parentNode.origImgSrc;
		theTarget.parentNode.getElementsByTagName('img')[0].style.borderStyle = 'none';
		theTarget.parentNode.getElementsByTagName('img')[0].style.borderStyle = 'hidden';
	}
}


function getTarget(e) {
  e = e || window.event; //e is for non-IE browsers, window.event is for IE
  return e.target || e.srcElement; //e.target is for non-IE, srcElement is for IE
}