// JavaScript Document
var imageSet = new Array();

imageLoader = new imageLoaderClass ();
imageLoaderClass.prototype.queue = new Array();
imageLoaderClass.prototype.currentLoadingImage = 999999;
imageLoaderClass.prototype.currentDisplayedImage = 999999;
imageLoaderClass.prototype.reschedule = reschedule;

loaderInterval = setInterval("imageLoader.processRequests()", 500);

function imageLoaderClass () {
this.processRequests = processRequests;
}

function reschedule (prodId) {
var tempArray = new Array();
  for (var i in this.queue) {
    if (!(this.queue[i] == prodId)) {
    tempArray.push(this.queue[i]);
    }
  }
 tempArray.push(prodId);
 this.queue = tempArray;
}

function processRequests() {
// Always pop the requests, image for current focus will always load early, other images will still queue ..
  if (this.queue.length == 0) {
  return 0;
  }
getName(this.queue.pop());
}

function getPosition(obj , which){
var Value= 0;
  if (which=="TOP") {
    while(obj){
    Value+= obj.offsetTop;
    obj= obj.offsetParent;
    }
  } else if (which=="LEFT"){
    while(obj){
    Value+= obj.offsetLeft;
    obj= obj.offsetParent;
    }
  }
return Value;
}


function setImagePositionAndSource(imgDivObj, thumbObj, prodId) {
imageLoaderClass.prototype.currentDisplayedImage = prodId;

	if (imageClass.prototype.pageAnchor == undefined) {
	imageClass.prototype.pageAnchor = getPosition(document.getElementById("viewCatTPL"),'TOP');
	}
	
  if (imageSet[prodId] == undefined) {
  imageSet[prodId] = new imageClass(imgDivObj, thumbObj, prodId);
  imageLoaderClass.prototype.queue.push(prodId);
  } else {
  imageSet[prodId].setImage();
  }

return 0;
}

function hideThis (prodId) {
clearTimeout(imageSet[prodId].interval);
imageSet[prodId].imgDiv.style.display = 'none';
imageSet[prodId].opacity = 1;
imageLoaderClass.prototype.currentDisplayedImage = 999999;
}

function imageClass (imgDivObj, thumbObj, prodId) {
// Constants ...
this.noSource = false;
this.allowForTitle = 34;
this.allowForBottomBar = 45;
this.imgDiv = document.getElementById(imgDivObj);
//this.pageAnchor = getPosition(document.getElementById(anchorObject),'TOP');
this.thumbObj = thumbObj;
this.prodId = prodId;
this.interval = 0;
this.opacity = 1;
this.sourceSet = false;
this.setImage = setImage;

}

function setImage() {
// This image may no longer be active.
// or prevent case when returning to middle of active image queue, which may still be awaiting an AJAX reply..
  if (!(imageLoaderClass.prototype.currentDisplayedImage == this.prodId)) {
  return 0;
  } else if (!this.sourceSet) { imageLoaderClass.prototype.reschedule(this.prodId);
  // Is etill in queue but can be resheduled.
  return 0;
  }

// Good to go.
clearTimeout(this.interval);
var scrollAmount = getScrollXY();
var bottomOfWindow = AlertSize("H") + scrollAmount - this.allowForBottomBar;
setOpacity(this.prodId);
this.imgDiv.style.left = '10px';


// Default vertical align is at top of thumb.
this.computedTop = getPosition(this.thumbObj,'TOP') - this.pageAnchor + 7;

  if ((this.computedTop + this.pageAnchor) < scrollAmount) {
  // Unless thumb is partially off top of page.
  this.computedTop = scrollAmount - this.pageAnchor + this.allowForTitle ;
    } else if ((this.computedTop + this.imgHeight + this.pageAnchor + this.allowForTitle)>(bottomOfWindow)){
    // Or image is off bottom of page.
    this.computedTop = bottomOfWindow - this.imgHeight - this.pageAnchor - this.allowForTitle;
    }

// May need to adjust if image will not fit in window !
var adjusment = (this.computedTop+this.pageAnchor)-(Math.max(this.pageAnchor , scrollAmount));
  if (adjusment < 0) {
  this.computedTop -= adjusment - this.allowForTitle;
  }

this.imgDiv.style.top = this.computedTop + 'px';
this.imgDiv.style.left = '85px';

  if (this.noSource) {
	 this.imgDiv.style.width = 'auto';
   this.imgDiv.innerHTML="<h1 class='fi1'>"+this.imageName+".</h1>";
  } else {
	 // Add the border.
   this.imgDiv.style.width = this.imgWidth + 2 +  'px';
   this.imgDiv.innerHTML="<div class='fi-img-1'>"
     + "<img src='"+this.imageObj.src+"' width='"+this.imgWidth+"' height='"+this.imgHeight+"' /><div class='f1-top'><h1 class='fi0'>"+this.imageName+".</h1></div></div>";
  }

this.imgDiv.style.display='block';
fadeIn(this.prodId);
this.interval = setInterval("fadeIn("+this.prodId+")", 60);
}

function setSource(phpArray) {
eval(phpArray);
var obj = imageSet[phpPass["prodId"]];
obj.imageName = phpPass["name"];
obj.imgWidth = phpPass["width"];
obj.imgHeight = phpPass["height"];

 if (!(phpPass["image"] == "noimage")) {
	obj.imageObj = new Image(phpPass["width"],phpPass["height"]);
	obj.imageObj.src = ".\/images\/uploads\/"+phpPass["image"];
 } else {
  obj.noSource = true;
 }

obj.sourceSet = true;
  if (imageLoaderClass.prototype.currentDisplayedImage == phpPass["prodId"]) {
  // setImage is only called here for a new image that currently has focus, if not a new image is called elsewhere !
  obj.setImage();
  }
delete phpPass;
}


function fadeIn(prodId) {
  if (imageSet[prodId].opacity < 100) {
  imageSet[prodId].opacity = Math.min(imageSet[prodId].opacity + 15,100);
	setOpacity(prodId);
  } else {
  clearTimeout(imageSet[prodId].interval);
  }
}

function setOpacity(prodId) {

   var obj =  imageSet[prodId].imgDiv;
   var opacity =  imageSet[prodId].opacity;

  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";

  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;

  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;

  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;

}

function getName(prodId) {
   makeHttpRequest(".\/various-mods\/mouseOver\/ajaxImageID.php?inputText="+prodId, "setSource", true);
}

function makeHttpRequest(url, callback_function, async) {
var http_request = false;

  if (window.XMLHttpRequest) { // Mozilla, Safari,...
  http_request = new XMLHttpRequest();
    // If not XML do the following .. If method exists .. else Firefox error ..!
    if (http_request.overrideMimeType) {
    http_request.overrideMimeType('text/html');
    }
  } else
    if (window.ActiveXObject) { // IE
      try {
      http_request = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
        try {
        http_request = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {}
      }
    }

   if (!http_request) {
       alert('Unfortunatelly you browser doesn\'t support this feature.');
       return false;
   }

  http_request.onreadystatechange = function() {
  if (http_request.readyState == 4) {
    if (http_request.status == 200) {
    eval(callback_function + '(http_request.responseText)');
    } else
      {
      window.status = "Lost contact with server, if this message persists please check your internet connection !";
      }
    }
  }

  http_request.open('GET', url, async);
  http_request.send(null);
}

// *******************************************************************
// Author: ChrisColeman (on a stand alone computer)  Date: 21/10/2004 16:23:14
// Description: Return dimensions of the display area.
// *******************************************************************
function AlertSize(WorH) {

var myWidth = 0, myHeight = 0;

  if( typeof( window.innerWidth ) == 'number' ) {
  // Non-IE
  myWidth = window.innerWidth;
  myHeight = window.innerHeight;
  } else
    if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
    } else
      if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
      //IE 4 compatible
      myWidth = document.body.clientWidth;
      myHeight = document.body.clientHeight;
      }

  if(WorH=='H')
  {
  return myHeight;
  } else {
  return myWidth;
  }
}
function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return scrOfY;
}