// gallery.js
//
// Copyright © 2007 DL10 Design Ltd. All Rights Reserved.
//
// 18 March 2007

// Gallery Classes

var theGallery = null;

var Gallery = new Class.create();
var GalleryDefaults = new Class.create();

GalleryDefaults.prototype = {
	
	numImagesPerPage: null,
	perRow: null,
	numImages: null,
	wrapPages: null,
	
	initialize: function(numImages, numImagesPerPage, wrapPages, perRow) {
		
		this.numImages = numImages;
		this.numImagesPerPage = numImagesPerPage;
		this.wrapPages = wrapPages;
		this.perRow = perRow;
		
		this.numPages = ( Math.floor(this.numImages/this.numImagesPerPage) + ( (this.numImages % this.numImagesPerPage) > 0 ? 1 : 0 ) );
	
		if ( this.numPages == 0 ) this.numPages = 1;
		
	},
	
	getNumImages: function() {
		
		return this.numImages;
		
	},
	
	getNumImagesPerPage: function() {
		
		return this.numImagesPerPage;
		
	},
	
	getWrapPages: function() {
		
		return this.wrapPages;
		
	},
	
	getPerRow: function() {
		
		return this.perRow;
		
	}
	
}
Gallery.prototype = {
	
	galleryDefaults: null,
	currentPage: 1,
	numImagesPerPage: null,
	perRow: null,
	numImages: null,
	wrapPages: null,
	imageData: null,
	
	blankURL: null,
	
	prevOnSrc: null,
	prevOffSrc: null,

	nextOnSrc: null,
	nextOffSrc: null,
	
	numPages: null,
	
	initialize: function(numImages, numImagesPerPage, wrapPages, perRow) {
		
		galleryDefaults = new GalleryDefaults(numImages, numImagesPerPage, wrapPages, perRow);
		
		this.imageData = pImageData;
		
		this.resetGallery();
	
		replaceOffRegExp = /_off/;
		
		this.prevOffSrc = $("galNavPrev").src;
		this.prevOnSrc = this.prevOffSrc.replace( replaceOffRegExp, "" );
	
		this.nextOffSrc = $("galNavNext").src;
		this.nextOnSrc = this.nextOffSrc.replace( replaceOffRegExp, "" );
		
		this.blankURL = 'gifs/thumbnail_blank.gif';
		
	},
	
	resetGallery: function() {
				
		this.numImages = galleryDefaults.getNumImages();
		this.numImagesPerPage = galleryDefaults.getNumImagesPerPage();
		this.wrapPages = galleryDefaults.getWrapPages();
		this.perRow = galleryDefaults.getPerRow();
		
		this.numPages = ( Math.floor(this.numImages/this.numImagesPerPage) + ( (this.numImages % this.numImagesPerPage) > 0 ? 1 : 0 ) );
		if ( this.numPages == 0 ) this.numPages = 1;
		
		this.imageData = pImageData;
		this.currentPage = 1;
		
	},
	
	drawGallery: function() {
		
		// counter
		var i = 0;
		var row = 1;
		var col = 1;
		var path = "";
		var display = true;
		var imageToChange = "";
		var imageToShow = "";

		// update navigation
		
		if ( this.currentPage == 1 ) {
	
			$('galNavPrev').src = this.prevOffSrc;
			$('galNavPrev').className = 'not_clickable';
			$('galNavPrev').onclick = new Function( "evt", "" );
		
		} else if ( $('galNavPrev').src == this.prevOffSrc ) {
		
			$('galNavPrev').src = this.prevOnSrc;
			$('galNavPrev').className = 'clickable';
			$('galNavPrev').onclick = new Function( "evt", "theGallery.previousGalPage();" );
		
		}
		
		if ( this.currentPage == this.numPages ) {
	
			$('galNavNext').src = this.nextOffSrc;
			$('galNavNext').className = 'not_clickable';
			$('galNavNext').onclick = new Function( "evt", "" );
		
		} else if ( $('galNavNext').src == this.nextOffSrc ) {
		
			$('galNavNext').src = this.nextOnSrc;
			$('galNavNext').className = 'clickable';
			$('galNavNext').onclick = new Function( "evt", "theGallery.nextGalPage();" );
		
		}

		// start displaying
		for(i = 0; i < this.numImagesPerPage; i++)
		{
			
			if(((( this.currentPage - 1 ) * this.numImagesPerPage ) + i ) < this.numImages ) {
	
				imageIndex = ( this.currentPage - 1 ) * this.numImagesPerPage + i;
				
				labelURL = this.imageData[ imageIndex ];
				path = "gallery/thumbnail/" + labelURL;
				display = true;
				
			} else {
				
				path = "gifs/thumbnail_blank.gif";
				display = false;
			
			}
			
			imageToChange = "row" + row + "" + col;
			imageToShow = "image" + row + "" + col;
				
			if ( display ) {
			
				$(imageToChange).src = path;
				$(imageToChange).onclick = new Function( "evt", "showPreview( " + imageIndex + ");" );
				$(imageToChange).className = 'clickable';
				
				$(imageToShow).style.visibility = 'visible';
			
			} else {
			
				$(imageToChange).src = "gifs/thumbnail_blank.gif";
				$(imageToChange).onclick = new Function( "evt", "" );
				$(imageToChange).className = 'not_clickable';
				
				$(imageToShow).style.visibility = 'hidden';
			
			}
			
			col++;
			
			if(col > this.perRow ) {
				
				col = 1;
				row++;
				
			}
			
		}
	
	},
	
	getPreviewURL: function(index) {
	
		labelURL = this.imageData[ index ];
		path = "gallery/preview/" + labelURL;
		
		return path;
		
	},
	
	getBlankURL: function() {
		
		return this.blankURL;
		
	},
	
	previousGalPage: function() {
		
		var displayGallery = true;
		
		this.currentPage--;
		
		if(this.currentPage < 0) {
			
			if(this.wrapPages) {
				
				this.currentPage = this.numPages;
				
			} else {
				
				this.currentPage = 1;
				displayGallery = false;
				
			}
			
		}
		
		if(displayGallery) {

			this.preloadGalImages();
			this.drawGallery();
			
		}
		
	},
	
	nextGalPage: function() {
		
		var displayGallery = true;
		
		this.currentPage++;
		
		if(this.currentPage > this.numPages) {
			
			if(this.wrapPages) {
				
				this.currentPage = 1;
				
			} else {
				
				this.currentPage = this.numPages;
				displayGallery = false;
				
			}
			
		}
		
		if(displayGallery) {

			this.preloadGalImages();
			this.drawGallery();
			
		}
		
	},
	
	preloadGalImages: function() {
		
		// counter
		var i = 0;

		// create object
		var imageObj = new Image();
		
		// create labelURL array
		var labelURL = new Array();

		// start preloading
		for(i = 0; i < this.numImagesPerPage; i++) 
		{
			
			if(((( this.currentPage - 1 ) * this.numImagesPerPage ) + i ) < this.numImagesPerPage ) {
	
				imageIndex = ( this.currentPage - 1 ) * this.numImagesPerPage + i;
				
				labelURL = this.imageData[ imageIndex ];
				imageObj.src = "gallery/thumbnail/" + labelURL;
				
			}
			
			
		}
		 
	}
	
}


// Gallery Functions

var currentIndex = 0;
var previewImage = null;
var currentOrientation = "land";

function initGallery() {
	
	theGallery = new Gallery( pNumImages, pNumPerPage, pWrapPages, pPerRow );
	theGallery.drawGallery();
	
}
function showPreview( index ) {
	
	// Show Gallery Preview
	
	currentIndex = index;
	
	$( currentOrientation + 'Preview' ).hide();
	$( currentOrientation + 'Loader' ).show();
	$( currentOrientation + 'ImagePop' ).style.visibility = 'visible';
	
	loadHiResImage();
	
}
function hidePreview()
{

	// Hide Gallery Preview
	
	$( currentOrientation + 'ImagePop' ).style.visibility = 'hidden';
	$( currentOrientation + 'Preview' ).hide();
	$( currentOrientation + 'Loader' ).show();

}
function loadHiResImage()
{

	previewImage = new Image();
	
	previewImage.onload = function()
	{
		displayPreview();
	}
   	previewImage.onerror = function()
	{
		hidePreview();
	}
   	previewImage.onabort = function()
	{
		hidePreview();
	}
   	
   	previewImage.src = theGallery.getPreviewURL( currentIndex );

}
function displayPreview()
{

	var orientation = currentOrientation;
	
	if ( previewImage.width > previewImage.height ) {
		
		orientation = "land";
		
	} else {
		
		orientation = "port";
		
	}
	
	if ( currentOrientation != orientation ) {
		
		hidePreview();
		
		$( orientation + 'ImagePop' ).style.visibility = 'visible';
		
	}
	
	currentOrientation = orientation;
	
	changeCSSImageTo( document.getElementById( currentOrientation + 'Preview' ), previewImage.src );
	$( currentOrientation + 'Loader' ).hide();
	$( currentOrientation + 'Preview' ).show();

}