var imagesPerPage = 6;      // Maximum number of images displayed per page.
    var imagesPerRow = 3;       // Number of images per row.

    var selected = null;   // The index of the currently displayed image.
    var start = null;      // The initial image displayed.
    var startId = null;     // The GUID of the initial image.
    var page = null;       // The currently displayed index page.
    var totalPages = 0; // The total number of pages.

    var oXml = null;        // The xml defining the catalog.
    var oPictures = null;   // The pictures to display.
    
    var viewer = null;
    
    
    function refreshImage()
    {
        viewer.refreshImage();
    }
		
    function loadImage()
    {	
        var viewerElement = FP_getObjectByID('viewer');
        viewer = new Viewer(viewerElement)
                
        if(document.location.search == null || document.location.search.length == 0)
        {
            // No gallery specified.
            alert('No gallery specified.');
            return;
        }
        
        // Work out which catalogue we're displaying.	
        var args = document.location.search.split("&");
        if(args.length >= 2)
        {
	        startId = args[1];
        }
        
        // Hide the viewer
        viewer.visible(false);

        if(args.length >= 1)
        {
            // Load the catalogue.
            loadCatalogue(args[0].substr(1));
        }
    }
    
	function loadCatalogue(fileName)
	{
		catalogue = fileName;
		fileName = "Galleries/" + fileName + ".xml";
		
		log("Getting catalog " + fileName, 1);
	    var oRequest = createRequest();
	    oRequest.open("GET", fileName, false);
	    oRequest.send('');
	    log("GET catalog status: " + oRequest.status.toString(), 1);
	    if(oRequest.status == 200)
	    {
	        oXml = oRequest.responseXML;
	        catalogLoaded();    
	    }
	}
	
	function catalogLoaded()
	{
	    // Set the catalog name
	    var eCatalog = selectSingleNode(oXml, '/Catalog');
	    var sTitle = eCatalog.getAttribute('title');
	    FP_getObjectByID('contentTitle').innerHTML = sTitle;
	
	    oPictures = selectNodes(oXml, '/Catalog/Picture');
	    log("Found total of " + oPictures.length.toString() + " pictures.", 0);

        // Work out paging
        totalPages = Math.ceil(oPictures.length / imagesPerPage);

        // Load the index
        showPage(0);
        
        // Show the index.  
        if(startId != null)
        {
            log("startId = " + startId, 1);
            var imgNode = selectSingleNode(oXml, '/Catalog/Picture[@id="' + startId + '"]');
            if(imgNode != null)
            {
                start = new Number(imgNode.getAttribute('index'));
                showImage(start);
            }
        }
	}
	
	// Shows the image at a given index.
	function showImage(imageIndex)
	{
	    if(imageIndex == -1)
	    {
	        imageIndex = oPictures.length - 1;
	    }
	    log("Displaying image for index " + imageIndex.toString(), 0);
	    
	    viewer.visible(true);
	    if((imageIndex < oPictures.length) && (imageIndex != selected))
	    {
	        viewer.showImage(oPictures, imageIndex);
	        selected = imageIndex;
	    }
	}
	
	// Scrolls the image to the next image.
	function scrollImage()
	{
	    if(selected + 1 < oPictures.length)
	    {
	        moveSelected(1);
	    } else {
	        viewer.visible(false);
	    }
	}
	
	// Moves the selected image by the offset.
	function moveSelected(offset)
	{
	    var nextImage = selected + offset;
	    if(nextImage < 0)
	    {
	        nextImage = 0;
	    } else if (nextImage >= oPictures.length) {
	        nextImage = oPictures.length - 1;
	    }
	 
	    log('moving selected image by ' + offset.toString() + ' from ' + selected.toString() + ' to ' + nextImage.toString(), 0);
	    showImage(nextImage);
	}
	
	// Scrolls by a number of pages.
	function movePage(offset)
	{
	    var nextPage = page + offset;
	    if(nextPage < 0)
	    {
	        nextPage = 0;
	    } else if (nextPage >= totalPages) {
	        nextPage = totalPages - 1;
	    }
	    
	    showPage(nextPage);
	}
		
	// Displays the given index page.
	function showPage(pageIndex)
	{   
	    if(pageIndex < 0)
	    {
	        pageIndex = totalPages - 1;
	    }
	
        page = pageIndex;
	    var startIndex = page * imagesPerPage;
	    var endIndex = startIndex + imagesPerPage;
	    if (endIndex >= oPictures.length) endIndex = oPictures.length;
	    log("Displaying index for images " + startIndex.toString() + " to " + endIndex.toString(), 0);
	    	    
	    var indexTable = FP_getObjectByID("indexTable", null);
	    if(indexTable == null)
	    {
	        indexTable = document.createElement("table");
	        indexTable.id = "indexTable";
	    } else {
	        indexBody = indexTable.firstChild;
	    }
	    
	    // Empty the table of old images.
	    if(indexTable.firstChild != null)
	    {
	        indexTable.removeChild(indexTable.firstChild);
	    }
        var indexBody = document.createElement("tbody");
        indexTable.appendChild(indexBody);
	    
        var colIndex = 0;
        var row = null;
	    for(i = startIndex; i < endIndex; i++)
	    {
	        log("Displaying thumbnail for image " + i.toString(), 0);
	        if(colIndex == 0)
	        {
	            // Create a new row
	            row = document.createElement("tr");
	            indexBody.appendChild(row);
	        }
	        
	        var oPicture = oPictures[i];
	        var oImage = selectSingleNode(oPicture, "Image[@type='GalleryThumb']");
	        if(!oImage)
	        {
	            log('Image ' + i + ' has no gallery thumbnail', 3);
	            oImage = oPicture.childNodes[0];
	        }
	        
	        // Work out the correct size for the thumbnail.
	        var width = oImage.getAttribute('width');
	        var height = oImage.getAttribute('height');

            // Create the img element.
	        var image = document.createElement("img");	        	        
	        image.style.width = width.toString() + "px";
	        image.style.height = height.toString() + "px";
	        image.src = oImage.getAttribute('src');
	        image.title = oPicture.getAttribute('description');
	        
	        // Create the link
	        var link = document.createElement("a");
	        link.href = "javascript:showImage(" + i.toString() + ");";
	        link.appendChild(image);
	        
	        // Create the table cell.
	        var cell = document.createElement("td")
	        cell.appendChild(link);
	        row.appendChild(cell);
	        	        
	        colIndex += 1;
	        if(colIndex >= imagesPerRow)
	        {
	            colIndex = 0;
	        }
	    }
	    
	    // Add the index table to the page.
	    FP_getObjectByID("index").appendChild(indexTable)
	    	    	    
	    // Update the page counter
	    var pos = FP_getObjectByID("pageCounter", null);
		pos.firstChild.nodeValue = (page + 1).toString() + "/" + totalPages.toString();
	}
	
	window.onload = loadImage;