function doPopupImage() {
	if (!document.getElementsByTagName) return false;
	var links = document.getElementsByTagName("a");
	for (var i=0; i < links.length; i++) {
		if (links[i].className.match("popup")) {
			links[i].onclick = function() {
				var w = this.getAttribute('w');
				var h = this.getAttribute('h');
				//alert('w='+w+' h='+h);
				window.open(this.href,'','toolbar=0,resizable=1,menubar=0,scrollbars=1,width='+w+',height='+h);
				return false;
			}//end func
		}//end if
	}//end if
}//end func

$(document).ready(function() {
    /*
     * Handles the zooming of prodcuct images.
     * Written using jQuery
     */
	$(".mainimage").each(function(idx, el){
		if(
			$(this).find("img").attr("lrg") != undefined
			&&
			$(this).find("img").attr("lrg").length > 0
			) {
			//only for .mainimage that contain an img with a lrg att
			var src_zoom = $(this).find("img").attr("lrg");
			//Set some css on mainimage
			$(this).css({
				overflow: "hidden",
				cursor: "pointer"
			});
			//build zoomFrame
			var oZoom = $("<div></div>").addClass("zoomFrame").css({
					backgroundColor: "silver",
					position: "absolute",
					zIndex:100
				}).hide();
			//build image
			var oImg = $("<img>").attr({src:src_zoom}).addClass("zoomImage").css({width: "auto", height: "auto"});
			oImg.appendTo(oZoom);
			oZoom.appendTo($(this));
			
			//make zoom label
			var oLabel = $("<span>Click to zoom in</span>").addClass("zoomLabel button").css({
				position: "absolute",
				top:0,
				left:0,
				padding: "2px 4px",
				display:"block",
				color:"white",
				background:"black",
				zIndex:10
				}).hide();
			oLabel.appendTo($(this));
			
			//Called after image is loaded and limits set : Ready to use! Show label.
			$(this).bind("load", function(e){
    			//console.log("Main loaded");
				$(this).find(".zoomFrame").hide();
				$(this).find(".zoomLabel").fadeIn("slow");
    		});

			//Called by image finished loading load event. Sizes image and sets drag limits
			oZoom.bind("load", function(e){
				//console.log("imagesize " + $(this).width() + " : " + $(this).height());   
				var max_x = $(this).parent().width() - $(this).width();
				var max_y = $(this).parent().height() - $(this).height();
				$(this).attr({
					max_x: max_x,
					max_y: max_y
				}).css({
					left: (max_x/2),
					top: (max_y/2),
					backgroundColor: "silver",
					position: "absolute"
				});
				$(this).parent().trigger("load");
			});

			//Called when large image is finished loading : Calls it's parents load
			oImg.bind("load", function(e){
    			//console.log("Image is loaded : Call parent load event");
				$(this).parent().trigger("load");
    		});
			
			//onclick Display the large image and make it draggable within the frame.
			$(this).click(function(){
				//console.log("workwith " + $(this).find(".zoomFrame").attr("max_x") + " : " + $(this).find(".zoomFrame").attr("max_y"));
				$(this).css({
					cursor: "move"
				});
				$(this).find(".zoomFrame").fadeIn("fast").draggable({ 
						zIndex: 1000
					,	cursor: "move"
					,	drag: function(ev, ui){
							//console.log(ui.position.left + " : " + ui.position.top);
							if(ui.position.top > 0) ui.position.top = 0;
							if(ui.position.top < $(ui.helper).attr("max_y")) ui.position.top = $(ui.helper).attr("max_y");
							if(ui.position.left > 0) ui.position.left = 0;
							if(ui.position.left < $(ui.helper).attr("max_x")) ui.position.left = $(ui.helper).attr("max_x");
						}
				});
			});

      		//on enter/re-enter zoomarea quickly then kill the timeout that would otherwise fade the large image out.
			$(this).find(".zoomFrame").bind("mouseenter",function(){
				try{
					//console.log("Got timeOut " + timeId + " : Kill it");
					clearTimeout(timeId);
					}catch(any){};
    		});
			
			//onLeave image area wait a bit then fade out back to default image
			$(this).find(".zoomFrame").bind("mouseleave",function(obj){
				timeId = setTimeout("$(\".zoomFrame\").fadeOut(\"normal\");", 500 );
				$(this).parent().css({
					cursor: "pointer"
				});
    		});
		}//if
	});
});


/***** WINDOW ONLOADER ****/
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

addLoadEvent(function() {
  /* more code to run on page load */ 
	doPopupImage();
});