﻿//paste the style into the header of the page and the script and div into the body

//<link href="../js/maximize.css" rel="stylesheet" type="text/css">
//<script type="text/javascript" language="javascript" src="../js/maximize.js"></script>
//<DIV id="showimage"></DIV>

var ie = document.all;
var ns6 = document.getElementById && !document.all;
var currentPic = -1;

function ietruebody()
{
	return (document.compatMode && document.compatMode != "BackCompat" && !window.opera) ? 
	    document.documentElement : document.body;
}

function FindPicIndex(selectedPic)
{
	if (selectedPic)
	{
			var picIndex;
			
			for (picIndex = 0; picIndex < document.images.length; picIndex++)
			{
				if (document.images[picIndex] == selectedPic)
				{
					return (picIndex);
				}
			}
	}
}

function ConfirmCurrentPic(currentPic, imgShow)
{
	if (document.images[currentPic].src != imgShow.src)
	{
		if (document.images[currentPic - 1])
		{
			if (document.images[currentPic - 1].src == imgShow.src)
			{
				currentPic--;
			}
		}
		if (document.images[currentPic + 1])
		{
			if (document.images[currentPic + 1].src == imgShow.src)
			{
				currentPic++;
			}
		}
	}
	
	return currentPic;
}

function SwitchPic(direction)
{
	var imgShow = document.getElementById("imgShow");
	var crossobj = document.getElementById("showimage");
	var className = '';

	if (imgShow)
	{
		currentPic = ConfirmCurrentPic(currentPic, imgShow);
		
		//loop through the images until the next galleryThumbnail
		while (className != 'galleryThumbnail')
		{
			currentPic = currentPic + direction;
			
			//check if the new pic is over the edge and push it back on the other side
			if (currentPic < 0)
			{
				currentPic = document.images.length;
			}
			else if (currentPic > document.images.length)
			{
				currentPic = 0;
			}
			
			var imgNew = document.images[currentPic];
			
			if (imgNew)
			{
				if (imgNew.src != imgShow.src)
				{				    
					className = imgNew.className;
				}
			}
		}
		
		if (imgNew)
		{
		    if (imgNew.style.display != 'none')
		    {
			    imgShow.src = imgNew.src;
			    crossobj.style.width = imgShow.width + "px";
			}
		}
	}
}

function Maximize(selectedPic)
{
	if (ie||ns6)
	{
		var crossobj = document.getElementById("showimage");
		var objDivBackground = document.getElementById("divBackground");
		
		currentPic = FindPicIndex(selectedPic);
		
		crossobj.innerHTML = 
	        '<div align="right" id="dragbar">' +
		        '<span id="closetext" onClick="closepreview()">Close</span>' +
	        '</div>' + 
	        '<img id="imgShow" src="' + selectedPic.src + '">' + 
	        '<div id="bottomBar">' +
		        '<table style="width:100%;"><tr><td align="left">' +
			        '<span id="spnBack" class="spanButton" onClick="SwitchPic(-1)">Back</span>' +
		        '</td><td align="right">' +
			        '<span id="spnNext" class="spanButton" onClick="SwitchPic(1)">Next</span>' +
		        '</td></tr></table>' +
	        '</div>';
						
		var imgShow = document.getElementById("imgShow");
			
		crossobj.style.width = imgShow.width + "px";
			
		var imgwidth = imgShow.width;
		var imgheight = imgShow.height;
		
		//find the center of the screen
//		var pgyoffset = ns6 ? parseInt(pageYOffset) : parseInt(ietruebody().scrollTop);
//		var windowWidth = (ns6 ? pageXOffset + window.innerWidth : 
//		    ietruebody().scrollLeft + ietruebody().clientWidth;
//		    
//		
//		var horzpos = ns6 ? pageXOffset + (window.innerWidth - imgwidth) / 2 : 
//		    ietruebody().scrollLeft + (ietruebody().clientWidth - imgwidth) / 2;
//		var vertpos = ns6 ? pgyoffset + (window.innerHeight - imgheight) / 2 : 
//		    pgyoffset + (ietruebody().clientHeight - imgheight) / 2;
		    
//		if (window.opera && window.innerHeight)  // compensate for Opera toolbar
//			vertpos = pgyoffset + (window.innerHeight - imgheight) / 2;
//		vertpos = Math.max(pgyoffset, vertpos);

        var screenHeight = (!ns6 ? window.screen.height - window.screenTop - 50 : window.innerHeight);
        var screenWidth = (!ns6 ? window.screen.availWidth : window.innerWidth);
        var horzpos = (screenWidth - imgwidth) / 2;
        var vertpos = (screenHeight - imgheight) / 2;
			
		crossobj.style.left = horzpos + "px";
		crossobj.style.top = vertpos + "px";
		crossobj.style.visibility = "visible";
		objDivBackground.style.width = screenWidth + "px";
		objDivBackground.style.height = screenHeight + "px";
		objDivBackground.style.visibility = "visible";
		
		return false;
	}
	else 
		return true;
}

function closepreview()
{
    var objDivBackground = document.getElementById("divBackground");
    var crossobj = document.getElementById("showimage");
    
	crossobj.style.visibility = "hidden";	
	objDivBackground.style.visibility = "hidden";
}

function drag_drop(e)
{

	if (ie && dragapproved)
	{
		crossobj.style.left = tempx + event.clientX-offsetx + "px";
		crossobj.style.top = tempy + event.clientY-offsety + "px";
	}
	else if (ns6 && dragapproved)
	{
		crossobj.style.left = tempx + e.clientX-offsetx + "px";
		crossobj.style.top = tempy + e.clientY-offsety + "px";
	}
	
	crossobj.style.width = imgShow.width + "px";

	return false;
}

function initializedrag(e)
{
	if (ie && event.srcElement.id == "dragbar" || ns6 && e.target.id == "dragbar")
	{
		crossobj = document.getElementById("showimage");
		
		offsetx = ie ? event.clientX : e.clientX;
		offsety = ie ? event.clientY : e.clientY;
		
		tempx = parseInt(crossobj.style.left);
		tempy = parseInt(crossobj.style.top);
		
		dragapproved = true;
		document.onmousemove = drag_drop;
	}
}

document.onmousedown = initializedrag;
document.onmouseup = new Function("dragapproved = false");