function getQueryParameter(name)
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}

function addEvent(elm, evType, fn, useCapture) {
    if (elm.addEventListener) {
        elm.addEventListener(evType, fn, useCapture);
        return true;
    }
    else if (elm.attachEvent) {
        var r = elm.attachEvent('on' + evType, fn);
        return r;
    }
    else {
        elm['on' + evType] = fn;
    }
}

function findEventSource(e) {
    var source = window.event ? window.event.srcElement : e ? e.target : null;
    return source;
}

function loadFullSize(e) {
    var thumbnail = findEventSource(e);
    
    //display full size image
    var fullSizeImageURL = thumbnail.src.replace(/Thumbnails/i, 'FullSize');
    var fullSizeImage = document.getElementById('fullSize');
    if (fullSizeImage) fullSizeImage.src = fullSizeImageURL;
    
    displayPaintingDetails(thumbnail);
}

function displayPaintingDetails(thumbnail) {
    //display painting details
    var paintingDetails = document.getElementById('paintingDetails');
    var paintingDetailsList;
    var paintingDetailsContainer = thumbnail.nextSibling;
    while ( paintingDetailsContainer.className != 'paintingDetails') {
        paintingDetailsContainer = paintingDetailsContainer.nextSibling;
    }
    //get list of spans including painting details
    paintingDetailsList = paintingDetailsContainer.getElementsByTagName('span');
    paintingDetails.innerHTML = '<span><strong>' + paintingDetailsList[0].innerHTML + '</strong></span>';
    for ( i = 1; i < paintingDetailsList.length; i++ ) {
        paintingDetails.innerHTML += '<span>|</span>' + '<span>' + paintingDetailsList[i].innerHTML + '</span>';
    }
}

function init() {
    if (!document.getElementById) return;
    var idName;
    //get gallery name
    var galleryName = getQueryParameter('name');
    if (galleryName == "") {
        //get first gallery
        var galleryContainer = document.getElementById('leftNav').getElementsByTagName('ul');
        var firstGallery = galleryContainer[0].getElementsByTagName('li');
        idName = firstGallery[0].id;
    }
    else {
        idName = "galNav" + galleryName;
    }
    
    // disable active gallery link    
    var activeLink = document.getElementById(idName);
    if (activeLink) activeLink.className = "selected";

    //get thumbnail list
    var thumbnailContainer = document.getElementById('galleryThumbs');
    
    if(thumbnailContainer) {
        //get first thumbnail
        var firstThumbnail = thumbnailContainer.getElementsByTagName('img')[0];
        var fullSizeImageURL = firstThumbnail.src.replace(/Thumbnails/i, 'FullSize');
        //display full size image
        var fullSizeImage = document.getElementById('fullSize');
        if (fullSizeImage) fullSizeImage.src = fullSizeImageURL;
        //display painting details     
        displayPaintingDetails(firstThumbnail);
    }
    
    //add onlick to thumbs to display full size images
    if (!thumbnailContainer) return;
    var allThumbnails = thumbnailContainer.getElementsByTagName('img');
    for ( var i = 0; i < allThumbnails.length; i++ ) {
        addEvent(allThumbnails[i], 'click', loadFullSize, false);
    }    
}

addEvent(window, 'load', init, false);