//var control = 1;

$ = function (id) {
  return document.getElementById(id);
}

function hideContainer() {
  objContainer = $('screenshot-container');
  objContainer.style.display = "none";
  control = 0;
}

function showContainer(objLink) {

  var control = 1;
  
  var objContainer = $('screenshot-container');
  var objImage = $('containerImage');
  var linkValue = objLink.firstChild.nodeValue;
  objImage.src = "../images/" + linkValue + ".png"; 
	
	//labeling the images
  objImage.nextSibling.innerText = linkValue;// for IE
  objImage.nextSibling.textContent = linkValue;// for the rest of the known world
	
  objLink.setAttribute("href", objImage.src)

  if (objContainer.style.display == "block") {  
    hideContainer();
    return;
  } 

  imgPreload = new Image();

  imgPreload.onload = function() {
    var endHeight = imgPreload.height;
    var endWidth = imgPreload.width;

    zoom = function() {
      if(control == 0)  {
        clearInterval(active);
      } else {
        objImage.setAttribute('width', endWidth);
        objImage.setAttribute('height', endHeight);
        
        var containerTop = objLink.offsetTop;
        var containerLeft = objLink.offsetLeft;

        objContainer.style.top = (containerTop < 0) ? "0px" : containerTop - objLink.scrollHeight/2 - endHeight + "px";
        objContainer.style.left = (containerLeft < 0) ? "0px" : containerLeft + objLink.scrollWidth + "px";
        objContainer.style.display = "block";
        clearInterval(active);
      }

    } 

    var active = setInterval("zoom()",10);

    return false;
 
  }
    imgPreload.src = "../images/" + linkValue + ".png";

}