/* ******************************************************************************

'pszgallery.js', by Professional Solutions

Professional Solutions Zoom Gallery

Permission is granted to use and modify this script for any purpose,
provided that this credit header is retained, unmodified, in the script.

Requirements

files:
	pszgallery.jz   This file
	pszgallery.css  The CSS (edit to match the website)
	magminus.cur    Magnifying glass cursor
	magplus.cur     Magnifying glass cursor


*1* in the <head>
	<!-- *********** Professional Solutions Zoom Gallery *********** -->
	<link rel="stylesheet" type="text/css" href="pszgallery.css">
	<script language="JavaScript">
 		var pszg_imgdir    = "products/";
 		var pszg_zoomsufix = "z";
 		var pszg_imgtype   = ".jpg";
 		var pszg_zWidth    = 550; pszg_zHeight   = 616;
 		var pszg_imgWidth  = 365; pszg_imgHeight = 409;
 		var pszg_tWidth    = 74;  pszg_tHeight   = 82;
 		pszg_prodpics = new Array("alanapink","alanablack","alanawhite","alanablue","alanalilac","alanared");
 		pszg_prodalt  = new Array("Alana Pink","Alana Black","Alana White","Alana Blue","Alana Lilac","Alana Red");
 	</script>
 	<script src="pszgallery.js" language="JavaScript"></script>
	<!-- *********************************************************** -->

*2* in the <body>, an anchor to insert the zoomed image code
	<div id="pszgz" class="pszgz" onclick="zoomoff('pszgz');"></div>

*3* in the <body>, where to display the gallery
	<script language="JavaScript">pszg_display();</script>

******************************************************************************** */

<!--

/* ***************************************************************************** */
// Internal functions
/* ***************************************************************************** */
//to remove the zoomed picture when clicked
function pszg_zoomoff(zObj) {
//alert("zoomoff");

	if (""!=zObj){
		var x=document.getElementById(zObj);
		x.innerHTML = "";
		ps_zoomed = "";
	}
}

/* ***************************************************************************** */
// pad a single digit number to two e.g '5' becomes '05'
function pszg_padout(number) { return (number < 10) ? '0' + number : number; }

/* ***************************************************************************** */
// Displays the Galery *3*
function pszg_display() {
//alert("pszg_display");

var outStr;
var i;
var L; // number of lines
var c; // current index
var k; // work index

	// display the main image
	outStr = "<img id='pic01'";
	outStr = outStr + " onClick='pszg_zoomurla(\"pszgz\")'";
	outStr = outStr + " class='pzzg_mag'";
	outStr = outStr + " width=" + pszg_imgWidth;
	outStr = outStr + " height=" + pszg_imgHeight;
	outStr = outStr + " src=" + pszg_imgdir + pszg_prodpics[0] + pszg_imgtype;
	outStr = outStr + " alt='" + pszg_prodalt[0] + "\nClick to enlarge'";
	outStr = outStr + " name='" + pszg_prodalt[0] + "'>\n";
	document.write (outStr);

	if (pszg_captionon == true) {	// Display caption
		outStr = "<div class='pzzg_title' align='center' id='pzzg_title'>";
		outStr = outStr +  pszg_prodalt[0] + "<br><p>Click to enlarge</p>";
		outStr = outStr + " </div>\n";
		document.write (outStr);
	}

	document.write('<div class="pzzg_thumbs" align="center" wi>\n');

	// now display the thumbnail images
	L = Math.round((pszg_prodpics.length + 1)/5); // calc number of lines
	for (k=1; k<(L+1); k++){ // loop for lines
		for (i=1; i<6; i++){ // loop for thumbnails

			c = (k-1) * 5 + i; // calc current index
			if (c > pszg_prodpics.length - 1){ // no more pics so exit loop
				break;
			}

			outStr = "<img id='pic" + pszg_padout(c+1) + "'";
			outStr = outStr + " onClick='pszg_swoppic(this.id)'";
			switch(i){
				case 1:
					outStr = outStr + " class='pzzg_thumbs-l'";
					break
				case 5:
					outStr = outStr + " class='pzzg_thumbs-r'";
					break
				default:
					outStr = outStr + " class='pzzg_thumbs-c'";
			}
			outStr = outStr + " width=" + pszg_tWidth;
			outStr = outStr + " height=" + pszg_tHeight;
			outStr = outStr + " src=" + pszg_imgdir + pszg_prodpics[c] + pszg_imgtype;
			outStr = outStr + " alt='" + pszg_prodalt[c] + "\nClick to enlarge'";
			outStr = outStr + " name='" + pszg_prodalt[c] + "'>";
			document.write (outStr);

		}
	}

	document.write('</div>\n');

}

/* ***************************************************************************** */
// Global (only required if zoompic.js not used in same page)
// Flag, set to img.id if a window is currently displayed otherwise empty
var ps_zoomed = "";

/* ***************************************************************************** */
/* ***************************************************************************** */
function pszg_zoomurla(toObj) {
//alert("zoomurl");

	pszg_zoomoff(ps_zoomed); // close any open zoomed image
	if (""==ps_zoomed) {

		var imgObj = document.createElement('img');
		imgObj.src = pszg_imgdir + pszg_prodpics[0] + "z" + pszg_imgtype;
		imgObj.alt = pszg_prodalt[0] + "\nClick to close";
		imgObj.id = "zoomed";
//		imgObj.width = pszg_zWidth;
//		imgObj.height = pszg_zHeight;
		imgObj.align = "center";

		var x = document.getElementById(toObj);
		x.appendChild(imgObj);

		ps_zoomed = toObj;
	}
}

/* ***************************************************************************** */
//
/* ***************************************************************************** */
function pszg_swoppic(ThisPic) {
//alert("swoppic");

var tmpSrc;
var tmpAlt;
var tmpName;

	var c	= ThisPic.substring(3) - 1;
	var p = pszg_prodpics[c];
	var a = pszg_prodalt[c];

	pszg_prodpics[c] = pszg_prodpics[0];
	pszg_prodalt[c] = pszg_prodalt[0];

	pszg_prodpics[0] = p;
	pszg_prodalt[0] = a;

	document.pic01.src = pszg_imgdir + pszg_prodpics[0] + pszg_imgtype;
	document.pic01.alt = pszg_prodalt[0] + "\nClick to enlarge";

	document.getElementById(ThisPic).src = pszg_imgdir + pszg_prodpics[c] + pszg_imgtype;
	document.getElementById(ThisPic).alt = pszg_prodalt[c] + "\nClick to enlarge";

	document.getElementById('pzzg_title').innerHTML = pszg_prodalt[0] + "<br><p>Click to enlarge</p>";
}


//-->

