// photoAlbum.js: make a photo album with clickies and stuff.
//alert ("photoAlbum.js")
		var albumStep = 1;  // step 1: list all albums.  step 2: select & display an album
		var currentAlbum = 1;  // TODO: replace with querystring
		var currentPhoto = 1;  // TODO: replace with querystring
		var currentPage;   // in case row of nubs needs to be paged (more than 10)
		var filePath = "/About/i/gallery/";
		var numPhotos;
		var nubsInPage = 8;  // when paged, number of nubs
		var numPages = 0;
		var nubPageIncrement = 0;
		var startingNub, endingNub;

		function outputNubs() {
			// output nubs for photo selection
			var nubs = "<ol style=\"display:inline;\">";

			if(numPhotos <= 10) {
				startingNub = 1;
				endingNub = numPhotos;
				for(i=1; i<=numPhotos; i++) {
					if(i == 10)
						nub_style = "padding:3px 4px 4px 4px;";
					else
						nub_style = "padding:3px 7px 4px 7px;";
					if(i == numPhotos)
						nub_style += "margin-right:15px;";
					nubs += "<li class=\"nubs\" style=\"" + nub_style + "\" id=\"nub" + i + "\" onclick=\"loadPicture(" + i + ")\" onfocus=\"this.blur()\">" + i + "</li>";
				}
			}
			else {  // more than 10 pics; need to page them

				// calculate stuff
				numPages = Math.ceil(numPhotos / nubsInPage);
				currentPage = Math.ceil(currentPhoto / nubsInPage) + nubPageIncrement;
				startingNub = ((currentPage - 1) * nubsInPage) + 1;
				if(currentPage == numPages)
					endingNub = numPhotos;  // on last page, last num is numPhotos 
				else
					endingNub = nubsInPage * currentPage;

				// create nub string
				if(currentPage > 1)
					nubs += "<li class=\"nubs_li\"><a href=\"#\" class=\"nubs_a\" onclick=\"outputNextPrevNubs('prev')\">&laquo; Last " + nubsInPage + "</a></li>";
				for(i=startingNub; i<=endingNub; i++) {
					if(i >= 10)
						nub_style = "padding:3px 3px 4px 3px;";
					else
						nub_style = "padding:3px 7px 4px 7px;";
					if(i == numPhotos)
						nub_style += "margin-right:15px";
					nubs += "<li class=\"nubs\" style=\"" + nub_style + "\" id=\"nub" + i + "\" onclick=\"loadPicture(" + i + ")\" onFocus=\"this.blur()\">" + i + "</li>";
				}
				if(currentPage < numPages) {
					nubs += "<li class=\"nubs_li\"><a href=\"#\" class=\"nubs_a\" onclick=\"outputNextPrevNubs('next')\">Next " + nubsInPage + "&raquo;</a></li>";
				}
			}
			nubs += "</ol>";
			document.getElementById("photoNubs").innerHTML = nubs;
		}

		function outputNextPrevNubs(direction) {

			if(direction == "next")
				nubPageIncrement += 1;
			else
				nubPageIncrement -= 1;

			outputNubs();

			if(currentPhoto >= startingNub && currentPhoto <= endingNub)
				loadPicture(currentPhoto);  // photo is on current page, so highlight it
		}

		function loadPicture(selectedPhoto) {

			currentPhoto = selectedPhoto;

			// load current photo
			document.getElementById("mainPhoto").src = filePath + "album" + currentAlbum + "/" + currentPhoto + ".jpg";

			// output text
			var albumName = galleryInfo[currentAlbum]["album_name"];
			document.getElementById("albumName").innerHTML = albumName;
			document.getElementById("albumName_bc").innerHTML = albumName;
			captionText = galleryInfo[currentAlbum]["captions"][(currentPhoto-1)];
			if(captionText == null)
				document.getElementById("photoCaption").innerHTML = "&nbsp;";
			else
				document.getElementById("photoCaption").innerHTML = captionText;

			// highlight current nub
			for(i=startingNub; i<=endingNub; i++) {
				if(i == currentPhoto)
					document.getElementById("nub" + i).style.backgroundImage = "url(/About/i/gallery/ui/bg_nub_on.gif)";
				else
					document.getElementById("nub" + i).style.backgroundImage = "url(/About/i/gallery/ui/bg_nub_off.gif)";
			}

			// don't increment or decrement the page of nubs
			nubPageIncrement = 0;
		}

		function loadNextPrev(direction) {

			// calculate new currentPhoto
			if(direction == "next")
				currentPhoto++;
			else
				currentPhoto--;

			if(currentPhoto < 1)
				currentPhoto = 1;
			if(currentPhoto > numPhotos)
				currentPhoto = numPhotos;

			// if > 10 photos, need to ouput new page of nubs & prev/next links
			if(numPhotos > 10 && (currentPhoto < startingNub || currentPhoto > endingNub)) {
				nubPageIncrement = 0;
				outputNubs();
			}

			// load the photo
			loadPicture(currentPhoto);
		}

		function initAlbum() {
			outputNubs();
			loadPicture(currentPhoto);
		}

		function select_album(selected_album) {
			document.getElementById("albums_step1").style.display = "none";
			document.getElementById("albums_step2").style.display = "block";
			currentAlbum = selected_album;
			numPhotos = galleryInfo[currentAlbum]["num_pics"];
			currentPhoto = 1;
			currentPage = 1;
			initAlbum();
		}

		function show_all_albums() {
			document.getElementById("albums_step2").style.display = "none";
			document.getElementById("albums_step1").style.display = "block";
		}