// LMA Gallery -->> D.Shannon LMA 2007
// Constants here --- CHANGE AS REQUIRED BY OUTPUT
var colCount = 4;
var rowCount = 2;

var imgCount = 8;
		
var thmbExt = "_a"; // replace with the extension of your choice
var imgExt = ".jpg"; // replace with image extension type

// SET CAPTIONS IF REQUIRED
var captionsOn = true;
var captions = Array(imgCount);
// SET CAPTION VALUES, ALL IMAGES MUST HAVE A CAPTION VALUE;
captions[0] = ".";
captions[1] = ".";
captions[2] = ".";
captions[3] = ".";
captions[4] = ".";
captions[5] = ".";
captions[6] = ".";
captions[7] = ".";
captions[8] = ".";
captions[9] = ".";
captions[10] = ".";
captions[11] = ".";
captions[12] = ".";
captions[13] = ".";
captions[14] = ".";
captions[15] = ".";
captions[16] = ".";
captions[17] = ".";
captions[18] = ".";
captions[19] = ".";
captions[20] = ".";
captions[21] = ".";
captions[22] = ".";
captions[23] = ".";
// FADE IMAGES IN //
var fadeIn = true;
var fadeTime = 700; // length of fade in time, in milliseconds
// ---- DO NOT ALTER CODE BEYOJND THIS POINT --//
var pageOutputCount = (colCount * rowCount);
var pageCount = Math.round((imgCount / pageOutputCount)+0.5);
				
//variables here
var curPage = 1;
var curImg = 1;
var colTrack = 1;
var runYet = false;
		
//nav controllers
var isFirst = true;
var isLast = false;
var parentObject = null;
var imageObject = null;
		
function buildGalleryOutput(parent){
	// detect and correct odd number paging issues    
    fixPaging();
	// build output to gallery
	var startNum = ((this.pageOutputCount * (this.curPage-1)) + 1);
	var finishNum = ((startNum + this.pageOutputCount) - 1); 
	// make sure finishNum is not more than imageCount
	if(finishNum > this.imgCount){
		finishNum = this.imgCount;
	}
	isFirst = false; isLast = false;
	colTrack = 1;
	// instanciate parent table as object
	this.parentObject = document.getElementById(parent).getElementsByTagName('TBODY')[0];
	
	var row = document.createElement("TR");
	
	for(i=startNum; i<=finishNum; i++){
		// set first and last nav possibilities
		if(i==1){ // first page
			isFirst = true;
		} else if(i==imgCount){ // first page
			isLast = true;
		}
		imageCell(i,row);
		if(colTrack == colCount){
			this.parentObject.appendChild(row);
			row = document.createElement("TR");
			row.setAttribute("valign","middle");
			colTrack = 0;
		}
		colTrack++;
	}
	this.parentObject.appendChild(row);
	// build nav
	buildNav();
	document.getElementById("pagingInfo").innerHTML = "Page "+this.curPage+" of "+this.pageCount;
} 
		
function fixPaging(){
	if(!runYet){
		if(this.pageOutputCount % 2 == 0){
			// nothing required
		} else {
			if(imgCount > this.pageOutputCount){
				pageCount++;
			}
		}
		runYet = true;
	}
}
		
function clearGallery(topNode){
	while(topNode.firstChild) { // delete all nodes
	  topNode.removeChild(topNode.firstChild);
	}
}
		
function buildNav(){
	if(isFirst){
		document.getElementById("navFirst").style.display = "none";
		document.getElementById("navPrev").style.display = "none";
	} else {
		document.getElementById("navFirst").style.display = "block";
		document.getElementById("navPrev").style.display = "block";
	}
	if(isLast){
		document.getElementById("navLast").style.display = "none";
		document.getElementById("navNext").style.display = "none";
	} else {
		document.getElementById("navLast").style.display = "block";
		document.getElementById("navNext").style.display = "block";
	}
}
		
function buildImgNav(){
	if(this.curImg == 1){
		document.getElementById("navImgFirst").style.display = "none";
		document.getElementById("navImgPrev").style.display = "none";
	} else {
		document.getElementById("navImgFirst").style.display = "block";
		document.getElementById("navImgPrev").style.display = "block";
	}
	if(this.curImg == this.imgCount){
		document.getElementById("navImgLast").style.display = "none";
		document.getElementById("navImgNext").style.display = "none";
	} else {
		document.getElementById("navImgLast").style.display = "block";
		document.getElementById("navImgNext").style.display = "block";
	}
}
		
function zoom(id){
	this.curImg = id;
	document.getElementById("pagingInfo").innerHTML = "Image "+this.curImg+" of "+this.imgCount;
	// set caption
	if(this.captionsOn){
		var caption = document.getElementById("caption");
		caption.style.display = "block";
		caption.innerHTML = this.captions[(this.curImg-1)];
	} else {
		document.getElementById("caption").style.display = "none";
	}
	// set visibility
	document.getElementById("galleryPaging").style.display = "none";
	document.getElementById("imagePaging").style.display = "block";
	document.getElementById("galleryHolder").style.display = "none";
	document.getElementById("imageHolder").style.display = "block";
	// remove old image, place new one
	this.imageObject = document.getElementById("galleryImageTable").getElementsByTagName("TBODY")[0];
	clearGallery(this.imageObject);
	loadFullImage(id);
}
		
function toThumbs(){
	document.getElementById("galleryPaging").style.display = "block";
	document.getElementById("imagePaging").style.display = "none";
	document.getElementById("galleryHolder").style.display = "block";
	document.getElementById("imageHolder").style.display = "none";
	// work out current page
	this.curPage = 1;
	if(this.curImg > this.pageOutputCount){
		this.curPage = 2;
		var diff = curImg - this.pageOutputCount;
		while(diff > this.pageOutputCount){
			diff = calcNewPage(diff);
			this.curPage++;
		}
	}
	clearGallery(this.parentObject);
	buildGalleryOutput("galleryHolderTable");
}
		
function calcNewPage(diff){
	diff = diff - this.pageOutputCount;
	return diff;
}
		
function loadFullImage(id){
	// track image paging
	this.curImg = id;
	buildImgNav();
	var row = document.createElement("TR");
	row.setAttribute("valign","middle");
	var cell = document.createElement("TD");
	cell.setAttribute("align","center");
	cell.setAttribute("valign","middle");
	cell.innerHTML = "<img style=\"text-align:center; valign:middle;\" src=\"siteboard-gallery/"+id+this.imgExt+"\" id=\"img_"+id+"\" />";
	row.appendChild(cell);
	this.imageObject.appendChild(row);
	if(this.fadeIn){
		opacity('img_'+id, 0, 100, this.fadeTime);
	}
}

function navChange(direction){
	clearGallery(this.parentObject);
	switch(direction){
		case 1: this.curPage=1; break;
		case 2: this.curPage--; break;
		case 3: this.curPage++; break;
		case 4: this.curPage=this.pageCount; break;
		case 5: this.curImg=1; break;
		case 6: this.curImg--; break;
		case 7: this.curImg++; break;
		case 8: this.curImg=this.imgCount; break;
	}
	if(direction <=4){
		buildGalleryOutput("galleryHolderTable");
	} else {
		zoom(this.curImg);
	}
}
		
function check(){
	alert("mouseover");
}
	
function imageCell(id,row){
	var cell = document.createElement("TD");
	cell.setAttribute("align","center");
	cell.setAttribute("valign","middle");
	cell.className = "imgCellOff";
	if(captionsOn){
		cell.innerHTML = "<a href=\"javascript:zoom("+id+");\"><img style=\"text-align:center; valign:middle;\" src=\"siteboard-gallery/"+id+this.thmbExt+this.imgExt+"\" id=\"img_"+id+"\" /></a>";
	} else {
		cell.innerHTML = "<a href=\"javascript:zoom("+id+");\"><img style=\"text-align:center; valign:middle;\" label=\""+captions[(id-1)]+"\" src=\"siteboard-gallery/"+id+this.thmbExt+this.imgExt+"\" id=\"img_"+id+"\" /></a>";
	}
	if(this.fadeIn){
		opacity('img_'+id, 0, 100, this.fadeTime);
	}
	row.appendChild(cell);
}

function opacity(id, opacStart, opacEnd, millisec) { 
    //speed for each frame 
    var speed = Math.round(millisec / 100); 
    var timer = 0; 

    //determine the direction for the blending, if start and end are the same nothing happens 
    if(opacStart > opacEnd) { 
        for(x = opacStart; x >= opacEnd; x--) { 
            setTimeout("changeOpac(" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } else if(opacStart < opacEnd) { 
        for(x = opacStart; x <= opacEnd; x++) 
            { 
            setTimeout("changeOpac(" + x + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } 
} 

//change the opacity for different browsers 
function changeOpac(opacity, id) { 
    var object = document.getElementById(id).style; 
    object.opacity = (opacity / 100); 
    object.MozOpacity = (opacity / 100); 
    object.KhtmlOpacity = (opacity / 100); 
    object.filter = "alpha(opacity=" + opacity + ")"; 
}