var category = "";
var photos = new Array();  /* filtered list of photos */
var photoIndex = 0;        /* current index into photos array */
var showTimerID = 0;
var showInterval = 5000;   /* interval between photos in milliseconds */
var iterations = 0;
var maxIterations = 1000;
var slideShow = "off";     /* "off" or "on" */


if (allPhotos != null)
{
    allPhotos.sort();
}

function addPhotos()
{
    var leftcolumn = document.getElementById("leftcolumn");
    // remove current children
    while (leftcolumn.hasChildNodes())
    {
	leftcolumn.removeChild(leftcolumn.firstChild);
    }
    var firstphotosrc = "";
    var firstphotocaption = "";
    photos = new Array();
    var p = 0;
    for (var i=0, len = allPhotos.length; i < len; i++)
    {
	var picCat = allPhotos[i].split("/")[1];
	if ((category == "") || (category == picCat))
	{
	    var newImg = document.createElement("img");
	    newImg.style.width = "80px";
	    newImg.style.height = "80px";
	    newImg.style.cursor = "crosshair";
	    if (firstphotosrc == "") {
		firstphotosrc = allPhotos[i];
		var parts = allPhotos[i].split("/");
		firstphotocaption = parts[parts.length - 1].substr(0, parts[parts.length - 1].length - 4); // - ".jpg"	
	    }
	    photos[p++] = allPhotos[i];
	    newImg.src = allPhotos[i].replace(".jpg", "_sm.jpg");
	    newImg.style.marginRight = "2px";

	    if (newImg.addEventListener) {
		newImg.addEventListener("mouseover", updatePicRollover, false); 
		newImg.addEventListener("mouseout", updatePicSmall, false); 
	    } else if (newImg.attachEvent) { // IE
		newImg.attachEvent("onmouseover", updatePicRolloverIE);
		newImg.attachEvent("onmouseout", updatePicSmallIE);
	    } else {
		newImg.onmouseover = function() { updatePic(this, 'ro'); };
		newImg.onmouseout = function() { updatePic(this, 'sm'); };
	    }

	    
	    leftcolumn.appendChild(newImg);
	}
    }

    // update photo with first photo in category
    var photo = document.getElementById("photo");    
    photo.src = firstphotosrc;
    var caption = document.getElementById("caption");
    caption.innerHTML = toNiceString(firstphotocaption);
}

function updatePicRolloverIE(evt)
{
    updatePic(evt.srcElement, "ro");
    stopSlideShow();
}
function updatePicSmallIE(evt)
{
    updatePic(evt.srcElement, "sm");
}


function updatePicRollover()
{
    updatePic(this, "ro");
    stopSlideShow();
}
function updatePicSmall()
{
    updatePic(this, "sm");
}


function updatePic(obj, appendage)
{
    var caption = document.getElementById("caption");
    var parts = obj.src.split("/");
    var imagename = parts[parts.length - 1].substr(0, parts[parts.length - 1].length - 7);  // - "_sm.jpg"
    caption.innerHTML = toNiceString(imagename);
    var photo = document.getElementById("photo");    
    if (appendage == "ro") {
	obj.src = obj.src.replace("_sm", "_ro");
	photo.src = obj.src.replace("_ro","");
    } else  if (appendage == "sm") {
	obj.src = obj.src.replace("_ro", "_sm");
	photo.src = obj.src.replace("_sm","");
    }
}



function setCategory(newCategory)
{
    category = newCategory;
    photoIndex = 0;
    iterations = 0;
    createSubNav();
    addPhotos();
    updateShowTimer();
}


function createSubNav()
{
    var subnav = document.getElementById("subnav");
    if (subnav != null) 
    {
	var selectedCategory = -1;
	var str = "";
	categories = categories.sort();
	str = "<ul>";
	for (var i = 0; i < categories.length; i++)
	{
	    str += "<li><a ";
	    // make selected category darker color (XXX: could set css class instead)
	    if ((category != "") && (category == categories[i]))
	    {
		str += "style=\"color: red; cursor: pointer;\" ";
		selectedCategory = i;
	    } else {
		str += "style=\"cursor: pointer;\" ";
	    }
	    str += "onclick=\"setCategory('" + categories[i] + "');\">" + toNiceString(categories[i]) + "</a></li>";
	}
	subnav.innerHTML = str;
    }
}

function startSlideShow()
{
    var slideshowAnchor = document.getElementById("slideshow");
    slideshowAnchor.innerHTML = "on";
    slideshowAnchor.href = "javascript:stopSlideShow();";
    slideShow = "on";
    iterations = 0;
    showTimerID = setTimeout("updateShowTimer()", showInterval);
}

function stopSlideShow()
{
    var slideshowAnchor = document.getElementById("slideshow");
    slideshowAnchor.innerHTML = "off";
    slideshowAnchor.href = "javascript:startSlideShow();";
    slideShow = "off";
    if (showTimerID) {
	clearTimeout(showTimerID);
	showTimerID = 0;
    }
}


function updateShowTimer()
{
    if (showTimerID) {
	clearTimeout(showTimerID);
	showTimerID = 0;
    }
    iterations++;

    if ((iterations > maxIterations) || (slideShow == "off")) {
	return;
    }
    
    photoIndex = Math.floor(Math.random()*photos.length);

    var photo = document.getElementById("photo");
    if (photo != null) {
	photo.src = photos[photoIndex];
    }

    var caption = document.getElementById("caption");
    if (caption != null) {
	if ((photos != null) && (photos.length > 0))
	{
	    var parts = photos[photoIndex].split("/");
  	    caption.innerHTML = toNiceString(parts[parts.length - 1].substr(0, parts[parts.length - 1].length - 4));
	}
    }
    
    showTimerID = setTimeout("updateShowTimer()", showInterval);
}


/*
 * Returns string in nice format for displaying.
 * Replaces underscores with spaces and removes extension (e.g. .jpg, ...).
 */
function toNiceString(str)
{
    return (str.replace(/_/g," ").replace(/\.\S*$/,""));
}


/* stop slide show */
function stopShowTimer()
{
   if (showTimerID) {
      clearTimeout(showTimerID);
      showTimerID = 0;
   }
}

var imgArray = new Array();
function preloadPhotos()
{
    for (i=0; i<allPhotos.length; i++) {
        imgArray[i] = new Image(); 
        imgArray[i].src= photos[i];
    }
}