var timerID;

document.write('<div style=\"display: none;\" id=\"btn_add_container\"><input style=\"background-color: rgb(245, 245, 245);\" id=\"btn_add\" value=\"Save\" class=\"input-button-add\" title=\"Click to add this image to Saved Images\"  onmouseout=\"hideSavePopUp(event);\"  onclick=\"drop_via_link (current_figname);\" type=\"button\"></input></div>');
function removeAllBorders () {
	var images = document.getElementById('filmstripDiv').getElementsByTagName('img');
	for (i=0; i< images.length; i++) {
		images[i].style.border='3px solid #232323';
	}
}

function cancelAllTimers () {
        clearTimeout (timerID);    // JS page variable used for the timer
}

function displayFilmStripCaption(pii, mungedPii, figId, locator, title, caption) {
		loadFilmStripCaptionData(pii, mungedPii, figId, locator, title, caption);
        var tmpstr = 'updateFilmStripCaption ("' + locator + '", "' + caption + '")';
        timerID = setTimeout(tmpstr, 400);
}

function loadFilmStripCaptionData(pii, mungedPii, figId, locator, title, caption){
        var image = document.getElementById(locator);
        var position = findPos(image);
		updateCaption (image, position, caption);
        showSaveButton(image, pii, mungedPii, figId, locator, title, caption, position, 3, 41);
}
function updateFilmStripCaption (locator, caption) {
        document.getElementById(locator).style.border = '3px solid #788589';		// cyan';
        document.getElementById("btn_add_container").style.visibility = 'visible';
		document.getElementById("gallery_caption").style.visibility = 'visible';
		document.getElementById("btn_add_container").style.display = 'block';
		document.getElementById("gallery_caption").style.display = 'block';	
}

function displayFilmStripCaptionVisitor (locator, caption) {
        var tmpstr = 'updateFilmStripCaptionVisitor ("' + locator + '", "' + caption + '")';
        timerID = setTimeout(tmpstr, 400);
}

function updateFilmStripCaptionVisitor (locator, caption) {
		var image = document.getElementById(locator);
        var position = findPos(image);
		updateCaption (image, position, caption);
        document.getElementById(locator).style.border = '3px solid #788589';		// cyan
		document.getElementById("gallery_caption").style.visibility = 'visible';
		document.getElementById("gallery_caption").style.display = 'block';
}

function updateCaption (image, position, InCaption) {
	var top = document.getElementById(fetchFilmStripDivId(image.id)).offsetTop - document.body.scrollTop;
    document.getElementById("gallery_caption").style.visibility = "hidden";
	document.getElementById("gallery_caption").style.top = (top + 106) + 'px';
	var left = calculateImagePopupLeftInFilmStrip(position.curleft, image.width);	
	document.getElementById("gallery_caption").style.left = left +'px';
    document.getElementById("gallery_caption").innerHTML = InCaption;
}



function displayLargeImageCaption (InCaption) {
      updateLargeImageCaption(InCaption);
}

function updateLargeImageCaption (InCaption) {
        updateLargeImageCaptionStyle(InCaption);
}

function updateLargeImageCaptionStyle (InCaption) {
	var top = 0;
	
    document.getElementById("lrg_img_caption").style.visibility = "hidden";
    document.getElementById("lrg_img_caption").style.top = top + 'px';
    document.getElementById("lrg_img_caption").innerHTML = InCaption;
    document.getElementById("lrg_img_caption").style.visibility = "visible";
}


function hideLargeImageCaption () {
       document.getElementById("lrg_img_caption").style.visibility = "hidden";
}

function hideFilmStripCaption (locator, event) {
        document.getElementById(locator).style.border = '3px solid #232323';
        document.getElementById("gallery_caption").style.visibility = "hidden";
		hideSavePopUp(event);        
}

function hideSavePopUp(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')) {
			if(isObject(document.getElementById("btn_add_container"))) {
				document.getElementById("btn_add_container").style.visibility = "hidden";
				document.getElementById("btn_add_container").style.display = "none";
			}
		window.clearTimeout(timerID);
	}
}

function highLightSelectedFilmStripImage() {
	// document.getElementById(selectedFilmStripImageID).style.border = '3px solid orange';
}