/* mtwimg.js

Shelley Powers
http://burningbird.net/technology

To use, add a script tag with src set to this file. You'll also need to include the img.css file in the same page, 
or incorporate the style settings into your primary CSS file.

This is licensed under the GPL, GNU General Public License. See http://burningbird.net/technology/
*/

// global values, you may change these
// 'working' image
var workingImage = "http://www.treasureislandmedia.com/TreasureIslandMedia_2007/css/ajax-loader.gif";

// Stop editing unless you want to change basic functionality


// non-aggressive load function
// should play well with other children
function addLoadEvent(func) { 
  var oldonload = window.onload; 
  if (typeof window.onload != 'function') { 
    window.onload = func; 
  } else { 
    window.onload = function() { 
      oldonload(); 
      func(); 
    } 
  } 
} 
 
// chain event handlers for load event
// if multiple JS libraries are used
function addLoad(func) {
   if (window.addEventListener) {
      window.addEventListener("load",func,false);
   } else if (window.attachEvent) {
      window.attachEvent("onload",func);
   } else {
     addLoadEvent(func);
   }
}

addLoad(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(); }
}


// listens for keypress event
//
function listenKey () {	

   if (document.addEventListener) {
      document.addEventListener("keypress",getKey,false);
   } else if (document.attachEvent) {
      document.attachEvent("onkeypress",getKey);
   } else {
      document.onkeypress = getKey; 
   }
}
	
// stops listening for keypress event
//
function stopListenKey() {
   if (document.removeEventListener) {
      document.removeEventListener("keypress",getKey,false);
   } else if (document.detachEvent) {
      document.detachEvent("onkeypress",getKey);
   } else {
      document.onkeypress = ''; 
   }
}

// img.js setUp
// Adds 'wrapper' element to page contents
// Finds all images on the page with 'mtwimgthumb' 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() {

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

}

// 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) {
 
   listenKey();
 
   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;
   }

//    alert(pos);

    posX = evnt.clientX-320-230;
    posY = evnt.clientY+pos-172;
    if (posX<0)
        posX=0;
    if (posY<0)
        posY=0;
    
   var evntTarget = (evnt.target) ? evnt.target : evnt.srcElement;

//    offX = evntTarget.style.left;
//    offY = evntTarget.style.top;
//   alert(offX+', '+offY);


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

   var imgs = document.getElementsByTagName('img');
   imgs['mtwPictureimage'].src=oParent.href;

   // fade background, display expanded image
   var obj = document.getElementById('mtwPicture');
//   obj.style.top = pos + "px";
   obj.style.top = posY + "px";
   obj.style.left = posX + "px";
//   alert(posX+', '+posY);
   
   var cover = document.getElementById('mtwCover');
   setOpacity(cover,.3);
   obj.style.visibility='visible';
//   setupTimer(obj.id, 0, 100, 0.5, 1, getEffect("setOpacity"), "");  for some reason adding this causes the whole page to stay hidden

   // add event handler for image
   obj.onclick=restore;

   imgs['mtwPictureimage'].className = "mtwPictureimage2";

   // 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() {

   stopListenKey();

   var imgs = document.getElementsByTagName('img');
   imgs['mtwPictureimage'].src=workingImage;
   imgs['mtwPictureimage'].className = "mtwPictureimage1";

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

   // unhide image and clear img
   obj.style.visibility='hidden';

}