//--Start of: Class Defintions (Blueprints) --

function Gallery()
{
	this.itemList = new Array();
}


//This is is a class definition for an object
//Notes: 	The keyword 'this' is used in order to "attach" projectId and imageList to the class.
//				A class is a blueprint for an object.
function GalleryItem()
{
	this.projectId = 0;
	this.blurb = "";
	this.imageList = new Array();
}



// KING!!!
function SnapshotInfo()
{
	this.projectId = 1; // remember to subtract -1 off this when looking up an array
	this.imageIndex	=	0; // no need to subtract -1 when looking up arrays
}

//--End of: Class Defintions (Blueprints) --

// Declare required variables
var activeSnapshotInfo;
var gallery;

function bodyload() // Stuff that happens on loading of page
{
	/*
	Note: We use CapitalCase for class names and camelCase for
	object instances
	*/

	// Create activeSnapshotInfo - This will identify which image to
	// display in the main area of the screen
	activeSnapshotInfo = new SnapshotInfo();

	// Create gallery - This holds a list of gallery items (note: 1
	// galleryItem exists for each project)
	gallery = new Gallery();
	
	// Build up our gallery
	buildGallery();
}





function nextSnapshot()
{
	// Set series ID to the first in the list
	activeSnapshotInfo.imageIndex++;

	updateDisplay();


}


function previousSnapshot()
{
	// Set series ID to the first in the list
	activeSnapshotInfo.imageIndex--;

	updateDisplay();
}

//Purpose: To change the currently active project and redisplay snapshot
//Params:
//	projectId - This is the ID of the project we wish to change to
//Returns: Nothing
function changeActiveSnapshotInfo(projectId)
{
	// Set new project ID
	activeSnapshotInfo.projectId = projectId;

	// Set series ID to the first in the list
	activeSnapshotInfo.imageIndex = 0;

	updateDisplay();
}


//Purpose: 	To change the displayed snapshot and sync it with the galleryInfo
//					object
//Params:		Nothing
//Returns: 	Nothing
function updateDisplay()
{
	// Convenient reference to the snapshot HTML element
	var snapshotImage = document.getElementById('snapshotImage');
	var snapshotBlurb = document.getElementById('snapshotBlurb');

	// We take the details stored in activeSnapshotInfo.
	// Based on these details we get ready to display an image 
	// in the main area of the screen
	var activeProject = gallery.itemList[activeSnapshotInfo.projectId - 1];
	var activeImageIndex = activeSnapshotInfo.imageIndex;

	//alert("activeImageIndex: " + activeImageIndex);
	//alert(gallery.itemList[1].imageList[2]);

	//Update blurb
	snapshotBlurb.innerHTML = activeProject.blurb;

	//Update picture
	snapshotImage.src = activeProject.imageList[activeImageIndex];

	// enable/disable buttons: will there be another snapshot to 
	//go to before/after this one?	
	var numProjectImages = activeProject.imageList.length;

	updateDisplayOfPrevNextButtons(activeImageIndex, numProjectImages);
}

function updateDisplayOfPrevNextButtons(activeImageIndex, numProjectImages)
{
	// ASSERTION: We have at least 1 image in our list
	if (numProjectImages < 1)
		throw "numProjectImages must be greater than 1. Current value: " + numProjectImages;

	var imageLabel = document.getElementById('imageLabel');
	if (numProjectImages > 1) // show "Images" label if more than one images in project
		imageLabel.className = "display";
	else
		imageLabel.className = "hide";
		
	// Convenient reference to HTML elements
	var nextButton = document.getElementById('next');
	var previousButton = document.getElementById('previous');
	
	// PREVIOUS BUTTON ENABLEMENT
	if (activeImageIndex > 0)
		previousButton.className = 'display'; //enable previous button
	else
		previousButton.className = 'hide'; //disable previous button

	// NEXT BUTTON ENABLEMENT
	if (	activeImageIndex < (numProjectImages - 1) )
		nextButton.className = 'display'; //enable next button
	else
		nextButton.className = 'hide'; //disable next button
}






function buildGallery()
{
	//#1
  // This how we create an 'object' based on the blueprint that is the class. Note that it is good ettiqute
  // to start classnames with an uppercase character but start object (instance) names with a lowercase letter
	var galleryItem1 = new GalleryItem();

	galleryItem1.projectId = 1;
	galleryItem1.blurb = "A 60s house is totally transformed by Pepper Architecture.";
	galleryItem1.imageList = new Array('galleryImages/benson1.jpg', 'galleryImages/benson2.jpg', 'galleryImages/benson3.jpg', 'galleryImages/benson4.jpg');

	// Add galleryItem 1 to the list of galleryItems
	gallery.itemList[0] = galleryItem1;


	//#2
	var galleryItem2 = new GalleryItem();

	galleryItem2.projectId = 2;
	galleryItem2.blurb = "Renovation of an old brick and tile home ";
	galleryItem2.imageList = new Array('galleryImages/parade1.jpg', 'galleryImages/parade2.jpg');

	// Add galleryItem 2 to the list of galleryItems
	gallery.itemList[1] = galleryItem2;
	
	//alert(gallery.itemList[1].imageList[2]);
	
	
	

	//#3
	var galleryItem3 = new GalleryItem();

	galleryItem3.projectId = 3;
	galleryItem3.blurb = "An original 1940s Kiwi Bach ";
	galleryItem3.imageList = new Array('galleryImages/weka1.jpg', 'galleryImages/weka2.jpg','galleryImages/weka3.jpg');

	// Add galleryItem 3 to the list of galleryItems
	gallery.itemList[2] = galleryItem3;

}

// JavaScript Document