var PythonImageOpener = {
	"a.image-popup" : function(element) {
		PythonEvent.observe(element, "click", ImagePopup.popupImage);
		element = null;
	},
	"a.image-popup-link" : function(element) {
		PythonEvent.observe(element, "click", ImagePopup.popupImageLink);
		element = null;
	}
};

var ImagePopup = {
	"popupImageLink" : function(event) {
	  var link = PythonEvent.element(event);
	  
	  ImagePopup.openImage(event, link.href);
  },
	
	"popupImage" : function(event) {
    var image = PythonEvent.element(event);
    var link = image.parentNode;
    
	  ImagePopup.openImage(event, link.href);
	},
	
	"openImage" : function(event, link) {
    var popupImage = new Image();
    
		PythonEvent.observe(popupImage, "load", function() {
		    var popup = PythonElement.get("image-popup");
		    
		    var theImage = null;
		    if (popup == null) {
		    	popup = document.createElement("div");
		    	popup.setAttribute("id", "image-popup");
		    	popup.innerHTML = "<div id='image-popup-title'>Click image to close</div><img id='image-popup-image' src='" + popupImage.src + "'/>";
			    document.body.appendChild(popup);
			    
					theImage = PythonElement.get("image-popup-image");
			    PythonEvent.observe(popup, "click", ImagePopup.closeImage);
		    }
		    else {
					theImage = PythonElement.get("image-popup-image");
					theImage.src = popupImage.src;
				}
		    		    
		    var height = PythonWindow.viewportHeight();
		    var scrollY = PythonWindow.scrollPosition()[1];
		    var offset = ((height - popupImage.height)/2) < 10 ? 10 : ((height - popupImage.height)/2);
		    
		    popup.style.left = ((document.body.scrollWidth - popupImage.width - 2) / 2) + "px";
		    popup.style.top = (scrollY + offset) + "px";
				popup.style.display = "block";
				
		});

		popupImage.src = link;
    
		PythonEvent.stop(event);
	},
	
	"closeImage" : function (event) {
		var popup = PythonElement.get("image-popup");
		popup.style.display = "none";
	}
}

/* Duplicates of Prototype for main site */
var PythonEvent = {
	"observe" : function(element, eventName, handler) {
		if (element.addEventListener) {
      element.addEventListener(eventName, handler, false);
    } else if (element.attachEvent) {
      element.attachEvent("on" + eventName, handler);
    }
	},
	"stop" : function(event) {
    if (event.preventDefault) {
      event.preventDefault();
      event.stopPropagation();
    } else {
      event.returnValue = false;
      event.cancelBubble = true;
    }
	},
	"element" : function(event) {
    return event.target || event.srcElement;
  }
}

var PythonWindow = {
	"viewportHeight" : function() { 
    var height = 0;
    if (window.innerHeight) {
			height = window.innerHeight;
    }
    else if (document.documentElement) {
			height = document.documentElement.clientHeight;
    }
    else {
			height = document.body.clientHeight;
    }
    
    return height;
	},
	
	/*
	 * How far we're scrolled down the viewport
   */
	"scrollPosition" : function() {
    var scrollY, scrollX;
    
		if (self.pageYOffset) {
			scrollX = self.pageXOffset;
			scrollY = self.pageYOffset;
		}
		else if (document.documentElement && document.documentElement.scrollTop) {
			scrollX = document.documentElement.scrollLeft;
			scrollY = document.documentElement.scrollTop;
		}
		else if (document.body) {
			scrollX = document.body.scrollLeft;
			scrollY = document.body.scrollTop;
		}	
		
		return [scrollX, scrollY];
	}
}

var PythonElement = {
	"get" : function(id) {
		return document.getElementById(id);
	}
}

Behaviour.register(PythonImageOpener);