// OverVIEW (build 1.9) - popup image preview mod
// Designed for ImageFolio Pro v4 & Commerce v1
// by Mark Torrance
// mark.torrance@cox.net
// copyright 2008
// Feel free to distribute this software but please leave the above notice intact
// This software is being released as donation ware, however if you use it commercially I would appreciate a donation of $15.
// Send PayPal donations to mark.torrance@cox.net
// Feel free to contact me regarding installation or customization services.
// Download the most current version at ( http://www.bwstudios.biz/downloads/OverVIEW.zip )
////////////////////////////////////////////
//   This copy customized for fotoquest.net
////////////////////////////////////////////

// OverVIEW User Configuration

var maxDim = 432; 				// Largest dimension of the popup image in pixels
var divPad = 5;					// Distance between the popup and the image in pixels
var fixedWidth = 1; 			// ( 1=Yes  0=No) Keep the div a fixed width(1) or collapse the width to fit the image(0)

var divBkgColor = '#ffffff'; 	// Background color in the pop up
var divBorderSize = 2; 			// Border size of the pop up in pixels
var divBorderType = 'ridge';	// Border type of the pop up (solid, dotted, dashed, double, groove,inset, outset, ridge, hidden)
var divBorderColor = '#f47d1e'; // Border color for the pop up

var imgBorderSize = 1;			// Border size of the image in pixels
var imgBorderType = 'dotted';	// Border type of the image (solid, dotted, dashed, double, groove,inset, outset, ridge, hidden)
var imgBorderColor = '#f47d1e';	// Border color of the image
var imgBorderPad = 2;			// Distance between the image and it's border in pixels

var cursorPadX = 15; 			// Space between the pop up and cursor horizontally
var cursorPadY = 15; 			// Space between the pop up and cursor vertically

var msgText = '© Laurence Delderfield';	// User defined text message

// Select what information to display - See notes at bottom of page.
// For the following 1=Yes  0=No
var display_Filename = 1;
var display_Filetype = 0;
var display_Filesize = 0;
var display_Date = 0;
var display_Rating = 0;
var display_Downloads = 0;

var display_IPTC = 1; 			// Display IPTC info?
var display_IPTClist = 0; 		// 1 = Display IPTC as list formatted by ImageFolio, 0 = Display individual IPTC data?

var display_IPTCcaption = 0;	// Display IPTC Caption
var display_IPTCheadline = 1;	// Display IPTC Headline
var display_IPTCcreateddate = 0;// Display IPTC Date Created
var display_IPTCcopyright = 0;	// Display IPTC Copyright

var display_msgText = 1;

// End User Configuration

//////////////////////////////////////

function OverVIEW(obj,bigimagesrc,iptcfilename,filetype,filesize,iptcdate,rating,downloads,iptclist,iptccaption,iptcheadline,iptccreated,iptccopyright) {

// removes the ovDiv if it already exists
if (document.getElementById('ovDiv')) {
	HideOverVIEW();
}

// Build Display Text
if (display_Filename == 1) {
iptcfilename = '<font class=ovFilename>Photo# ' + iptcfilename + '</font>';
} else if (display_Filename == 0) {
iptcfilename = '';
}

if (display_Filetype == 1) {
filetype = '<br><font class=ovFiletype>' + filetype + '</font>';
} else if (display_Filetype == 0) {
filetype = '';
}

if (display_Filesize == 1) {
filesize = '<br><font class=ovFilesize>' + filesize + '</font>';
} else if (display_Filesize == 0) {
filesize = '';
}

if (display_Date == 1) {
iptcdate = '<br><font class=ovDate>Added: ' + iptcdate + '</font>';
} else if (display_Date == 0) {
iptcdate = '';
}

if (rating) {
if (display_Rating == 1) {
rating = '<br><font class=ovRating>Rated: ' + rating + '</font>';
} else if (display_Rating == 0) {
rating = '';
}
}

if (downloads) {
if (display_Downloads == 1) {
downloads = '<br><font class=ovDownloads>Downloads: ' + downloads + '</font>';
} else if (display_Downloads == 0) {
downloads = '';
}
}

if (display_IPTC == 1) { // Display any IPTC info
if (display_IPTClist == 1) { // Display ImageFolios list or individual fields

if (iptclist) {
if (display_IPTC == 1) {
iptclist = '<br><font class=ovIPTC>' + iptclist + '</font>';
} else if (display_IPTC == 0) {
iptclist = '';
}
}

} else if (display_IPTClist == 0) {

if (iptccaption) {
if (display_IPTCcaption == 1) {
iptccaption = iptccaption.toString();
iptccaption = '<br><font class=ovIPTC>' + iptccaption + '</font>';
} else if (display_IPTCcaption == 0) {
iptccaption = '';
}
}

if (iptcheadline) {
if (display_IPTCheadline == 1) {
iptcheadline = iptcheadline.toString();
iptcheadline = '<br><font class=ovIPTC>' + iptcheadline + '</font>';
} else if (display_IPTCheadline == 0) {
iptcheadline = '';
}
}

if (iptccreated) {
if (display_IPTCcreateddate == 1) {
iptccreated = '<br><font class=ovIPTC>' + iptccreated + '</font>';
} else if (display_IPTCcreateddate == 0) {
iptccreated = '';
}
}

if (iptccopyright) {
if (display_IPTCcopyright == 1) {
iptccopyright = '<br><font class=ovIPTC>' + iptccopyright + '</font>';
} else if (display_IPTCcopyright == 0) {
iptccopyright = '';
}
}

if (display_msgText == 1) {
msgtext = '<br><font class=ovMsgText>' + msgText + '</font>';
} else if (display_msgText == 0) {
msgtext = '';
}

}
}

// Get information about the position and size of the thumbnail
var thumbHeight = obj.height;
var thumbWidth = obj.width;
var thumbLeft = thumbTop = 0;
	if (obj.offsetParent) {
		thumbLeft = obj.offsetLeft
		thumbTop = obj.offsetTop
		thumbRight = obj.offsetRight
		while (obj = obj.offsetParent) {
			thumbLeft += obj.offsetLeft
			thumbTop += obj.offsetTop
		}
	}

// Calculate the proportional short dimension of image 
if (thumbWidth < thumbHeight) { // vertical image
var minDim = ((maxDim / thumbHeight) * thumbWidth);
} else if (thumbWidth >= thumbHeight) { // horizontal image
var minDim = ((maxDim / thumbWidth) * thumbHeight);
}
minDim = Math.round(minDim)

// Create the OverVIEW div
newelement = document.createElement('div');
newelement.setAttribute('id','ovDiv');
newelement.setAttribute('name','ovDiv');

// Determine image orientation of the image by examining the thumbnail
if (thumbWidth < thumbHeight) { // Vertical Image
	if (fixedWidth == 1) {
	newelement.innerHTML = '<div style="width:' + maxDim + 'px">' + iptcfilename + iptcdate + filetype + filesize + downloads + rating + iptclist + iptccaption + iptcheadline + iptccreated + iptccopyright + msgtext + '<br><center><div style="width:' + minDim + 'px; height:' + maxDim + 'px; border: ' + imgBorderSize + 'px ' + imgBorderType + ' ' + imgBorderColor + '; padding: ' + imgBorderPad + 'px;"><img src="' + bigimagesrc + '" alt="Image Loading" width="' + minDim + '" height="' + maxDim + '"></div></center></div>';
	} else {
	newelement.innerHTML = '<div>' + iptcfilename + iptcdate + filetype + filesize + downloads + rating + iptclist + iptccaption + iptcheadline + iptccreated + iptccopyright + msgtext + '<br><center><div style="width:' + minDim + 'px; height:' + maxDim + 'px; border: ' + imgBorderSize + 'px ' + imgBorderType + ' ' + imgBorderColor + '; padding: ' + imgBorderPad + 'px;"><img src="' + bigimagesrc + '" alt="Image Loading" width="' + minDim + '" height="' + maxDim + '"></div></center></div>';
	}
} else if (thumbWidth >= thumbHeight) { // Square or Horizontal Image
	newelement.innerHTML = '<div>' + iptcfilename + iptcdate + filetype + filesize + downloads + rating + iptclist + iptccaption + iptcheadline + iptccreated + iptccopyright + msgtext + '<br><center><div style="width:' + maxDim + 'px; height:' + minDim + 'px; border: ' + imgBorderSize + 'px ' + imgBorderType + ' ' + imgBorderColor + '; padding: ' + imgBorderPad + 'px;"><img src="' + bigimagesrc + '" alt="Image Loading" width="' + maxDim + '" height="' + minDim + '"></div></center></div>';
}

newelement.style.padding = divPad + 'px';
newelement.style.position ='absolute';
newelement.style.top = 0;
newelement.style.left = 0;
newelement.style.border = divBorderSize + 'px ' + divBorderType + ' ' + divBorderColor;
newelement.style.background = divBkgColor;

if (document.getElementById) { //IS IE 4 or 5 (or 6 beta) 
newelement.style.visibility="hidden";
} 
if (document.layers) { //IS NETSCAPE 4 or below
document.newelement.style.visibility="hidden";
} 

document.body.appendChild(newelement);


// Get height of the OverVIEW div
var ovDivHeight = document.getElementById('ovDiv').offsetHeight;
var ovDivWidth = document.getElementById('ovDiv').offsetWidth;

// Correct horizontal position of the div
if (thumbWidth < thumbHeight) { // vertical image

// Correct horizontal position if the div will leave the screen for vertical image
	var myOffX = 0;
	if(((thumbLeft - posLeft()) + thumbWidth + ovDivWidth + cursorPadX) >= pageWidth()){
	myOffX = ovDivWidth - ((ovDivWidth * 2) + (cursorPadX));
	} else {
	myOffX = cursorPadX;
	}
} else if (thumbWidth >= thumbHeight) { // horizontal image

// Correct horizontal position if the div will leave the screen for a square or horizontal image
	var myOffX = 0;
	if(((thumbLeft - posLeft()) + thumbWidth + ovDivWidth + cursorPadX) >= pageWidth()){
	myOffX = ovDivWidth - ((ovDivWidth * 2) + (cursorPadX));
	} else {
	myOffX = cursorPadX;
	}
}

// Correct vertical position if the div will leave the screen
var myOffY = 0;
ovDivHeight = document.getElementById('ovDiv').offsetHeight;
if ((ovDivHeight) >= (pageHeight())) {
myOffY = (pageHeight() / 2);
myOffY = '-' + myOffY;
myOffY = Number(myOffY)
} else if (((thumbTop - posTop()) + thumbHeight + ovDivHeight + cursorPadY) >= (pageHeight())) {
myOffY = (((thumbTop - posTop()) + thumbHeight + ovDivHeight) - (pageHeight()));

if (myOffY >= (ovDivHeight + cursorPadY)) {
myOffY = ovDivHeight + cursorPadY;
myOffY = '-' + myOffY;
myOffY = Number(myOffY);
} else {
myOffY = myOffY - (myOffY * 2);
myOffY = Number(myOffY)
}

} else {
myOffY = cursorPadY;

}


// Make div follow mouse
var divName = 'ovDiv'; // div that is to follow the mouse
                       // (must be position:absolute)
var offX = myOffX;     // X offset from mouse position
var offY = myOffY;     // Y offset from mouse position

function mouseX(evt) {if (!evt) evt = window.event; if (evt.pageX) return evt.pageX; else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ?  document.documentElement.scrollLeft : document.body.scrollLeft); else return 0;}
function mouseY(evt) {if (!evt) evt = window.event; if (evt.pageY) return evt.pageY; else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); else return 0;}

function follow(evt) {if (document.getElementById(divName)) {var obj = document.getElementById(divName).style;

if (document.getElementById) { //IS IE 4 or 5 (or 6 beta) 
document.getElementById('ovDiv').style.visibility = 'visible';
} 
if (document.layers) { //IS NETSCAPE 4 or below
document.newelement.style.visibility="visible";
} 

obj.left = (parseInt(mouseX(evt))+offX) + 'px';
obj.top = (parseInt(mouseY(evt))+offY) + 'px';}}
document.onmousemove = follow;
}

// Hide OverVIEW
function HideOverVIEW(elem){
var newelement = document.getElementById('ovDiv');
document.body.removeChild(newelement);
}

// Browser Window Size and Position //
//// This Section //// copyright Stephen Chapman, 3rd Jan 2005, 8th Dec 2005
//// You may copy these functions but please keep the copyright notice as well
//// For more info on this section visit ( http://javascript.about.com/library/blscreen1.htm )

function pageWidth() {
return window.innerWidth != null? window.innerWidth : document.documentElement && document.documentElement.clientWidth ?
document.documentElement.clientWidth : document.body != null ? document.body.clientWidth : null;
}

function pageHeight() {
return  window.innerHeight != null? window.innerHeight : document.documentElement && document.documentElement.clientHeight ?
document.documentElement.clientHeight : document.body != null? document.body.clientHeight : null;
}

function posLeft() {
return typeof window.pageXOffset != 'undefined' ?
window.pageXOffset :document.documentElement && document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft ? document.body.scrollLeft : 0;
}

function posTop() {
return typeof window.pageYOffset != 'undefined' ?
window.pageYOffset : document.documentElement && document.documentElement.scrollTop ?
document.documentElement.scrollTop : document.body.scrollTop ? document.body.scrollTop : 0;
}

function posRight() {
return posLeft()+pageWidth();} function posBottom() {return posTop()+pageHeight();
}