// global values, you may change these
var workingImage = "/images/loading.gif";

aaManageEvent(window,'load',setUp);

// cross-browser adjust opacity function
function setOpacity(obj,val) {
  obj.style.opacity = val;
  obj.style.MozOpacity=val;
  obj.style.KhtmlOpacity=val;
  val*=100;
  obj.style.filter = "alpha(opacity="+val+")";
} 

//
// Gets keycode. If 'x' is pressed then it hides the larger image.
//
function getKey(evnt){
   evnt = (evnt) ? evnt : ((window.event) ? window.event : "");
   var keycode = (evnt.which) ? evnt.which : evnt.keyCode;
   var key = String.fromCharCode(keycode).toLowerCase();
   if(key == 'x'){ restore(); }
}

// Adds 'wrapper' element to page contents
// Finds all images on the page with 'thumb' class
// adds click event handlers for each
// adds click event handler for the expanded picture element
//  added as part of the setup process
function setUp() {
   // add page container and image container
   var oldBody = document.body.innerHTML;

   document.body.innerHTML = "<div id='galleryCover'>" + oldBody + 
                             "</div>" + 
                             "<div id='galleryPicture'>" + 
                             "<table width='100%' border='0' padding='0'><tr><td width='100%' align='center' valign='center'><img id='galleryPictureimage' src='/images/loading.gif' alt='' /></td></tr></table>" +
							 "</div>";

   var elem = elementClass = null;
   for (i = 0; i < document.images.length; i++) {
      elem = document.images[i];
      elementClass = elem.getAttribute("class");
      elementClass = elementClass ? elementClass : elem.getAttribute("className");
      if (elementClass == 'thumb') {
         elem.onclick=expandPic;
      }
   }

   // add event handler for image
   document.getElementById('galleryPicture').onclick=restore;

}

// expand the photo
//   adds keypress event handling for keyboard management
//   opaques the page 'wrapper' to obscure the page contents
//   determines the scrolled position of the clicked image
//   sets the expanded picture frame to this position
//   sets the image to the new image
function expandPic(evnt) {
 
   aaManageEvent(document,'keypress',getKey);
 
   evnt = (evnt) ? evnt : ((window.event) ? window.event : "");
   // find photo position
   var pos = 0;
   if (window.pageYOffset) {
      pos = window.pageYOffset;
   } else if (document.documentElement && document.documentElement.scrollTop) {
      pos = document.documentElement.scrollTop
   } else if (document.body) {
      pos = document.body.scrollTop;
   }

   var evntTarget = (evnt.target) ? evnt.target : evnt.srcElement;

   // discover image src name
   var oParent = evntTarget.parentNode;

   document.images['galleryPictureimage'].src=oParent;

   // fade background, display expanded image
   var obj = document.getElementById('galleryPicture');
   obj.style.top = pos + "px";
   var cover = document.getElementById('galleryCover');
   setOpacity(cover,.1);
   obj.style.visibility='visible';

   // end event bubbling
   return false;
}


// restore
// stops listening for keypress for this application
// sets wrapper element to be completely transparent
// resets picture frame image back to the 'working' image
// hides the picture frame element
function restore() {

   aaStopEvent(document,'keypress',getKey);

   // restore opacity
   var cover = document.getElementById('galleryCover');
   setOpacity(cover,1.0);
   cover.style.backgroundColor="transparent";
   var obj = document.getElementById('galleryPicture');

   // unhide image and clear img
   obj.style.visibility='hidden';
   document.images['galleryPictureimage'].src=workingImage;
}