﻿// Setup - to use dynamical generate gallery:
// 1. add script in to the web page's <header> section:
//    <script type="text/javascript" src="galleryFiles.js"> // this file defines the galleries
//    <script type="text/javascript" src="gallery.js">      // this file contains the javascript code
// 2. add style sheet to the web page's <header> section:
//    <link rel="stylesheet"  type="text/css" href="shan5.css" />   // this file contains the css for the gallery
// 3. add to the <body> section to initialize the gallery
//    Syntax: new photogallery(imagearray, cols, rows, opt_[title, paginatetext, twidth, theight])
//
// Setup - to use popup on existing image table:
// 1. add onload handler in <body> tag:
//    <body onload="addGalleryPopupHandler('galleryID'") >

// staticGallery
function staticGallery(tableName, pageSize, pageCount)
{
    var navText=(typeof paginatetext=="object")? paginatetext : ["Browse Gallery:", ""]; 
    this.pageCount = pageCount; 
	this.pageSize = pageSize;
	this.navId = 'paginate-'+tableName;
	
	this.tableName = tableName;
	
    document.write('<div class="photonavlinks" id="'+this.navId+'"></div>'); //Generate Paginate Div

	var tableDiv=document.getElementById(tableName);
	var navDiv=document.getElementById(this.navId);

	this.showPage(tableDiv, 0);
	this.createNav(tableDiv, navDiv, navText);
	tableDiv.onclick =
	    function(e) { return staticGallery.defaultGalleryClick(e, this) } //attach default custom event handler action to "onclick" event
        //function(e) { return staticGallery.progressiveGalleryClick(e, this) } 

	return tableDiv;
}

staticGallery.prototype.showPage = function(tableDiv, pageNumber) 
{
    var rowstartindex = pageNumber * this.pageSize;
    var rowendindex = rowstartindex + this.pageSize;
    var tablerows = tableDiv.getElementsByTagName("tr");

    for (var i = 0; i < tablerows.length; i++) {
        if (i >= rowstartindex && i < rowendindex) {
            tablerows[i].style.display = 'block';
        }
        else {
            tablerows[i].style.display = 'none';
        }
    }
}

staticGallery.prototype.createNav = function(tableDiv, navDiv, navText)
{
    var instanceOfGallery = this;
    var navHTML = '';


    for (var i = 0; i < this.pageCount; i++)
    {
        navHTML += '<a href="#navigate" rel="' + i + '">' + navText[1] + (i + 1) + '</a> ' //build sequential nav links
    }

    navDiv.innerHTML = '<p>' + navText[0] + ' ' + navHTML + '</p>';
    var navLinks = navDiv.getElementsByTagName("a")
    navLinks[0].className = "current" //Select first link by default
    this.previousPage = navLinks[0] //Set previous clicked on link to current link for future ref

    for (var i = 0; i < navLinks.length; i++)
    {
        //navlinks[i].onclick = photogallery.clickNav;
        navLinks[i].onclick = function()
        {
            instanceOfGallery.previousPage.className = ""; //"Unhighlight" last link clicked on...
            this.className = "current"; //while "highlighting" currently clicked on flatview link (setting its class name to "selected"
            instanceOfGallery.showPage(tableDiv, this.getAttribute("rel"));
            instanceOfGallery.previousPage = this; //Set previous clicked on link to current link for future ref
            return false;
        }
    }
}

staticGallery.clickNav= function(instanceOfGallery)
{
    var instanceOfGallery = this;
    instanceOfGallery.previousPage.className = ""; //"Unhighlight" last link clicked on...
    this.className = "current"; //while "highlighting" currently clicked on flatview link (setting its class name to "selected"
    instanceOfGallery.showPage(tableDiv, this.getAttribute("rel"));
    instanceOfGallery.previousPage = this; //Set previous clicked on link to current link for future ref
    return false;
}

// default gallery onClick handler, can be overriden
staticGallery.defaultGalleryClick=function(e, tableDiv)
{ 
    //function that runs user defined "onselectphoto()" event handler
	var evtobj=e || window.event;
	var clickedobj=evtobj.target || evtobj.srcElement;
	if (clickedobj.tagName=="IMG")
	{
		var linkobj=(clickedobj.parentNode.tagName=="A")? clickedobj.parentNode : null;
		//return tableDiv.defaultImageClick(clickedobj, linkobj);
		return staticGallery.defaultImageClick(clickedobj, linkobj);
	}
}

// default image onClick hander, can be overriden
staticGallery.defaultImageClick = function(img, link)
{
    if (link != null) //if this image is hyperlinked
    {
        window.open("photopopup.htm?image=" + link + "&title=" + img.title, "", "width=800, height=540, resizable=1, location=0");
        return false;
    }
}

// progressive gallery onClick handler, can be overriden
staticGallery.progressiveGalleryClick=function(e, tableDiv)
{ 
    //function that runs user defined "onselectphoto()" event handler
	var evtobj=e || window.event;
	var clickedobj=evtobj.target || evtobj.srcElement;
	if (clickedobj.tagName=="IMG")
	{
		var linkobj=(clickedobj.parentNode.tagName=="A")? clickedobj.parentNode : null;
		return staticGallery.progressiveImageClick (tableDiv.tableName, linkobj);
	}
}

// progressive image onClick hander, can be overriden
staticGallery.progressiveImageClick = function(tableName, link)
{
    if (link != null) //if this image is hyperlinked
    {
        window.open("progressivePopup.htm?image=" + link + "&tableName=" + tableName, "", "width=800, height=540, resizable=1, location=1");
        return false;
    }
}





