/* Author: Eric Cheng and Luke Wojewoda.  Copyright 2001. All Rights Reserved.
 * If you use any of this code, you MUST publicly cite http://echeng.com/travel/kilimanjaro/ as the source. */

	var agt   = navigator.userAgent.toLowerCase();
	var vers  = navigator.appVersion.toLowerCase();
	var major = parseFloat(navigator.appVersion);
	var ie    = (agt.indexOf("msie") != -1);
	var ie3   = (ie && (major == 2));
	var ie4   = (document.all);
	var ie45  = (ie && major >= 4.0 && (parseFloat(vers.substring( vers.indexOf("msie ") + 5, vers.length)) >= 4.5 ));
	var ie5  = (ie && major >= 4.0 && (parseFloat(vers.substring( vers.indexOf("msie ") + 5, vers.length)) >= 5.0 ));
	var ie55  = (ie && major >= 4.0 && (parseFloat(vers.substring( vers.indexOf("msie ") + 5, vers.length)) >= 5.5 ));
	var ns4   = (document.layers);
	var ns45  = (ns4 && major>=4.5);
	var ns6	  = (!ie && major>=5.0);		// if ns6==true, ns4 and ns45 will both be false, since ns6 behaves differently than ns4/4.5
	var win   = (agt.indexOf("win") != -1);
	var mac   = (agt.indexOf("mac") != -1);

	var gLayoutDivHeight = 240;
	var gImages;
	var gCurrentPage, gTotalPages, gNumImages;
	var gNextLinkHTML = '<A href=\"#\" onclick=\"gotoPageRel(1);\">NEXT PAGE</a>';
	var gPrevLinkHTML = '<A href=\"#\" onclick=\"gotoPageRel(-1);\">PREVIOUS PAGE</a>';
	var gNextLinkHTML_disabled = '<font class=\"disablednav\">NEXT PAGE</font>';
	var gPrevLinkHTML_disabled = '<font class=\"disablednav\">PREVIOUS PAGE</font>';
	var gPrevPageLinkHTML = '<A href="#" onclick="displayImageRel(-1);" name="imagenavprev"><img src="images/left_arrow.gif" width="6" height="10" border=0></A>';
	var gNextPageLinkHTML = '<A href="#" onclick="displayImageRel(1);" name="imagenavnext"><img src="images/right_arrow.gif" width="6" height="10" border=0></A>';
	var gPrevPageLinkHTML_disabled = '<img src="images/left_arrow_disabled.gif" width="6" height="10" border=0>';
	var gNextPageLinkHTML_disabled = '<img src="images/right_arrow_disabled.gif" width="6" height="10" border=0>';
	var gCurrentImageIndex;
	var gPageText = 'PAGE';
	var gImagePageText = 'VISUALS PAGE';

	// the following vars must be set by the external js config file included
	var gPrefix;	// the prefix of the image
	var gThumbdir;	// the thumbnail directory
	var gImagedir;	// the image directory
	var gStartNum;  // first image index
	var gStopNum;	// last image index
	var gSectionHeadingLabel;	// section heading label
	var gDivIDSubMenu = null;	// divID of the nav link to show a menu under
	var gStartSubMenu = null;	// menuID to be shown upon load
	var gNoPhotos = false;	// if true, then no photos for this page

	function Start(page) {
		OpenWin = this.open(page, "CtrlWindow", "toolbar=no,menubar=no,location=yes,scrollbars=yes,resizable=yes, width=800, height=600");
	}

	function showsubmenu (divid,menuid) {
		var center = getcenter (divid);
		var menuwidth = getwidth (menuid);
		var menuleft = Math.floor(center-(menuwidth/2));

		if ((menuleft+menuwidth)>752)
			setleft(menuid,752-menuwidth);
		else if (menuleft < 5)
			setleft(menuid,5);
		else
			setleft(menuid,menuleft);

		setvisible(menuid,"visible");
		setleft('dongle',center-3);
		setvisible('dongle',"visible");
	}

	function getcenter (divid) {
		if (ie4 && !ie5) {
			return Math.ceil(getleft(divid)+15);
		} else return Math.ceil(getleft(divid)+(getwidth(divid)/2));

	}

	function getleft (divid) {
		if (ie4 && !ie5) {
			return eval("document.all." + divid + ".style.pixelLeft;");
		} else return parseInt(getobject(divid).style.left);
	}

	function setleft (divid, left) {
		//alert(divid + ": left=" + left);
		if (ie4 && !ie5) {
			eval("document.all." + divid + ".style.left = \"" + left + "\";");
		} else getobject(divid).style.left=left;
	}

	function getwidth (divid) {
		if (ie4 && !ie5) {
			return parseInt(eval("document.all." + divid + ".style.width;"));
		} else return parseInt(getobject(divid).offsetWidth);
	}

	function setvisible (divid, vis) {
		if (ie4 && !ie5) {
			eval("document.all." + divid + ".style.visibility = \"" + vis + "\";");
		} else getobject(divid).style.visibility=vis;
	}

	function getobject (id) {
		if (ie4 && !ie5) {
			return eval("document.all" + id);;
		} else {
			return document.getElementById(id);
		}
	}

	function gotoPage (page) {
		if (page > 0 && page <= gTotalPages) {
			document.getElementById('article').style.top=-1*(page-1)*gLayoutDivHeight;
			gCurrentPage = page;
			initcurrentpagedisplay('pagelinks',page, gTotalPages, gPageText);
		}
	}

	function gotoPageRel (diff) {
		gCurrentPage += diff;
		if (gCurrentPage > gTotalPages) gCurrentPage = gTotalPages;
		if (gCurrentPage < 1) gCurrentPage = 1;
		document.getElementById('article').style.top=-1*(gCurrentPage-1)*gLayoutDivHeight;
		initcurrentpagedisplay('pagelinks',gCurrentPage, gTotalPages, gPageText);

		// disable next/prev link if we need to
		setNextAndPrevLinks();
	}

	function setInnerHTML(tagID, newHTML) {
		document.getElementById(tagID).innerHTML=newHTML;
	}

	function preloadImages() {
		if (gNoPhotos) {
			gNumImages = 0;
		} else {
			gNumImages = gStopNum - gStartNum + 1;

			gImages = new Array(gNumImages);
			statusDiv = document.getElementById('imageloadingstatus');

			for (i=gStartNum; i<=gStopNum; i++) {
				imageSrc = gThumbdir + "/" + gPrefix + i + ".jpg";
				//statusDiv.innerHTML="preloading image: " + imageSrc;

				// attempt to load the next image
				newImage = loadOneImage(imageSrc);

				// commit the loaded image
				gImages[i] = newImage;

				//alert("loaded image: " + imageSrc);
			}

			//alert("num images: " + gNumImages);
			//statusDiv.innerHTML="";
		}
	}

	function loadOneImage(imageSrc) {
		newImage = new Image();
		newImage.src = imageSrc;

		return newImage;
	}

	function displayImage(index) {
		if (gNoPhotos) {
			gCurrentImageIndex = 0;
		} else {
			if (index > 0 && index <= gNumImages) {
				//alert("<a href=\"" + gImagedir + "/" + gPrefix + index + ".jpg\"" + "><img src=\"" + gThumbdir + "/" + gPrefix + index + ".jpg\"" + " border=1></a>");
				//getobject('thumbdiv').innerHTML="<img src=\"" + gThumbdir + "/" + gPrefix + index + ".jpg\"" + " style=\"border:1px solid;\">";
				//getobject('thumbdiv').innerHTML="<a href=\"" + gImagedir + "/" + gPrefix + index + ".jpg\"" + "><img src=\"" + gThumbdir + "/tn_" + gPrefix + index + "_jpg.jpg\"" + " border=1></a>";
				getobject('thumbdiv').innerHTML="<a href=\"#\" onclick=\"LaunchKiliImage('" + gPrefix + "', " + index + ");\"" + "><img src=\"" + gThumbdir + "/tn_" + gPrefix + index + "_jpg.jpg\"" + " border=1></a>";
				//image = document.getElementById('imagedisp');
				//image.src = gThumbdir + "/" + gPrefix + index + ".jpg";

				gCurrentImageIndex = index;
				displayCaption(index);
				initcurrentpagedisplay('imagepagelinks',gCurrentImageIndex, gNumImages, gImagePageText);
				setNextAndPrevPageLinks();
			}
		}
	}

	function LaunchKiliImage(prefix, index) {
		var width=620;
		var height=640;
		
		// hack in some crappy stuff to make exception images load the proper size.  i would do this
		// in a better way, but i'm way too tired to right now.		
		if (prefix == "itinerary" && index == 1) { width=720; height=382; }
		else if (prefix == "itinerary" && index == 2) { width=720; height=567; }

		LaunchImagePageManual("/scripts/photo_close.php3?url=travel/kilimanjaro/" + gImagedir + "/" + prefix + index + ".jpg", width, height);
	}

	function LaunchImagePageManual(page, width, height) {
		OpenWin = this.open(page, "EchengImage","toolbar=no,menubar=no,location=no,scrollbars=no,resizable=no, width=" + width + ", height=" + height);
		if (OpenWin) OpenWin.focus();
	}

	function LaunchImagePage(page) {
		LaunchImagePageManual(page, 620, 635);
	}

	function displayCaption(index) {
		getobject("caption").innerHTML = gCaptions[index];
	}

	function displayImageRel(diff) {
		if (!gNoPhotos) {
			gCurrentImageIndex += diff;
			if (gCurrentImageIndex > gNumImages) gCurrentImageIndex = gNumImages;
			if (gCurrentImageIndex < 1) gCurrentImageIndex = 1;
			displayImage(gCurrentImageIndex);
		}
	}

	function setNextAndPrevLinks() {
		// init next and prev links
		if (gCurrentPage == gTotalPages) {
			setInnerHTML("nextpage", gNextLinkHTML_disabled);
			getobject("nextpageimage").src="images/right_arrow_disabled.gif";
		} else {
			setInnerHTML('nextpage', gNextLinkHTML);
			getobject("nextpageimage").src="images/right_arrow.gif";
		}

		if (gCurrentPage == 1) {
			setInnerHTML("prevpage", gPrevLinkHTML_disabled);
			getobject("prevpageimage").src="images/left_arrow_disabled.gif";
		} else {
			setInnerHTML('prevpage', gPrevLinkHTML);
			getobject("prevpageimage").src="images/left_arrow.gif";
		}
	}

	function setNextAndPrevPageLinks() {
		// init next and prev links
		if (gCurrentImageIndex == gNumImages) {
			setInnerHTML("imagenextlink", gNextPageLinkHTML_disabled);
		} else {
			setInnerHTML('imagenextlink', gNextPageLinkHTML);
		}

		if (gCurrentImageIndex == 1) {
			setInnerHTML("imageprevlink", gPrevPageLinkHTML_disabled);
		} else {
			setInnerHTML('imageprevlink', gPrevPageLinkHTML);
		}
	}

	function init() {
		var numpages;
		var clippedheight=document.getElementById('clippeddiv').offsetHeight;
		var nonclippedheight = document.getElementById('nonclippeddiv').offsetHeight;
		numpages =Math.ceil (nonclippedheight/clippedheight);
		//alert(numpages + " pages, height=" + clippedheight + ", hidden height=" + nonclippedheight);
		getobject('article').innerHTML=document.getElementById('nonclippeddiv').innerHTML;
		getobject('sectionheadingdiv').innerHTML=gSectionHeadingLabel;
		preloadImages();

		gTotalPages = numpages;
		gCurrentPage = 1;
		gCurrentImageIndex = 1;

		displayImage(1); // show first image
		initcurrentpagedisplay('pagelinks', gCurrentPage, numpages, gPageText);
		initcurrentpagedisplay('imagepagelinks', gCurrentImageIndex, gNumImages, gImagePageText);
		setNextAndPrevLinks();
		setNextAndPrevPageLinks();
		
		if (gStartSubMenu && gDivIDSubMenu) showsubmenu(gDivIDSubMenu, gStartSubMenu);
	}

	function initdirectaccesspagelinks(divID, numpages) {
		for (i = 1; i <= numpages; i++) {
			document.getElementById(divID).innerHTML+='<a href="javascript:gotoPage('+i+');">&nbsp;'+i+'&nbsp;</a>';
		}
	}

	function initcurrentpagedisplay(divID, currentpage, numpages, pageText) {
		document.getElementById(divID).innerHTML=pageText + " " + currentpage + " OF " + numpages;
	}