var timerID;
var maximagewidth = 175;	// maximum image width
var offsetfrommouse = [-75, -30];

document.write("<div id=\"trailimageid\" onmouseout=\"hideImagePopUp(event);\"><div id=\"Img_Popup_Layer\"></div></div><div style=\"display: none;\" id=\"btn_add_container\"><input \" id=\"btn_add\" value=\"Save\" class=\"input-button-add\" title=\"Click to add this image to Saved Images\" onmouseout=\"hideImagePopUp(event);\" type=\"button\"></input></div>");

function showImagePopUp(image, pii, mungedPii, locator, figId, title, caption,  event, isImageInWorkSpace) {
	var position = findPos(image);
	createImagePopUp(image, mungedPii, locator, position);
	showSaveButton(image, pii, mungedPii, figId, locator, title, caption, position, 1, 43);	
	timerID = setTimeout("setImageAndSavePopupVisible(" + isImageInWorkSpace +")", 600);
	image.style.border = '1px solid #FFA500';
}

function showVisitorImagePopUp(image, mungedPii, imageId, event) {
	var position = findPos(image);
	createImagePopUp(image, mungedPii, imageId, position);
	timerID = setTimeout("setImagePopupVisible()", 600);
}

function border_on(inPic) {
	inPic.style.border = '1px solid #FFA500';
}

function border_off(inPic) {
	inPic.style.border = '1px solid #FFFFFF';
}

function removeBorder(image) {
	image.style.border = '3px solid #232323';
}

function removeBorderWorkspaceImage(image) {
	image.style.border = '3px solid #535975';
}

function createImagePopUp(image, mungedPii, locator, position) {
	var popupNodes = document.getElementById(mungedPii + '-' + locator + '-imagePopupData');
	var popupTags = popupNodes.getElementsByTagName("td");
	var titleNode = popupTags[0].firstChild;
	var brNode = popupNodes.getElementsByTagName('br')[0];
	var infoNode = popupTags[1].firstChild;
	var trailImage = document.getElementById("trailimageid");

	var popupLayer = document.getElementById("Img_Popup_Layer");
	
	while (popupLayer.hasChildNodes()) {
		popupLayer.removeChild(popupLayer.firstChild);
	}
	
	popupLayer.appendChild(titleNode.cloneNode(true));
	popupLayer.appendChild(brNode.cloneNode(true));
	popupLayer.appendChild(brNode.cloneNode(true));
	popupLayer.appendChild(infoNode.cloneNode(true));
	
	var newtop, newleft;
		
	newtop = position.curtop + image.height - 5;
	newleft = calculateImagePopupLeft(position.curleft, image.width);

	trailImage.style.top = newtop + "px";
	trailImage.style.left = newleft + "px";
}

function setImageAndSavePopupVisible(showSavePopupButton) {
	setImagePopupVisible();
	if (showSavePopupButton) {
		setSavePopupVisible();
	} 
}

function setSavePopupVisible() {
	document.getElementById("btn_add_container").style.visibility = "visible";
	document.getElementById("btn_add_container").style.display = "block";	
}

function setImagePopupVisible() {
	document.getElementById("trailimageid").style.visibility = "visible";
	document.getElementById("trailimageid").style.display = "block";
}

function hideImagePopUp(event) {
	var fromTarget;
	var toTarget;
	if (event.fromElement && event.toElement) {
		fromTarget = event.fromElement;
		toTarget = event.toElement;
	} else {
		fromTarget = event.target;
		toTarget = event.relatedTarget;
	}
	if (isObject(toTarget) && (toTarget != document.getElementById("btn_add") && toTarget.nodeName != 'IMG')) {
		document.getElementById("trailimageid").style.visibility = "hidden";
		document.getElementById("trailimageid").style.display = "none";
		if(isObject(document.getElementById("btn_add_container"))) {
			document.getElementById("btn_add_container").style.visibility = "hidden";
			document.getElementById("btn_add_container").style.display = "none";
		}
		layeropen = 0;
		currentimg = "";
		window.clearTimeout(timerID);
	}
	// removeAllWorkspaceBorders ();
}

function contains(a, b) {
	// we climb through b parents
	// till we find a
	while (b && (a != b) && (b != null)) {
		b = b.parentNode;
	}
	return a == b;
}

function Hover_Img_Border_On(InObj) {
	InObj.style.border = "2px solid gray";	// #FFA500";
}

function Hover_Img_Border_Off(InObj) {
	InObj.style.border = "2px solid gray";
}