// JavaScript Document


// setup variables

	pic = 0;
	var startPic = 0;
	var endPic = 0;
	var curPage = 1;
	curProd = 0;
	thumbs = new Array();
	clickFlag= true;
	setMeUp = 0;
	pppieces = 0;
			
// id selector catimg is the image in ppleft - legacy

function ImagePreloader(images, callBack)

{

   // store the callBack

   this.callBack = callBack;

 

   // initialize internal state.

   this.nLoaded = 0;

   this.nProcessed = 0;

   this.aImages = new Array;

 

   // record the number of images.

   this.nImages = images.length;

 

   // for each image, call preload()

   for ( var i = 0; i < images.length; i++ ) 

      this.preload(images[i]);

}

ImagePreloader.prototype.preload = function(image)

{

   // create new Image object and add to array

   var oImage = new Image;

   this.aImages.push(oImage);

   

   // set up event handlers for the Image object

   oImage.onload = ImagePreloader.prototype.onload;

   oImage.onerror = ImagePreloader.prototype.onerror;

   oImage.onabort = ImagePreloader.prototype.onabort;

   

   // assign pointer back to this.

   oImage.oImagePreloader = this;

   oImage.bLoaded = false;

   

   // assign the .src property of the Image object

   oImage.src = image;

}
ImagePreloader.prototype.onComplete = function()

{

   this.nProcessed++;

   if ( this.nProcessed == this.nImages )

   {

      this.callBack(this.aImages, this.nLoaded);

   }

}

ImagePreloader.prototype.onload = function()

{

   this.bLoaded = true;

   this.oImagePreloader.nLoaded++;

   this.oImagePreloader.onComplete();

}

ImagePreloader.prototype.onerror = function()

{

   this.bError = true;

   this.oImagePreloader.onComplete();

}

ImagePreloader.prototype.onabort = function()

{

   this.bAbort = true;

   this.oImagePreloader.onComplete();

}

function growThumbs(ppage,from) {
// the 'from' argument tells us whether its a recursive call or a new call from the page 1 for new call 2 for recursive
// set the clickFlag to false if its come form the page and we're still growing the thumbs
// populate the thumbnail divs

document.getElementById("ppba").style.visibility = "hidden"; // to hide the back arrow gif

if ((from == 1) && (!clickFlag)) {return false;} 
if ((from ==1) && (window.Iterator)){div2.style.zIndex = 0;} // otherwise FF wont let you click it. window.Iterator checks for FF
clickFlag = false;
if (totalPieces < 9) {totalPieces = 9;} // to correct single page bug
if (ppage != 99) {
binThumbs(false);
 //alert ("ppage="+ppage+", totalPages="+totalPages+", totalPieces="+totalPieces);
	curPage = ppage; //set the current page;
	// alert ("setting current page ="+curPage);
	if (document.getElementById("pp1")) document.getElementById("pp1").className=""; //clear the set page
	if (document.getElementById("pp2")) document.getElementById("pp2").className="";
	if (document.getElementById("pp3")) document.getElementById("pp3").className="";
	if (document.getElementById("pp4")) document.getElementById("pp4").className="";
	if (document.getElementById("pp5")) document.getElementById("pp5").className="";
	if (document.getElementById("pp6")) document.getElementById("pp6").className="";
	if (document.getElementById("pp7")) document.getElementById("pp7").className="";
	document.getElementById("pp"+curPage).className="sb_pagS"; // set the new page
if (ppage <= (totalPages-1)) {
	startPic = ((ppage-1) * 9);
	endPic = startPic+8;
	}
else {
	startPic = (totalPieces - 9);
	endPic = totalPieces-1;
	}
	pic = startPic;

// move the thumb divs for this ppage
// alert ('moving thumbs array '+startPic+' to  '+endPic);

for (var i = startPic; i <= endPic; i++) {
	//alert(startPic+" , "+endPic+ ", "+i);
	thumbs[i].style.left = (ppx + (150*(spiral[i-startPic][0])))+"px";
 	thumbs[i].style.top  = (ppy + (150*(spiral[i-startPic][1])))+"px";
	
	}

}

	if (pic <= endPic) {
	document.getElementById("tn"+(pic)).style.display = "block";
	new Effect.Grow(document.getElementById("tnimg"+(pic)),{duration:1.0,direction: 'center',opacityTransition:Effect.Transitions.linear});
	pic++;
	setTimeout("growThumbs(99,2)",200);
}   else {
	pic=startPic;
	
	
	new Effect.Appear(div3);  //put the category text back in the right pane
	new Effect.Fade(div5);	  //remove the product detail from the right iframe
	//alert ("fade");

if (null != document.getElementById("catimg")) 
{
	new Effect.Fade(document.getElementById("catimg"),{afterFinish:function(){
		clickFlag=true;
		if (window.Iterator) {div2.style.zIndex = 0;} }});	
} else {
	clickFlag=true;
		if (window.Iterator) {div2.style.zIndex = 0;}
}

//		remove the large image from the left pane ad reset the z of ppleft
	
	
}
}

// preload call for the goBig function

function onPreload(aImages, nImages)
{
	if (nimages = aImg.length && null != document.getElementById("catimg"))
	{document.getElementById("catimg").src = "";
	 document.getElementById("catimg").style.display = "none";
	}
	
	//once the big product image is loaded we can grow it in the left pain

	document.getElementById("catimg").src = aImg[0];
//	new Effect.Grow(document.getElementById("catimg"),{duration:2.0,direction: 'center', opacityTransition:Effect.Transitions.linear, afterFinish:function(){clickFlag=true;}});
	new Effect.Grow(document.getElementById("catimg"),{duration:2.0,direction: 'center', opacityTransition:Effect.Transitions.linear, afterFinish:function(){
		var ppTip = "Tip('Click to Magnify')";
		var ppSwap = "<img id='catimg' src='/skin1/images/spacer.gif' /><a href='image.php?type=M&id="+curProd+"' rel='zoomType:circle; disableAutoStart:true;' class='MagicMagnify' style='cursor: url(/skin1/images/glass.cur);' onmouseover=''; onmouseout='UnTip()'; onclick='MagicMagnify_findMagnifiers();;return false;'><img src='image.php?type=P&id="+curProd+"' /></a>";
		document.getElementById("ppleft").innerHTML = ppSwap;
		//MagicMagnify_findMagnifiers();
		clickFlag=true;}});
}

// preload function for the rollover images
function onPreloadR(aImages, nImages)
{
	if (nimages = aImg.length && null != document.getElementById("catimg"))
	{document.getElementById("catimg").src = "";
	 document.getElementById("catimg").style.display = "none";
	}
	
	//once the big product image is loaded we can grow it in the left pain

	document.getElementById("catimg").src = aImg[0];
	new Effect.Grow(document.getElementById("catimg"),{duration:2.0,direction: 'center', opacityTransition:Effect.Transitions.linear, afterFinish:function(){clickFlag=true;}});
	}

// preload function to delay pagesetup until we have the first 9 thumbs in memory
function onPreloadD(aImages, nImages)
{
	if (nimages = aImg.length)
	{

	}
	
	// now its loaded
	//alert ("setting up...");
	setupPage_finish();

	}

// so we can remote call it from the iframe contents to replace the category description onload of the iframe

function swapDivs() {
	div3 = document.getElementById("ppright"); // added to rebuild a product page
	new Effect.Fade(div3);
	new Effect.Appear(div5);
	document.getElementById("ppba").style.visibility = "visible"; // to show the back arrow gif
	
}

//remove the thumbnails

function binThumbs(flashy) {
for (var i=startPic; i<=endPic; i++) {
	if (flashy) {new Effect.SwitchOff(document.getElementById("tnimg"+i));}
	else
	{	document.getElementById("tn"+i).style.display = "none";
		document.getElementById("tnimg"+i).style.display = "none";}
	}
		
}


// use lft as a flag if false no need to bin thumbs
function goBig(lft,ppproduct) {
	// remove the thumbnails
	if (!clickFlag) {return false;}
	clickFlag = false;
	if (lft) {binThumbs(true);} 
	// setup preload of big image for this product
	aImg = [("image.php?type=P&id=" + ppproduct)];
	var ip = null;
	ip = new ImagePreloader(aImg,onPreload);
	parent.location.hash = "ppprod=" + ppproduct;
	curProd = ppproduct;
	if (navigator.cookieEnabled)
	{
		if (curProd != 0) {setCookie("ppProd",curProd);}
	}
	div5 = document.getElementById ("ippright"); // added LEE to rebuild a product page
	div5.src = "product.php?productid=" + ppproduct;
	if (window.Iterator) {
	div2.style.zIndex = 5;}
	}

function rolloverBig(lft,src,rImage) {
	// try to put a new big image from rollover
	// setup preload of big image for this product
	// don't allow further clicking until after the grow effect completes
	// if its the zero'th image, do the magnify thing

	if (!clickFlag) {return false;}
	clickFlag = false;
	aImg = [src];
	var ip = null;
	var ppSwap = "<img src='skin1/images/spacer.gif' name='catimg' id='catimg' class='nobdimgcart' style='display:none'>";
	document.getElementById("ppleft").innerHTML = ppSwap;
	document.getElementById("catimg").style.display = "none";
	if (rImage != 0 ) {
	ip = new ImagePreloader(aImg,onPreloadR); }
	else {
	ip = new ImagePreloader(aImg,onPreload); }
	}


function ppwobble(me) {
new Effect.Shake(me,{distance:2, duration:2.0});
}

function setupPage_delay() {

//	var ppwait = (document.images.length-5);
	aImg = [(document.images[pppieces])];
	var ip = null;
	ip = new ImagePreloader(aImg,onPreloadD);
}

function setupPage_finish() {
//move the container and the two panels to centre
// alert (setMeUp);
var regExp = /\d+/g; //get the numbers from it
var regLink = /ppprodL/;
var fullLoc = parent.location.hash;
// alert (fullLoc);
//if (regLink.test(fullLoc)) {//alert ("From a Link");} else {//alert ("From the Currency Switch");}
var locNo = fullLoc.match(regExp);

	if ( (fullLoc == "#ppload") || (regLink.test(fullLoc)) ) {
	eraseCookie ("ppProd");
	// alert ("cookie erased, setMeUp="+setMeUp+", locNo="+locNo);
	}
var div1 = document.getElementById("ppcontainer");
	div2 = document.getElementById("ppleft");
	div3 = document.getElementById("ppright");
	var div4 = document.getElementById("pplogo");
	div5 = document.getElementById("ippright");
var div6 = document.getElementById("pppagenav");
//var div7 = document.getElementById("ppleftmenu");
var div8 = document.getElementById("pptimer");
var div9 = document.getElementById("pptopmenu");
var div10= document.getElementById("ppbottombox");
var div11= document.getElementById("ppcurrency");
var div12 = document.getElementById("pptopmenu1");

var ppLeftScreen = (screen.availWidth -1000)/2;
	//totalPieces = document.images.length-5;  //OLD needs adjusting with DHTML menu addition
	totalPieces = pppieces;
	if (totalPieces < 9) {totalPieces = 9};
	// alert (totalPieces);

	totalPages = Math.ceil(totalPieces / 9);
if (ppLeftScreen < 0) {ppLeftScreen = 0;} 
	div1.style.left = ppLeftScreen + "px";
	div2.style.left = (ppLeftScreen+50) + "px";
	if (window.Iterator) {div2.style.zIndex = 5;}
	div3.style.left = (ppLeftScreen+500) + "px";
	div4.style.left = (ppLeftScreen+50) + "px";
	div4.style.top = "60px";
	div5.style.left = (ppLeftScreen+500) + "px";
	div6.style.left = (ppLeftScreen+512) + "px";
	div6.style.top = "555px";
//div7.style.left = (ppLeftScreen+15) + "px";
	div9.style.left = (ppLeftScreen+290) + "px";
	div10.style.left= (ppLeftScreen+134) + "px";
	div11.style.left= (ppLeftScreen+935) + "px";
	div12.style.left = (ppLeftScreen+480) + "px";
	div12.style.top = "75px";

//now they're in place show them if we're on a product page
if (setMeUp > 0) {
div1.style.visibility = "visible";
div2.style.visibility = "visible";
div3.style.visibility = "visible";
div4.style.visibility = "visible";
div5.style.visibility = "visible";
div6.style.visibility = "visible";
//div7.style.display = "block";
div8.style.display = "none";
div9.style.display = "block";
div10.style.visibility = "visible";
div11.style.display = "block";
div12.style.display = "block";
}

// alert ('seen '+totalPieces+' thumbnails and '+totalPages+' pages.');

// get where the left pane thumbnails live, then place them in the left pane
// j < changed to j <= when removed CAT IMAGES
for (var j = 0; j <= totalPieces; j++) {
  thumbs[j] = document.getElementById("tn"+(j));
	// alert ("getting thumb "+j);
}
ppx = (ppLeftScreen+50);
ppy = 141;



// cos Kirst insisted on a bloody spiral presentation, position the tns in a spiral;
spiral = new Array();
if (pppieces >8) {
spiral[0] = new Array(2,2);
spiral[1] = new Array(1,2);
spiral[2] = new Array(0,2);
spiral[3] = new Array(0,1);
spiral[4] = new Array(0,0);
spiral[5] = new Array(1,0);
spiral[6] = new Array(2,0);
spiral[7] = new Array(2,1);
spiral[8] = new Array(1,1);
} else
// if less than 9 things to make it neater
{
spiral[0] = new Array(0,0);
spiral[1] = new Array(1,0);
spiral[2] = new Array(2,0);
spiral[3] = new Array(1,1);
spiral[4] = new Array(0,1);
spiral[5] = new Array(2,1);
spiral[6] = new Array(0,2);
spiral[7] = new Array(1,2);
spiral[8] = new Array(2,2);
};

if (setMeUp == 2) {
var loadProd = readCookie ("ppProd");
// alert ("read cookie="+loadProd);
for (var ii = 0; ii < 9; ii++) {
	thumbs[ii].style.left = (ppx + (150*(spiral[ii][0])))+"px";
 	thumbs[ii].style.top  = (ppy + (150*(spiral[ii][1])))+"px";
	if ((null == loadProd) && (null == locNo)) growThumbs(1,1); 
	}
if (loadProd) goBig (false,loadProd);
}

if (null != locNo) { 
goBig (true,locNo);
	}
}


// set cookie expiration date in year 2010
function setCookie(key,value) {

   var cookieDate = new Date(2011,11,10,19,30,30);
   document.cookie=key + "=" + escape(value) + "; expires=" + cookieDate.toGMTString() + "; path=/";
	// alert (document.cookie);
}

// each cookie separated by semi-colon;
function readCookie(key) {
  var cookie = document.cookie;

  var first = cookie.indexOf(key+"=");

  // cookie exists
  if (first >= 0) {
    var str = cookie.substring(first,cookie.length);
    var last = str.indexOf(";");

    // if last cookie
    if (last < 0) last = str.length;

    // get cookie value
    str = str.substring(0,last).split("=");
    return unescape(str[1]);
  } else {
    return null;
  }
}

// set cookie date to the past to erase
function eraseCookie (key) {

   var cookieDate = new Date(2000,11,10,19,30,30);
   document.cookie=key + "= ; expires="+cookieDate.toGMTString()+"; path=/";
}