// #####################################
// # Display the large image
// # 
// # Add a listener for mouseout in order to release the large image
// #####################################

var thumbexp_fullImage = false;
var thumbexp_transparentCover = false;
var thumbexp_inZoom = false;
var thumbexp_thumbnail = false;
var thumbexp_anchor = false;
var thumbexp_preload;
var thumbexp_triggerNode;
var thumbexp_timeout;
var thumbexp_paddingY;
var thumbexp_paddingX;
var thumbexp_borderSize = 2;

function thumbexp_zoomIn() {
	enableImages = true;
	expandDelay = 100;
	if (thumbexp_inZoom)
		thumbexp_zoomOut();
	
	thumbnail = this;
	thumbexp_thumbnail = thumbnail;
	//thumbnail.removeEventListener('mouseover', thumbexp_zoomIn, false);
	
	thumbexp_paddingY=window.scrollMaxX==0?0:thumbexp_scrollWidth; //Add padding if scrollbar present
	thumbexp_paddingX=window.scrollMaxY==0?0:thumbexp_scrollWidth;
	
	body = document.getElementsByTagName('body')[0];
	preload = new Image();
	preload.className = "thumbexp_ignore";
	preload.body = body;
	thumbexp_preload = preload;
	thumbexp_timeout = setTimeout("thumbexp_preload.onload = thumbexp_sizeAndPosition; thumbexp_preload.src=thumbexp_thumbnail.thumbexp_source; thumbexp_preload.onerror = thumbexp_imgError;", expandDelay);
	
	var fullImage=thumbnail.ownerDocument.createElement('img');
	fullImage.className = "thumbexp_ignore";
	thumbexp_fullImage = fullImage;
	//fullImage.addEventListener('load', thumbexp_sizeAndPosition, false);
	fullImage.style.visible=false;
	fullImage.style.position="absolute";
	fullImage.style.width='auto';
	fullImage.style.height='auto';
	fullImage.style.border= thumbexp_borderSize + 'px solid #3b5998';
	fullImage.style.margin='0px';
	fullImage.style.padding='0px';
	fullImage.style.backgroundColor = thumbexp_findBackgroundColor(thumbnail);
	
	var transparentCover=thumbnail.ownerDocument.createElement('div');
	transparentCover.className = "thumbexp_ignore";
	thumbexp_transparentCover = transparentCover;
	transparentCover.style.position='absolute';
	transparentCover.style.width=(thumbnail.offsetWidth + 2) +'px';
	transparentCover.style.height = (thumbnail.offsetHeight + 2) + 'px';
	var opacity = "0"
	transparentCover.style.opacity = opacity;
	transparentCover.style.filter = "alpha(opacity=" + opacity*100 + ")";
	transparentCover.style.MozOpacity = opacity;
	transparentCover.style.KhtmlOpacity = opacity;
	transparentCover.style.backgroundColor = 'red';
	transparentCover.style.borderColor='transparent';
	transparentCover.style.borderWidth='0px';
	transparentCover.style.zIndex=100; //32-bit int max
	
	anchorAncestor = thumbexp_getAnchorAncestor(thumbnail);
	if(anchorAncestor) {
		anchor = thumbnail.ownerDocument.createElement('a');
		anchor.className = "thumbexp_ignore";
		body.appendChild(anchor);
		anchor.href = anchorAncestor.href;
		anchor.appendChild(transparentCover);
		thumbexp_anchor = anchor;
	}
	else body.appendChild(transparentCover);
	
	thumbexp_forceLocation(transparentCover, thumbexp_getAbsoluteTop(thumbnail), thumbexp_getAbsoluteLeft(thumbnail));
	
	transparentCover.onmouseout = thumbexp_zoomOut;
	fullImage.onmouseout;
	thumbexp_inZoom = true;
}

function thumbexp_imgError() {
	thumbexp_zoomOut();
}

function thumbexp_getAnchorAncestor(obj) {
	if(!obj) return false;
	
	if (obj.tagName == 'A') return obj;
	else return thumbexp_getAnchorAncestor(obj.parentNode);
}

function thumbexp_scrollBarWidth(body) {
	var mainDiv = body.ownerDocument.createElement('div');
	mainDiv.style.width="500px";
	mainDiv.style.height="100px";
	mainDiv.style.overflow="scroll";
	
	var innerDiv = body.ownerDocument.createElement('div');
	innerDiv.style.width="100%";
	innerDiv.style.height="500px";
	
	body.appendChild(mainDiv);
	mainDiv.appendChild(innerDiv);
	
	var scrolledWidth = innerDiv.offsetWidth;
	mainDiv.style.overflow="hidden";
	var scrollBarWidth = innerDiv.offsetWidth - scrolledWidth;
	
	body.removeChild(mainDiv);
	
	return scrollBarWidth;
}

function thumbexp_sizeAndPosition () {
	thumbexp_fullImage.src=this.src;
	// Initial size
	var height = this.height + 2*thumbexp_borderSize;
	var width = this.width + 2*thumbexp_borderSize;
	
	var shrinkRatioHeight = 0;
	var shrinkRatioWidth = 0;
	
	// Shrink to fit page
	//    1) Determine if image is wider/taller than window
	//    2) If so, find out how much wider/taller (ratios)
	//    3) Shrink the value with the larger ratio, since the other value is "auto" and will auto-shrink
	if (this.height > document.documentElement.clientHeight - thumbexp_paddingY) {
		shrinkRatioHeight = (this.height - document.documentElement.clientHeight + thumbexp_paddingY) / this.height;
	}
	if (this.width > document.documentElement.clientWidth - thumbexp_paddingX) {
		shrinkRatioWidth = (this.width - document.documentElement.clientWidth + thumbexp_paddingX) / this.width;
	}
	if (shrinkRatioHeight > shrinkRatioWidth) {
		width = width*(document.documentElement.clientHeight - thumbexp_paddingY)/height;
		height = (document.documentElement.clientHeight - thumbexp_paddingY);
	}
	else if (shrinkRatioWidth > shrinkRatioHeight) {
		height = height*(document.documentElement.clientWidth - thumbexp_paddingX)/width;
		width = (document.documentElement.clientWidth - thumbexp_paddingX);
	}
	
	if(thumbexp_fullImage.style !== undefined) {
		thumbexp_fullImage.style.height = (height - 2*thumbexp_borderSize) + "px";
		thumbexp_fullImage.style.width = (width - 2*thumbexp_borderSize) + "px";
	}
	// Initial top-left corner
	var left=thumbexp_getAbsoluteLeft(thumbexp_thumbnail)+(thumbexp_thumbnail.offsetWidth-width)/2;
	var top=thumbexp_getAbsoluteTop(thumbexp_thumbnail)+(thumbexp_thumbnail.offsetHeight-height)/2;
	
	// Move if image is past the left or top sides
	if(window.scrollY !== undefined) {
		if (top < window.scrollY) top = window.scrollY;
		if (left < window.scrollX) left = window.scrollX;
	}
	else {
		if (top < document.documentElement.scrollTop) top = document.documentElement.scrollTop;
		if (left < document.documentElement.scrollLeft) left = document.documentElement.scrollLeft;
	}
	
	// Move if image is past the bottom or right sides
	if (top + height > document.documentElement.clientHeight - thumbexp_paddingY + window.scrollY)
		top -= top + height - document.documentElement.clientHeight + thumbexp_paddingY - window.scrollY;
	if (left + width > document.documentElement.clientWidth - thumbexp_paddingX + window.scrollX)
		left -= left + width - document.documentElement.clientWidth + thumbexp_paddingX - window.scrollX;
	
	this.body.appendChild(thumbexp_fullImage);
	// Set final location
	thumbexp_forceLocation(thumbexp_fullImage, top, left);
}

function thumbexp_findBackgroundColor(z) {
	if (!z) return '';
	else if(z.style && z.style.backgroundColor) return z.style.backgroundColor;
	else if(z.bgColor) return z.bgColor;
	else return thumbexp_findBackgroundColor(z.parentNode);
}

// ###############################################
// # Sometimes an image will not be positioned absolutely.  In these cases, we compare the
// # desired position with the actual position and move the image by the difference.
// ###############################################

function thumbexp_forceLocation(obj, top, left) {
	obj.style.top = top + 'px';
	obj.style.left = left + 'px';
	if( thumbexp_getAbsoluteLeft(obj) != left) {
		left -= (thumbexp_getAbsoluteLeft(obj) - left);
		obj.style.left = left + 'px';
	}
	if( thumbexp_getAbsoluteTop(obj) != top) {
		top -= (thumbexp_getAbsoluteTop(obj) - top);
		obj.style.top = top + 'px';
	}
}

// ###################################
// # Get rid of the large image and restart the <a> mouseover event
// ###################################

function thumbexp_zoomOut() {
	// Make sure to get rid of any image data that might phantomly show up on the n ext image request.
	clearTimeout(thumbexp_timeout);
	
	if(!thumbexp_thumbnail) return;
	
	body = thumbexp_thumbnail.ownerDocument.getElementsByTagName('body')[0];
	try {
		if(thumbexp_fullImage && thumbexp_fullImage.src && body) {
			body.removeChild(thumbexp_fullImage);
		}
		if(thumbexp_anchor && body) {
			if(thumbexp_transparentCover && thumbexp_anchor) thumbexp_anchor.removeChild(thumbexp_transparentCover);
			body.removeChild(thumbexp_anchor);
		}
		else if(thumbexp_transparentCover && body) body.removeChild(thumbexp_transparentCover);
	}
	catch (err) {
	}
	thumbexp_fullImage=false;
	thumbexp_transparentCover=false
	thumbexp_anchor=false;
	thumbexp_thumbnail=false;
	thumbexp_inZoom = false;
}

// ##########################################
// # Get the image's absolute left position
// # 
// # This is the position relative to the left of the page (not the window).
// ##########################################

function thumbexp_getAbsoluteLeft(obj) {
	try {
		var scrollX;
		if(window.scrollX !== undefined)
			scrollX = window.scrollX;
		else
			scrollX = document.documentElement.scrollLeft;
		return obj.getBoundingClientRect().left + scrollX;
	}
	catch (err) {
	}
	
	//getBoundingClientRect() fails on Firefox 2 and below, so use recursive offsetParents instead.
	if (obj.offsetParent)
		return thumbexp_getAbsoluteLeft(obj.offsetParent)+obj.offsetLeft;
	return obj.offsetLeft;
}

// ##########################################
// # Get the image's absolute top position
// # 
// # This is the position relative to the top of the page (not the window).
// ##########################################

function thumbexp_getAbsoluteTop(obj) {
	try {
		var scrollY;
		if(window.scrollY !== undefined)
			scrollY = window.scrollY;
		else
			scrollY = document.documentElement.scrollTop;
		return obj.getBoundingClientRect().top + scrollY;
	}
	catch (err) {
	}
	
	//getBoundingClientRect() fails on Firefox 2 and below, so use recursive offsetParents instead.
	if (obj.offsetParent)
		return thumbexp_getAbsoluteTop(obj.offsetParent)+obj.offsetTop;
	return obj.offsetTop;
}
window.onload = loader;
var thumbexp_scrollWidth;
function loader(e) {
	var anchors = document.getElementsByTagName("a");
	for(var i = 0; i< anchors.length; i++) {
		if(anchors[i].className == "thumbexp_ignore") {
			var images = anchors[i].getElementsByTagName("img");
			for(var j = 0; j< images.length; j++) {
				if(images[j].className == "thumbexp_ignore") {
					images[j].thumbexp_source = anchors[i].href;
					//anchors[i].addEventListener('mouseover', thumbexp_zoomIn, false);
					images[j].onmouseover = thumbexp_zoomIn;
				}
			}
		}
	}
	
	bodies = document.getElementsByTagName('body');
	if(bodies.length > 0) {
		thumbexp_scrollWidth = thumbexp_scrollBarWidth(bodies[0]);
	}
}