var aPhotos = new Array();
var ndeOpenImage = null;
var intPhotosPerRow = 5;

addEvtListener(window,"load", "loadGallery");


function addGalleryPhoto(strImageSrc, strImageName, strImageCaption)
{
    var aPhoto = new Array();
    aPhoto[0] = strImageSrc;
    aPhoto[1] = strImageName;
    aPhoto[2] = strImageCaption;
    return aPhotos.push(aPhoto);
}

function loadGallery(event)
{
    var ndeScreen = document.createElement("div");
    ndeScreen.id = "screen";
    document.body.appendChild(ndeScreen);

    addEvtListener(ndeScreen,"click","closeGalleryImage");

    var ndeGallery = document.getElementById("photo_gallery");
    var ndeTable = document.createElement("table");
    var ndeTableBody = document.createElement("tbody");
    var ndeRow = null;

    var ndePreviousImage = null;

    for(var intIndex = 0; intIndex < aPhotos.length; intIndex++)
    {
        if(intIndex % intPhotosPerRow == 0)
        {
            if(ndeRow != null)
            {
                ndeTableBody.appendChild(ndeRow);
            }
            ndeRow = document.createElement("tr");
        }

        var ndeCell = document.createElement("td");
        var ndeImg = document.createElement("img");
        var ndeName = document.createElement("span");

        ndeImg.id = "image_"+ intIndex;
        ndeImg.setAttribute("src", "/images/photo_gallery/"+ aPhotos[intIndex][0]);
        ndeImg.setAttribute("class", "image_tumbnail");
        ndeImg.setAttribute("galleryName", aPhotos[intIndex][1]);
        ndeImg.setAttribute("galleryCaption", aPhotos[intIndex][2]);
        //addEvtListener(ndeImg,"click","openGalleryImage");
        ndeImg.setAttribute("galleryPrevious", "");
        ndeImg.setAttribute("galleryNext", "");

        if(ndePreviousImage != null)
        {
            ndeImg.setAttribute("galleryPrevious", ndePreviousImage.id);
            ndePreviousImage.setAttribute("galleryNext", ndeImg.id);
        }

        ndeName.innerHTML = aPhotos[intIndex][1];
        ndeName.setAttribute("class", "image_name");

        ndeCell.appendChild(ndeImg);
        ndeCell.appendChild(document.createElement("br"));
        ndeCell.appendChild(ndeName)
        ndeRow.appendChild(ndeCell);

        ndePreviousImage = ndeImg;
    }

    if(ndeRow != null)
    {
        ndeTableBody.appendChild(ndeRow);
    }

    ndeTable.appendChild(ndeTableBody);
    ndeGallery.appendChild(ndeTable);

    if(document.all)
    {
        ndeGallery.innerHTML = ndeGallery.innerHTML; //IE Hack. :(
        //kpm 2009/01/19 - this is still needed because IE is not properly rendering the CSS of the appended elements without it. :(
    }
    //kpm 2009/01/20 - Oh, and by the way, this BREAKS FF!! :(:(:(

    //Yet another horrible IE hack to deal with its sucky registering but ignoring of event listeners
    for(var intIndex = 0; intIndex < aPhotos.length; intIndex++)
    {
        var ndeImg = document.getElementById("image_"+ intIndex);
        addEvtListener(ndeImg,"click","openGalleryImage");
    }

    return true;
}

function openGalleryImage(event)
{
    if(ndeOpenImage != null)
    {
        closeGalleryImage();
    }

    var ndeFrame = document.createElement("div");
    var ndeImg = document.createElement("img");
    var ndeCaption = document.createElement("div");
    var ndeClose = document.createElement("div");
    var ndeCloseClear = document.createElement("div");
    var ndeNavContainer = document.createElement("div");
    var ndeNext = document.createElement("div");
    var ndePrevious = document.createElement("div");
    var ndeImageClear = document.createElement("div");

    var targetElement = null;

    if(event.currentTarget)
    {
        targetElement = event.currentTarget;
    }
    else
    {
        targetElement = event.srcElement;
    }

    var ndeScreen = document.getElementById("screen");
    ndeScreen.style.visibility = "visible";
    ndeScreen.style.display = "block";
    ndeScreen.style.height = document.body.clientHeight.toString() +"px";

    ndeFrame.id ="image_frame";

    ndeImg.id = "image";
    ndeImg.setAttribute("src", targetElement.getAttribute("src"));

    ndeClose.id = "close";
    ndeClose.innerHTML = "[X] Close";
    addEvtListener(ndeClose,"click","closeGalleryImage");

    ndeCaption.id = "caption"
    ndeCaption.innerHTML = targetElement.getAttribute("galleryCaption");

    ndeCloseClear.setAttribute("class", "clear");

    ndeImageClear.setAttribute("class", "clear");

    ndeNavContainer.id = "navigation";

    ndePrevious.id = "previous";
    ndePrevious.innerHTML = "<< Previous";
    ndePrevious.setAttribute("galleryImage", targetElement.getAttribute("galleryPrevious"));
    addEvtListener(ndePrevious,"click","changeGalleryImage");

    ndeNext.id = "next";
    ndeNext.innerHTML = "Next >>";
    ndeNext.setAttribute("galleryImage", targetElement.getAttribute("galleryNext"));
    addEvtListener(ndeNext,"click","changeGalleryImage");

    if(ndeNext.getAttribute("galleryImage") != "")
    {
        ndeNavContainer.appendChild(ndeNext);
    }

    if(ndePrevious.getAttribute("galleryImage") != "")
    {
        ndeNavContainer.appendChild(ndePrevious);
    }

    ndeFrame.appendChild(ndeClose);
    ndeFrame.appendChild(ndeCaption);
    ndeFrame.appendChild(ndeCloseClear);
    ndeFrame.appendChild(ndeImg);
    ndeFrame.appendChild(ndeImageClear);
    ndeFrame.appendChild(ndeNavContainer);


    ndeOpenImage = ndeFrame;

    document.body.appendChild(ndeFrame);

    if(window.innerHeight)
    {
        ndeFrame.style.top = ((window.innerHeight-5)/2)-(ndeFrame.offsetHeight/2) + window.scrollY +"px";
    }
    else
    {
        ndeFrame.style.top = ((document.documentElement.clientHeight-5)/2)-(ndeFrame.offsetHeight/2) + document.documentElement.scrollTop +"px";
    }

    ndeFrame.style.left = (document.body.offsetWidth/2) - (ndeFrame.offsetWidth/2) +"px";

    return true;
}

function closeGalleryImage()
{
    if(ndeOpenImage != null)
    {
        document.body.removeChild(ndeOpenImage);

        var ndeScreen = document.getElementById("screen");
        ndeScreen.style.visibility = "hidden";
        ndeScreen.style.display = "none";

        ndeOpenImage = null;
        return true;
    }
    else
    {
        return false;
    }
}

function changeGalleryImage(event)
{
    var targetElement = null;

    if(event.currentTarget)
    {
        targetElement = event.currentTarget;
    }
    else
    {
        targetElement = event.srcElement;
    }

    if(ndeOpenImage != null && targetElement.getAttribute("galleryImage") != "")
    {
        var ndeGalleryImage = document.getElementById(targetElement.getAttribute("galleryImage"));

        if(ndeGalleryImage.dispatchEvent)
        {
            var eventClick = document.createEvent("MouseEvents");
            eventClick.initMouseEvent("click",true,true,window,0, 0, 0, 0, 0,false,false,false,false,0,null);
            
            ndeGalleryImage.dispatchEvent(eventClick);
        }
        else
        {
            ndeGalleryImage.fireEvent("onclick");
        }

        return true;
    }
    else
    {
        return false;
    }
}