// Variable Declarations
var Gallery = new Array();
var imageIDX=0;
var DEFAULT_IMAGES_PER_ROW = 7;

// default images - this is the code for the icons that appear at the bottom of the image when viewing
var NAV_LEFT = '<img width="16" height="16" src="/images/buttonReversePlay.gif" border="0" title="Prevous Image" />';
var NAV_RIGHT = '<img width="16" height="16" src="/images/buttonPlay.gif" border="0" title="Next Image" />';
var NAV_UP = '<img width="16" height="16" src="/images/buttonUp.gif" border="0" title="Return" />';
var NAV_LEFT_DISABLED = '<img width="16" height="16" src="/images/buttonReversePlayOff.gif" border="0" title="Prevous Image" />';
var NAV_RIGHT_DISABLED = '<img width="16" height="16" src="/images/buttonPlayOff.gif" border="0" title="Next Image" />';
var NAV_UP_DISABLED = "<IMG WIDTH=29 HEIGHT=29 SRC=\"../images/nav-upx.gif\" BORDER=0>";

// hidden image used for image swapping and loading
var image = new Image();

var slideshow_image = Gallery.length-1;
var slideshow_loaded = false;
var slideshow_interval;
var slideshow_duration = 5000;
var slideshow_IE = (navigator.userAgent.indexOf("MSIE")>= 0);
var slideshow_paused = false;

// fade transition variables (used when swapping from one image to the next)
var fadeNextImage = "";
var fadeOpacity = 100;	// start state
var fading = true;
var fadeTimer;

		//
		// Adds a new image into the gallery
		//
		function GalleryAdd( galleryEntry )
		{
			var index = Gallery.length;
			Gallery[index] = galleryEntry;
		}

		function SlideShowPause() {
			slideshow_paused =true;
			SideShowUpdateButtons();
		}

		function SlideShowResume() {
			slideshow_paused = false;
			SideShowUpdateButtons();
		}

		function SideShowUpdateButtons() {
			if( slideshow_paused ) {
				document.getElementById("cmdPlay").src="/images/buttonPlay.gif";
				document.getElementById("cmdPause").src="/images/buttonPauseOff.gif";
			}
			else {
				document.getElementById("cmdPlay").src="/images/buttonPlayOff.gif";
				document.getElementById("cmdPause").src="/images/buttonPause.gif";
			}
		}

		function SlideShowRestart() {
			slideshow_paused = false;
			slideshow_image = Gallery.length-1;
			image.src = Gallery[slideshow_image].Image;
			SlideShowAdvance();
			window.clearInterval( slideshow_interval );
			slideshow_interval = window.setInterval('SlideShowAdvance()',slideshow_duration);
			SideShowUpdateButtons();
		}
		function SlideShowNext() {
			slideshow_paused = false;
			SlideShowAdvance();
			window.clearInterval( slideshow_interval );
			slideshow_interval = window.setInterval('SlideShowAdvance()',slideshow_duration);
			SideShowUpdateButtons();
		}
		function SlideShowPrevious() {
			slideshow_paused = false;
			if(slideshow_image<(Gallery.length-2)) {
				slideshow_image+=2;
				image.src = Gallery[slideshow_image].Image;
				SlideShowAdvance();
				window.clearInterval( slideshow_interval );
				slideshow_interval = window.setInterval('SlideShowAdvance()',slideshow_duration);
			}
			SideShowUpdateButtons();
		}
		function SlideShow()
		{
			document.write('<div align="center">');
			document.write('<img src="/images/buttonRewind.gif" width="16" height="16" onclick="SlideShowRestart()" alt="Restart"/>');
			document.write('&nbsp;&nbsp;');
			document.write('<img src="/images/buttonFastRewind.gif" width="16" height="16" onclick="SlideShowPrevious()" alt="Back"/>');
			document.write('&nbsp;&nbsp;');
			document.write('<img src="/images/buttonPause.gif" id="cmdPause" width="16" height="16" onclick="SlideShowPause()" alt="Pause"/>');
			document.write('&nbsp;&nbsp;');
			document.write('<img src="/images/buttonPlay.gif" id="cmdPlay" width="16" height="16" onclick="SlideShowResume()" alt="Play"/>');
			document.write('&nbsp;&nbsp;');
			document.write('<img src="/images/buttonFastForward.gif" width="16" height="16" onclick="SlideShowNext()" alt="Advance"/>');
			document.write('</div>');

			document.write('<div id="SlideOf" align="center">&nbsp;</div>');
			document.write('<div id="SlideTitle" align="center">&nbsp;</div>');

			document.write('<table width="100%" height="100%">');
			document.write('<tr><td valign="top">');
			document.write('<div class="inpagePicture" align="center">');
			document.write('<img src="/images/GalleryLoading.jpg" id="screenImage" class="picFrame" style="filter:blendTrans(duration=0.5)">');
			document.write('<div class="pictureCaption" id="ImageCaption" align="center">&nbsp;</div><br />');
			document.write('<small><div id="ImageCamera" align="center">&nbsp;</div></small>');
			document.write('<small><div id="ImageDate" align="center">&nbsp;</div></small>');
			document.write('</div></td></tr>');
			document.write('</table>');

			slideshow_image = Gallery.length-1;		// starting image
			fadeTimer = -1							// fade timer off
			
			image.onload = SlideLoaded;				// function to call when an image loads
			slideshow_loaded = false;
			if( slideshow_image >= 0) {
				document.getElementById("ImageCaption").innerHTML = "&nbsp;";
				image.src = Gallery[slideshow_image].Image;
			}
			slideshow_interval = window.setInterval('SlideShowAdvance()',slideshow_duration);
			SideShowUpdateButtons();
		}

		// this function is invoked when the timer has fired.  If the screen image is
		// loaded then the slideshow is advanced
		// this function is invoked when the timer has fired.  If the screen image is
		// loaded then the slideshow is advanced
		function SlideShowAdvance()
		{
			if( slideshow_paused ) return;
				
		    if( slideshow_image < 0 )
			{
				// end of slideshow reached
				window.clearInterval( slideshow_interval );
				window.location = getDocumentAddress();
		 	}
			else if( slideshow_loaded )
			{
		        slideshow_loaded = false;
		        var imageObject = document.getElementById("screenImage");

		        if( slideshow_IE ) {
			        imageObject.filters[0].apply();
					imageObject.filters[0].play();
					imageObject.src = image.src;
					// next image
					--slideshow_image;
					SlideShowStatus();
				}
				else
				{
					fadeNextImage = image.src;
					if( fadeTimer == -1 ) fadeTimer = window.setInterval('SwitchImages()',10);
					--slideshow_image;
				}
				// next image
				if( slideshow_image >= 0)
				{
					image.src = Gallery[slideshow_image].Image;
				}
			}
		}
		
		function SwitchImages()
		{
			var imageObject = document.getElementById("screenImage");
			if( fading )
			{
				fadeOpacity-=10;
				imageObject.style.opacity = fadeOpacity/100;	// use this for non IE
				if( fadeOpacity <= 0 )
				{
					// switch images now
					imageObject.src = fadeNextImage;
					fading = false;
					fadeOpacity = 0;
				}
			}
			else
			{
				fadeOpacity+=10;
				imageObject.style.opacity = fadeOpacity/100;	// use this for non IE
				if( fadeOpacity >= 100 )
				{
					fading = true;
					fadeOpacity=100;
					window.clearInterval(fadeTimer);
					fadeTimer = -1;
					SlideShowStatus();
				}
			}
		}

		function SlideShowStatus() {
		    var imageNo = Gallery.length-slideshow_image-1;
			window.status = "Slide "+imageNo+" of "+Gallery.length;
			document.getElementById("ImageCaption").innerHTML = Gallery[slideshow_image+1].Description;
			document.getElementById("SlideOf").innerHTML = "Slide "+imageNo+" of "+Gallery.length;
			document.getElementById("SlideTitle").innerHTML = "<b>"+Gallery[slideshow_image+1].Title+"</b>";
			if( typeof Gallery[slideshow_image+1].Camera != "undefined") {
				document.getElementById("ImageCamera").innerHTML = "Camera: "+Gallery[slideshow_image+1].Camera;
			} else {
		        document.getElementById("ImageCamera").innerHTML = "&nbsp;";
		 	}

		    if( typeof Gallery[slideshow_image+1].Date != "undefined") {
				document.getElementById("ImageDate").innerHTML = "Date: "+Gallery[slideshow_image+1].Date;
			} else {
		        document.getElementById("ImageDate").innerHTML = "&nbsp;";
		 	}
		}

		// this function is called when the off screen image is loaded
		function SlideLoaded() {
		    slideshow_loaded = true;
			return false;
		}

		// backward compatibility with older browsers and differing variants
		if(document.all && !document.getElementById) {
		 document.getElementById = function(id)  {   return document.all[id];   }
		}

		function addImage(sThumbImage, thumbX, thumbY, sMainImage, imageX, imageY, sTitle, sDescription, szDate, szCamera ) {
		  this.Thumbs = sThumbImage;
		  this.ThumbsX = thumbX;
		  this.ThumbsY = thumbY;
		  this.Image = sMainImage;
		  this.ImageX = imageX;
		  this.ImageY = imageY;
		  this.Title = sTitle;
		  this.Description = sDescription;
		  this.Date = szDate;
		  this.Camera = szCamera;
		  return this;
		}
		
		// returns the x-dimension of the image,if szFilename = "640x480-Main Image.jpg", function returns 640
		function getImageX(szFilename)
		{
			var fileStart = szFilename.lastIndexOf("/");
			var x=szFilename.indexOf("x",fileStart+1);
			if(x>0)
			{
				return parseInt( szFilename.substr(fileStart+1,x-1) );
			}
			else
			{
				return -1;
			}
		}
		
		// returns the y-dimension of the image,if szFilename = "640x480-Main Image.jpg", function returns 480
		function getImageY(szFilename)
		{
			var fileStart = szFilename.lastIndexOf("/");
			var x=szFilename.indexOf("x",fileStart+1);
			var y=szFilename.indexOf("-",x);

			if(x>0 && y>x)
			{
				return parseInt( szFilename.substr(x+1, y-x) );
			}
			else
			{
				return -1;
			}
		}

		
		// adds an image to  the gallert; the filenames should contain the image dimension e.g."640x480-Main Image.jpg"
		function addImageEx(sThumbImage, sMainImage, sTitle, sDescription, szDate, szCamera ) {
		  this.Thumbs = sThumbImage;
		  this.ThumbsX = getImageX(sThumbImage);
		  this.ThumbsY = getImageY(sThumbImage);
		  this.Image = sMainImage;
		  this.ImageX = getImageX(sMainImage);
		  this.ImageY = getImageY(sMainImage);
		  this.Title = sTitle;
		  this.Description = sDescription;
		  this.Date = szDate;
		  this.Camera = szCamera;

		  return this;
		}
		
		//  imageFile is the format  /x/y/z/filename
		//
		function addImageEx2(imageFile, isLandscape, sTitle, sDescription, szDate, szCamera )
		{
			var fileStart = imageFile.lastIndexOf("/")+1;
			var path = imageFile.substr(0,fileStart);
			var filename = imageFile.substr(fileStart);
			var imageThumb = "";
			var imageMain = "";
			
			if(isLandscape)
			{
				imageThumb = path+"96x72-"+filename;
				imageMain = path+"640x480-"+filename;
			}
			else
			{
				imageThumb = path+"72x96-"+filename;
				imageMain = path+"480x640-"+filename;
			}
			
			this.Thumbs = imageThumb;
			this.ThumbsX = getImageX(imageThumb);
			this.ThumbsY = getImageY(imageThumb);
			this.Image = imageMain;
			this.ImageX = getImageX(imageMain);
			this.ImageY = getImageY(imageMain);
			this.Title = sTitle;
			this.Description = sDescription;
			this.Date = szDate;
			this.Camera = szCamera;
			
			return this;
		}
		
		
		//
		// Adds images to the gallery of dimension 1024x768 - thumbnails are assumed to be 96x72
		//
		
		function addImage1024x768(imageFile, isLandscape, sTitle, sDescription, szDate, szCamera )
		{
			var fileStart = imageFile.lastIndexOf("/")+1;
			var path = imageFile.substr(0,fileStart);
			var filename = imageFile.substr(fileStart);
			var imageThumb = "";
			var imageMain = "";
			
			if(isLandscape)
			{
				imageThumb = path+"96x72-"+filename;
				imageMain = path+"1024x768-"+filename;
			}
			else
			{
				imageThumb = path+"72x96-"+filename;
				imageMain = path+"768x1024-"+filename;
			}
			
			this.Thumbs = imageThumb;
			this.ThumbsX = getImageX(imageThumb);
			this.ThumbsY = getImageY(imageThumb);
			this.Image = imageMain;
			this.ImageX = getImageX(imageMain);
			this.ImageY = getImageY(imageMain);
			this.Title = sTitle;
			this.Description = sDescription;
			this.Date = szDate;
			this.Camera = szCamera;
			
			return this;
		}
		
		
		
	
		function getDocumentAddress() {
		  // this function returns the actual address of the document less anything after and including the "?"
		  var idx = window.location.href.indexOf("?")
		  if( idx >=0 )
		  	  return window.location.href.substr(0,idx);
		  else
		  	  return window.location.href;
		}

		function drawThumb(idx)
		{
			document.write('<div style="text-align: center; padding: 4px;">');
			document.write("<a href=\"" + getDocumentAddress() + "?" + idx +"\">");
			document.write('<img src='+Gallery[idx].Thumbs+' class="picFrame" ');
			document.write(" width=\""+Gallery[idx].ThumbsX+"\"");
			document.write(" height=\""+Gallery[idx].ThumbsY+"\"");
			if( Gallery[idx].Description.indexOf("<a href") < 0 )
			{
				document.write(" title=\""+Gallery[idx].Description+"\"");
			}
			document.write("/></a>");
			document.write("<br /><small>"+Gallery[idx].Title+"</small>");
			document.write("</div>");
		}
		
		function drawThumbsIndex()
		{
			// this function renders the ThumbNail preview page
			var idx = 0;
			var col = 0;

			document.write('<p><small>Click a thumbnail below for larger image and description, or click <a href="'+getDocumentAddress()+'?slideshow">Slide Show</a>.</small></p>');
			if(ImagesPerRow==-1)
			{
				var cx = 0;
				var cy = 0;
				
				// calc some image stats
				for( idx=Gallery.length-1; idx>=0; idx-- )
				{
					if(cx<Gallery[idx].ThumbsX) cx = Gallery[idx].ThumbsX;
					if(cy<Gallery[idx].ThumbsY) cy = Gallery[idx].ThumbsY;
				}
				
				// draw as many images as possible
				document.write('<div style="display:inline;">');
				for( idx=Gallery.length-1; idx>=0; idx-- )
				{
					document.write('<div style="float:left; height: '+cy*1.4+'px; width: '+cx*1.4+'px;">');
					drawThumb(idx);
					document.write('</div>');
				}
				document.write('</div>');
				document.write('<hr style="visibility: hidden; clear: both;"/>');
			}
			else
			{
				// draw thumb nails using a grid layout
				document.write('<p align="center"><table border="0" cellpadding="4" width="100%">');
				for( idx=Gallery.length-1; idx>=0; idx-- )
				{
					if(col==0 )
					{
					  document.write("<TR>"); // start of table row?
					}
					document.write('<td valign="top">');
					drawThumb(idx);
					document.write('</td>');
					col++;
					if(col==ImagesPerRow) {
					  document.write("</tr>"); // end of table row?
					  col=0;
					}
				}
				if( col!==0) document.write("</tr>"); // end of table row?
				document.write("</table>");
			}
				
		  document.write("<br /><small>Click on thumbnail for larger image and description.</small></p>");
		  return;
		}

		function InitialiseLightboxGallery() {
			var index = 0;
			var cx = 0;
			var cy = 0;
			
			// give the viewer the option to view all the images as a slide show
			document.write('<p><small>Click a thumbnail below for larger image and description, or click <a href="'+getDocumentAddress()+'?slideshow">Slide Show</a>.</small></p>');
			
			// ensure light-box is now initialised
			document.write('<script type="text/javascript" src="/js/prototype.js"></script>');
			document.write('<script type="text/javascript" src="/js/scriptaculous.js?load=effects,builder"></script>');
			document.write('<script type="text/javascript" src="/js/lightbox.js"></script>');
			
			// find the maximum width and height of the thumbnails
			for( index=Gallery.length-1; index>=0; index-- ) 	{
				if(cx<Gallery[index].ThumbsX) cx = Gallery[index].ThumbsX;
				if(cy<Gallery[index].ThumbsY) cy = Gallery[index].ThumbsY;
			}
			
			document.write('<div style="padding-left: 40px;">');
			for( index=Gallery.length-1; index>=0; index-- ) {
				// emsure un-safe characters are removed from the description
				var description = Gallery[index].Description;
				description = description.replace(/</g, "&lt;");
				description = description.replace(/>/g, "&gt;");
				description = description.replace(/"/g, "'");
				
				document.write('<div style="float:left; height: '+cy*1.15+'px; width: '+cx*1.15+'px;">');
				document.write('<a class="galleryCube" href="'+
					Gallery[index].Image+'" title="'+
					description+'" rel="lightbox[morphfx]"><img class="thumbnail" src="'+
					Gallery[index].Thumbs+'" width="'+
					Gallery[index].ThumbsX+'" height="'+
					Gallery[index].ThumbsY+'" /></a>');
				document.write('</div>');
			}
			document.write('</div>');
		}
		
		
		function GalleryInitialise( imagesPerRow )
		{
			
			
			// allow parameters to be passed in that define how many images make up a row, handle the case where no parameters are passed
			if( imagesPerRow == undefined ) {
				ImagesPerRow = DEFAULT_IMAGES_PER_ROW;
			} else {
				ImagesPerRow = imagesPerRow;
			}
			
			var idx = window.location.href.indexOf("?");
			
			// see if a specific image is being viewed. if so draw the image or slide show or show the thumbnail index
			if( idx < 0 ) {
				InitialiseLightboxGallery();
				//drawThumbsIndex();
			} else {
				// test to see if page is in slide show mode
				if( window.location.href.substr(idx+1,10) == "slideshow"  ) {
					// slideshow of this gallery is being invoked, run this
					SlideShow();
				} else {
					// not in slide-show mode, therefore render the page showing the specific image
					var imageID = parseInt(window.location.href.substr(idx+1));
					document.write('<p align="center">');
					// in-page navigation
					if( imageID < (Gallery.length-1) ) {
					    document.write("<A HREF=\""+getDocumentAddress() + "?" + (imageID+1) + "\">");
					 	document.write(NAV_LEFT);
						document.write("</A>");
					} else 	{
						document.write(NAV_LEFT_DISABLED);
					}
					document.write("&nbsp;<A HREF=\""+getDocumentAddress() +"\">");
					document.write(NAV_UP);
					document.write("</A>&nbsp;");

					if( imageID !=0 ) {
					    document.write("<A HREF=\""+getDocumentAddress() + "?" + (imageID-1) + "\">");
					 	document.write(NAV_RIGHT);
						document.write("</A>");
					} else {
						document.write(NAV_RIGHT_DISABLED);
					}
					document.write("</p>");
					document.write('<h2 align="center">'+Gallery[imageID].Title+'</h2>');
					document.write('<div class="inpagePicture">');
					document.write("<img src="+Gallery[imageID].Image );
					document.write(" width\"" + (Gallery[imageID].ImageX) + "\"");
					document.write(" height=\"" + (Gallery[imageID].ImageY) + "\"");
				    document.write(" onMouseDown=\"javascript:copyrightNotice()\"");
					document.write(" class=\"picFrame\" />");
					document.write('<div class="pictureCaption">' + Gallery[imageID].Description) + '</div>';

				    if( typeof Gallery[imageID].Camera != "undefined") 	{
						document.write("<br /><small>Camera: "+Gallery[imageID].Camera + "</small>");
					} if( typeof Gallery[imageID].Date != "undefined") {
						document.write("<br /><small>Date: "+Gallery[imageID].Date + "</small>");
					}
					document.write("<br /><small>Image " + (Gallery.length-imageID)+ " of " + (Gallery.length) + "</small>" );
					document.write("</div></div>");
				}
			}
			return;
		}

		function getItem(sAddress)
		{
			var idx = sAddress.indexOf("?");
			if( idx < 0 )
			{
				return "";
			}
			else
			{
				return sAddress.substr(idx+1);
				}
		}
		
		// Returns the name of the current page being viewed
		// returns the title of the page, or, slide-show if in slide show mode or undefined if on the thumb nail page
		function GalleryPageName()
		{
			var idx = window.location.href.indexOf("?");
			if( idx < 0 ) return undefined;
			if( window.location.href.substr(idx+1,10) == "slideshow"  )
			{
				return "Slide Show";
			}
			else
			{
				var imageIndex = parseInt(window.location.href.substr(idx+1));
				return Gallery[imageIndex].Title;
			}
		}
	
	
		// returns the index of the current page
		function GalleryPageIndex()
		{
			var idx = window.location.href.indexOf("?");
			if( idx < 0 ) return undefined;
				
			if( window.location.href.substr(idx+1,10) == "slideshow"  )
			{
				return 0;
			}
			else
			{
				return parseInt(window.location.href.substr(idx+1));
			}
		}