// Script:   common.js 
// Purpose:  Provides JavaScript that is common to all or most pages on the site. 
// Author:   Gerry Stanford
// Date Written: February of 2007


//***************************************//
//**         Utility Functions         **//
//***************************************//
// Return the browser-specific object represented by a passed ID.
function getObj(theObj) {
	if (document.getElementById) return document.getElementById(theObj);
	else if (document.all)       return document.all.item(theObj);
	else return false;
}
//***************************************//
//**      END Utility Functions        **//
//***************************************//


//***************************************//
//** Navigation (Mouse-over) Functions **//
//***************************************//

// Note concerning this mouse-over code (GS):
// I wrote this to avoid having to manually list every rollover image individually on the site, as this
// would require JavaScript updates every time a nav option changes, and also to take advantage of 
// JavaScript's ability to assign event handlers dynamically instead of in the code, as this fills up
// the HTML with garbage.
//
// How to use:
// Basically you assign an ID to the wrapper tag that holds the particular set of images to receive the
// mouse-over effect, (a particular nav bar or whatever), and reference that ID to this JavaScript by
// calling the initNav() function in the page's window.onload event. The JavaScript will do the following:
// 1) Any image within the ID'd wrapper that has "_off." as part of its name and that has an ID tag
//    will have a mouse-over event handler assigned to it. The "on" image name assumed for the mouse-over
//    is the same name as the off image except "_off." is changed to "_on.".
// 2) If an image needs to be "on" at all times, the ID of that image can be passed to the initNav()
//    function and the JavaScript will store the "on" image in place of the off image within the image's handler,
//    effectively making the image appear on continually even though a mouse-over is happening behind the
//    scenes.
// (220-02-09 GS): A hack was incorporated to handle Garden Associate's special on/off dot that appears
//    in the main N1 nav bar. This dot is not part of the mouse-over effect, but needs to be forced to the
//    "on" state whenever the category image to its left is forced to its "on" state. The code accomplishes this
//    by assuming a dot image ID that is is the same as the associated category image's ID followed by "_dot",
//    then simply forcing the "on" dot image in place of the off dot image within the image's handler. For example,
//    if "n1_contact" is the id of the main n1 nav to be "constant on", then the image having the id "n1_contact_dot"
//    will also be constantly on.

function mouseOverInit(whichNav,hilite)
{
	if (document.getElementById(whichNav))
		var x = document.getElementById(whichNav).getElementsByTagName('IMG');
	else if (document.all && document.all[whichNav])
		var x = document.all[whichNav].all.tags('IMG');
	else return;
	var preloads = new Object();
	rExp = /_off\./i;
	for (var i=0;i<x.length;i++)
	{
		if (x[i].src.indexOf('_off.')> 0  && x[i].src.indexOf('_dot_off.') < 0) {
			
			if (x[i].id.length) {
				preloads['n'+x[i].id] = new Image;
				preloads['n'+x[i].id].src = x[i].src;
				preloads['o'+x[i].id] = new Image;
				preloads['o'+x[i].id].src = x[i].src.replace(rExp, '_on.');
				if (hilite == x[i].id) {
					x[i].src = preloads['o'+x[i].id].src;
					// Kluge to turn on the current page's maroon dot. Code assumes the id on the 
					// dot image is the same as the id on the related nav image except with '_dot' 
					if (whichNav = 'N1Nav' && getObj(x[i].id+'_dot')) {
						getObj(x[i].id+'_dot').src = 'images/n1_dot_on.gif';
					}
				}
				else {
					x[i].onmouseover = function () {
						this.src=preloads['o'+this.id].src;
					}
					x[i].onmouseout = function () {
						this.src=preloads['n'+this.id].src;
					}
				}
			}
		}
	}
}

// initNav Params:
// 1) "nav" is the ID of the tag that wraps the images to receive the mouse-over action.
// 2) "hilite" parameter indicates the id of the image that should be constantly on. For instance, when "n1_contact" 
//    is passed in the param, the image having the id "n1_contact" will be constantly on.
function initNav(nav,hilite) {
	if (nav != null) { 
		// If no hilite param is passed then force the dummy value "none" into it.
		var hilite = (hilite == null) ? 'none' : hilite;
		mouseOverInit(nav, hilite);
	}
}

//*******************************************//
//** END Navigation (Mouse-over) Functions **//
//*******************************************//


//***************************************//
//**         Trimming Functions        **//
//***************************************//
// Trim the left side of a value. 
function ltrim(argvalue) {
	while (1) {
    	if (argvalue.substring(0, 1) != " ") break;
		argvalue = argvalue.substring(1, argvalue.length);
	}
	return argvalue;
}
// Trim the right side of a value. 
function rtrim(argvalue) {
	while (1) {
		if (argvalue.substring(argvalue.length - 1, argvalue.length) != " ") break;
		argvalue = argvalue.substring(0, argvalue.length - 1);
	}
	return argvalue;
}
// Trim both sides of a value. 
function trim(argvalue) {
	var tmpstr = ltrim(argvalue);
	return rtrim(tmpstr);
}

//***************************************//
//**       END Trimming Functions      **//
//***************************************//

//****************************************//
//**   Portfolio Thumb click Functions  **//
//****************************************//
var cssRules;
if (document.all) cssRules = 'rules';
else if (document.getElementById) cssRules = 'cssRules';
for (var S = 0; S < document.styleSheets.length; S++) {
	for (var R = 0; R < document.styleSheets[S][cssRules].length; R++) {
		if (document.styleSheets[S][cssRules][R].selectorText == '.defThumbVis') {
			//document.styleSheets[S][cssRules][R].style['display'] = 'none';
			document.styleSheets[S][cssRules][R].style['visibility'] = 'hidden';
		}
	}
}

function initMd(thm) {
	mid = 'm'+thm.id;
	mdImgAry[mid] = new Object();
	mdImgAry[mid].mdImg = new Image;
	mdImgAry[mid].isLoaded = 0;
	mdImgAry[mid].thmId = thm.id;
	mdImgAry[mid].mdImg.src = thm.src.replace(rExp, '_md.');
}

function showThumb(thmId) {
	i = getObj(thmId);
	i.style.visibility = 'visible';
}
function imageIsLoaded(io){
	cmplteProp = io.mdImg.complete;
	if (cmplteProp == 1 || cmplteProp == 0 || cmplteProp == true || cmplteProp == false) {
		if (cmplteProp == true) {
			io.isLoaded = 1;
			return true;
		}
		else return false;
	}
	else {
		var cpyImg = new Image();
		cpyImg.src = io.mdImg.src;
		if(cpyImg.width) {
			io.isLoaded = 1;
			return true;
		}
		else return false;
	}
}
function checkMdImg() {
	unloadedImgCount = 0;
	for (x in mdImgAry) {
		mdImg = mdImgAry[x];
		if (!mdImg.isLoaded && imageIsLoaded(mdImg)) {
			showThumb(mdImg.thmId);
			mdImg.isLoaded = 1;
		}
		if (!mdImg.isLoaded) unloadedImgCount++;
	}
	if (unloadedImgCount && loadCheckCount <= loadMaxRetries) {
		setTimeout("checkMdImg()", 250);
	}
	//if (loadCheckCount > loadMaxRetries) {
	//	alert('Timed Out');
	//}
	loadCheckCount++;
}

var loadCheckCount = 0;
var loadMaxRetries = 500;
var mdImgAry = new Array();
function initPFThumbs(stub) {

	var thumbCont    = 'pf_Thumbs';  // id of the container tag holding the thumbnails.
	var medPicID     = 'pf_medPic';  // id of the medium sized pic on the right side of the widget.
	var medPicLinkID = 'pf_medLink'; // id of the anchor tag surrounding the medium sized pic.
	var medLoadingPic = "images/loading.gif";
	var stub = (stub == null) ? '' : stub; // Force the empty string if we were not passed a stub - avoids an error.
	// Get all thumbnail images into an array (x).
	if (document.getElementById(thumbCont)) 
		var x = document.getElementById(thumbCont).getElementsByTagName('IMG');
	else if (document.all && document.all[thumbCont]) 
		var x = document.all[thumbCont].all.tags('IMG');
	else return;
	mdImgObj  = getObj('pf_medPic');
	mdLinkObj = getObj('pf_medLink');
	mdLinkObj.target = '';
	if (mdImgObj && mdLinkObj) {
		rExp = /_sm\./i;
		for (var i=0;i<x.length;i++)
		{
			// Cache the medium pic related to each thumb. For each thumb, attach an onclick event
			// to display the medium pic on the right side of the widget, and to change the href related
			// to the medium pic so that clicking it will load the correct large image in the pop-up.
			if (x[i].id.length) {
				if (i==0) {
					imgNum = (x[i].id.substring(thumbCont.length));
					mdLinkObj.href = 'javascript:showLg(\''+stub+'\',\''+ imgNum + '\');';	
				}			
				initMd(x[i]);
				rExp2 = /_md\./i;
				x[i].onclick = function () {
					mdImgObj.src = mdImgAry['m'+this.id].mdImg.src;
					lgImg = mdImgAry['m'+this.id].mdImg.src.replace(rExp2, '_lg.');
					imgNum = (this.id.substring(thumbCont.length));
					mdLinkObj.href = 'javascript:showLg(\''+stub+'\',\''+ imgNum + '\');';
					return false;
				}
			}
		}
		checkMdImg();
	}
}

function showLg(stub,imgNum) {
	popUpWidth  = 775;
	popUpHeight = 560;
	window.open( "pf_popup.cfm?s=" + stub + "&n=" + imgNum, 
		'pf_popup',"resizable=yes,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,WIDTH=" + popUpWidth + ",HEIGHT=" + popUpHeight); 
}
//********************************************//
//**   END Portfolio Thumb click Function   **//
//********************************************//