/**
 * @author Dhruba
 */

// An unobtrusive javascript code

(function() {
	function addListener(eventSource, eventName, eventHandler, capturing){
		eventSource.addEventListener ? eventSource.addEventListener(eventName, eventHandler, capturing) : eventSource.attachEvent ?
			eventSource.attachEvent("on" + eventName, eventHandler) : eventSource["on" + eventName] = eventHandler;
	}
	
	function initHandlers() {
		function highlightThumbnail(e) {
			if (!e) e = window.event;
			
			var source = e.target ? e.target : e.srcElement;
			source.style.cursor = "pointer";
			
			var img = document.getElementById("highlight");
			img.src = source.src.replace(/\.jpg/i, "highlight.jpg");
		}
		
		function popupThumbnail(e) {
			if (!e) e = window.event;
			
			var source = e.target ? e.target : e.srcElement;
			
			clickDx = e.clientX + (window.pageXOffset ? window.pageXOffset :
				document.documentElement && document.documentElement.scrollLeft ? document.documentElement.scrollLeft :
				document.body.scrollLeft ? document.body.scrollLeft : null);
			clickDy = e.clientY + (window.pageYOffset ? window.pageYOffset :
				document.documentElement && document.documentElement.scrollTop ? document.documentElement.scrollTop :
				document.body.scrollTop ? document.body.scrollTop : null);
			
			var div = document.getElementById("highlightDiv");
			if (!div) {
				div = document.createElement("div");
				div.id = "highlightDiv";
				div.style.position = "absolute";
				div.style.zIndex = "1000";
				
				var img = document.createElement("img");
				img.id = "highlightImg";
				
				div.appendChild(img);
				
				
				var closeImg = document.createElement("img");
				closeImg.src = source.src.replace(/\w+\.jpg/i, "close.gif");
				closeImg.style.position = "absolute";
				closeImg.style.top = "0px";
				closeImg.style.right = "0px";
				closeImg.style.cursor = "pointer";
				addListener(closeImg, "click", function() {div.style.visibility = "hidden";}, false);
				div.appendChild(closeImg);
				
					
				document.body.appendChild(div);
			}
			
			div.style.visibility = "visible";
			
			div.firstChild.src = source.src.replace(/\.jpg/i, "popup.jpg");
			
			
			
			var retVal = window.setInterval(
				function() {
					if (!div.firstChild.width) return;
										
					var divDx = clickDx - div.firstChild.width - source.width;
					var divDy = clickDy - div.firstChild.height - source.height;
			
					//div.style.left = divDx + 200 + "px";
					//div.style.top = divDy + "px";
					
					div.style.left = "200px";
					div.style.top = "200px";
				
					window.clearInterval(retVal);
				},
				10
			);
		}
	
		var allImgs = document.getElementsByTagName("img");
		var key = /thumb\d\d\.jpg/i;
		for (var i in allImgs) {
			var img = allImgs[i];			
			if (key.test(img.src)) {
				addListener(img, "mouseover", highlightThumbnail, false);
				addListener(img, "click", popupThumbnail, false);
			}				
		}
	}
	
	addListener(window, "load", initHandlers, false);
})();