// <!-- HIDE FROM BROWSERS
var sRP1 = "/lib/img/pools/500x375/";
var sRP2 = "/lib/img/pools/2007/";
var sTNRP = "/lib/img/pools/100x75/";
var iCI = 0;		// current image
var iNumImages = 53;	// number of images, set in calling file
var iNumSets = 9;	// number of sets of 6
var sOldColor = "";	// string holding previous color
var iImageSet = 0;	// 0-based image set (6 images per set)
var iHighImageSet = 9;	// 0 to 9 (9*6 = 54)
// iNumImages = 23;	// original number of images before modifications
// iNumSets = parseInt(iNumImages / 6) + 1;

/* 2008.06.12 BUG IDENTIFIED
 * Initial loading of page using:
 *	onclick="ShowNails(2, '/lib/img/pools/100x75/', 'Swimming Pools');"
 *	javascript code. The numbers range from 2 to 8. When the eighth link
 *	gets clicked ShowNails(8, ...) fails to present the proper links.
 */

// added 2008.06.12
function GetImageURI(sURI) {
	if (sURI != undefined) {
		return(sURI);
	} else {
		return('');
	}
}

// INPUT: an <a> HTML element
function highlight(o) {
	sOldColor = o.style.color;
	o.style.color = "#ffff88";
	document.body.style.cursor = "pointer";
}

// INPUT: an <a> HTML element
function unhighlight(o) {
	o.style.color = sOldColor;
	document.body.style.cursor = "default";
}

function NumberOfImages() {
	return(iNumImages);
}

function ShowImage(i) {
	var sRP1 = "/lib/img/pools/500x375/";	// image root path
	var sRP2 = "/lib/img/pools/100x75/";	// thumbnail path
	var oImage = new Image();
	var hITC = document.getElementById("ImageToChange");
	var sDesc = "";
	var sLongDesc = "";
	var iHeight = 0;
	var iWidth = 0;
	var sRP = sRP1;
	
	// if (i > iNumImages) i = 0;
	// if (i < 0) i = iNumImages;
	
	// fqfn to image
	oImage.src = sRP + aImages[i][2];
	iHeight = oImage.height;
	iWidth = oImage.width;
	
	sDesc = aImages[i][3];
	oImage.alt = "Custom Designed Swimming Pools (" + iCI + ") " + sDesc;
	oImage.title = "Custom Designed Swimming Pools (" +iCI + ") " + sDesc;
	
	// blah
	hITC.src = oImage.src;
	hITC.title = oImage.title;
	hITC.alt = oImage.alt;
	// hITC.height = oImage.height;
	// hITC.width = oImage.width;
	
	// changing hITC to form description
	hITC = document.getElementById("Desc");
	if (aImages[i][5] != undefined)  { sLongDesc = "<p>" + aImages[i][5] + "</p>\n"; }
	if (aImages[i][4] != undefined) {
		hITC.innerHTML = "<p>" + sDesc + "</p>\n" + sLongDesc;
	} else {
		hITC.innerHTML = "<p>Swimming Pool</p>\n";
	}
	iCI = i;
}

function PrevImage() {
	var iShowNails = 0;
	var iLow = iImageSet*6;
	var iHigh = iLow+5;
	
	if (iHigh > iNumImages) { iHigh = iNumImages; }
	
	// check to see if current image is lower than low number
	if (iCI < iLow) {
		if (iCI < 0) {
			iCI = iNumImages;
			iImageSet = iNumSets;
		} else {
			iCI -= 1;
			iImageSet -= 1;
			// handle iImageSet
			if (iImageSet < 0) {
				iLow = iNumImages-5;
				iHigh = iNumImages;
				iImageSet = iNumSets;
			}
		}
	} else {
		// decrement iCI
		iCI -= 1;
		// if it gets below iLow, decrement iImageSet
		if (iCI < iLow) {
			iImageSet -= 1;
			iShowNails = 1;
			if (iImageSet < 0) {
				iImageSet = iNumSets;
				iCI = iNumImages;
				iShowNails = 1;
			} else {
				// iImageSet is ok, iCI gets set to iHigh
				iLow = iImageSet*6;
				iHigh = iLow+5;
			}
		} else {
			// no change in iImageSet
			// just the picture changed
		}
	}
	
	// show image
	ShowImage(iCI);
	// show thumbnails if appropriate
	if (iShowNails != 0) ShowNails(iImageSet);
}

function NextImage() {
	var iShowNails = 0;
	var iLow = iImageSet*6;
	var iHigh = iLow+5;
	
	if (iLow > iNumImages) { iLow = 0;iCI=0;iHigh = 5;iShowNails=1; }
	if (iHigh > iNumImages) { iHigh = iNumImages; }
	
	iCI += 1;
	if (iCI > iNumImages) { iCI=0;iImageSet=0;iShowNails=1; }
	ShowImage(iCI);
}

/*
 * ShowNails(iSetNumber, sImgThumbPath, "Swimming Pools")
 *	iSetNumber is a number 1 to 8, as appropriated.
 *	sImgThumbPath is the base path to the thumbnail.
 *	The final string parameter, sDetails, identifies the viewable text in the link.
 */
function ShowNails(iSet, sITP, sDetails) {
	var iStart = iSet*6;
	var iEnd = iStart+5;
	var sTitle = '';
	var oImgSet;
	
	var sSrc = '';
	var sTRTD = '<img class="rightcolroll" onmouseover="highlight(this);" onmouseout="unhighlight(this);" src="' + sITP;
	var sOnClick = '<a onmouseover="highlight(this);" onmouseout="unhighlight(this);" onclick="ShowNails(';
	
	if (sDetails == undefined) sDetails = "More Pics";
	if (iStart < 0) {
		iSet = 0;
		iStart = 0;
		iEnd = 5;
	}
	if (iEnd >= iNumImages) {
		iEnd = iNumImages - 1;
	}
	
	if (document.getElementById) {
		oImgSet = document.getElementById("ImageSet");
	} else {
		//
	}
 
	// only show 6 thumbnails
	for (i = iStart; i <= iEnd; i++) {
		sTitle = aImages[i][3];
		/*
		 * sAlt added on 2009.07.19, Sunday to correct the
		 * HTML <i>, </i> and <br /> tags within alt="" text.
		 */
		sAlt = aImages[i][6];
		// start filling in ImageSet
		sSrc += sTRTD + aImages[i][4];
		sSrc += '" title="' + sAlt + '" alt="' + sAlt + '" onclick="ShowImage(' + i + ');" /><br />\n';
	}
	
	// add navigation items at bottom of thumbnails
	for (i = 0; i < iNumSets; i++) {
		if (i == iSet) {
			sSrc += '<span style="color:#AAAAAA;">' + sDetails + '</span><br />\n';
		} else {
			sSrc += sOnClick + i + ', \'' + sITP + '\', \'' + sDetails + '\');">' + sDetails + '</a><br />\n';
		}
	}
	oImgSet.innerHTML = sSrc;
}


/*
 * ShowNails2(iStart, sImgThumbPath, sDesc)
 *	iStart is a number from 0 to 53, representing the starting image.
 *	sThumbPath is the base path to the thumbnail.
 *	The final parameter, sDesc, identifies the viewable text in the link.
 *	For swimming pools, sDesc = "Swimming Pools".
 */
function ShowNails2(iStart) {
	var iEnd = iStart + 5;
	var iEnd2 = -1;
	var sSrc = '';
	var i = 0;
	var sTitle = '';
	var sThumbRoot = '/lib/img/pools/100x75/';
	
	// handle iEnd appropriately
	if (iEnd > iNumImages) {
		iEnd = iNumImages;
		iEnd2 = iEnd - iNumImages - 1;
	}
	
	// thumbnail root
	var sThumb1 = '<img class="rightcolroll" onmouseover="highlight(this);" onmouseout="unhighlight(this);" src="' + sThumbRoot;
	// show 6 thumbnails
	for (i = iStart; i <= iEnd; i++) {
		sTitle = aImages[i][3];
		// start filling in ImageSet
		sSrc += sThumb1 + aImages[i][4];
		sSrc += '" title="' + sTitle + '" alt="' + sTitle + '" onclick="ShowImage(' + i + ');" style="width:100px;height:75px;" />';
		// add an HTML line-break if needed
		if (i < iEnd) {
			sSrc += '<br />\n';
		} else {
			sSrc += '\n';
		}
	}
	
	if (iEnd2 > -1) {
		for (i = 0; i <= iEnd2; i++) {
			sTitle = aImages[i][3];
			// start filling in ImageSet
			sSrc += sThumb1 + aImages[i][4];
			sSrc += '" title="' + sTitle + '" alt="' + sTitle + '" onclick="ShowImage(' + i + ');" style="width:100px;height:75px;" />';
		}
	}
	
	document.write(sSrc);
	// NOTE: we do NOT require the "Swimming Pool" links here.
}
// -->