// -----------------------------------------------------------------------------------
// 
// This page coded by Scott Upton
// http://www.uptonic.com | http://www.couloir.org
//
// This work is licensed under a Creative Commons License
// Attribution-ShareAlike 2.0
// http://creativecommons.org/licenses/by-sa/2.0/
//
// Associated APIs copyright their respective owners
//
// -----------------------------------------------------------------------------------
// --- version date: 11/28/05 --------------------------------------------------------


// get current photo id from URL
var thisURL = document.location.href;
var splitURL = thisURL.split("#");
var photoId = splitURL[1] - 1;

// if no photoId supplied then set default
var photoId = (!photoId)? 0 : photoId;

// CSS border size x 2
var borderSize = 20;

// Photo directory for this gallery
var photoDir = "../China2001/Foto2001/";

// Define each photo's name, height, width, and caption
var photoArray = new Array(
	// Source, Width, Height, Caption
	new Array("Taiyuan/M10imm014.JPG", "500", "342", "De zigzag brug bij de Jinci tempel in Taiyuan"),
	new Array("Suzhou/M13imm018.JPG", "500", "342", "Traditionele boogbrug in Suzhou"),
	new Array("Suzhou/M13imm023.JPG", "500", "342", "Traditionele boogbrug in Suzhou bij de Feng Qiao poort aan het Grote Kanaal"),
	new Array("Suzhou/M14imm006.JPG", "500", "342", "Een eenvoudige balkbrug in Suzhou opgelegd op de landhoofden"),
	new Array("Suzhou/M13imm037.JPG", "500", "342", "Traditionele boogbrug in Suzhou aan de Ping Jiang straat"),
	new Array("Suzhou/M13imm038.JPG", "500", "342", "Een balkbrug in Suzhou opgelegd op consoles die in de landhoofden ingeklemd zijn"),
	new Array("Suzhou/M14imm015.JPG", "342","500", "Boogbrugje in Suzhou"),
	new Array("Suzhou/W10imm024.JPG", "342","500", "Boogbrug in Suzhou bij de Feng Qiao poort aan het Grote Kanaal"),
	new Array("Suzhou/M14imm016.JPG", "342","500", "Balkbrug in Tongli de liggers bestaand uit natuursteen blokken ca 7m lang"),
	new Array("Suzhou/M14imm033.JPG", "500", "342", "Betonnen vakwerkbrug bij Zhouzhuang"),
	new Array("Suzhou/W11imm037.JPG", "500", "342", "De Quanfu brug in Zhouzhuang"),
	new Array("Suzhou/M15imm007.JPG", "500", "342", "De 'Dubbele brug' in Zhouzhuang"),
	new Array("Suzhou/M14imm036.JPG", "500", "342", "Taiping brug in Zhouzhuang"),
	new Array("Suzhou/M15imm006.JPG", "500", "342", "Tiyun brug in Zhouzhuang"),
	new Array("Guilin/M18imm009.JPG", "500", "342", "Traditioneel boogbruggetje in de rijstvelden bij Yangshou"),
	new Array("Guilin/M18imm013.JPG", "342", "500", "Standaard type betonnen boogbrug bij Yangshou zoals die veel in China te zijn zijn"),
	new Array("Bustocht/M18imm028.JPG", "500", "342", "Betonnen boogbrug in Wuzhou"),
	new Array("Bustocht/M18imm029.JPG", "500", "342", "Betonnen boogbrug in Wuzhou"),
	new Array("Hong Kong/M20imm029.JPG", "500", "342", "Bruggen uit 1932 over de Parelrivier"),
	new Array("Hong Kong/M20imm005.JPG", "500", "342", "Kap Shui Muni tuibrug bij Hongkong"),
	new Array("Hong Kong/M19imm037.JPG", "342", "500", "Tsing Ma hangbrug bij Hongkong"),
	new Array("Hong Kong/M20imm003.JPG", "500", "342", "Tsing Ma hangbrug bij Hongkong"),
	new Array("Hong Kong/M19imm038.JPG", "342", "500", "Tsing Ma hangbrug bij Hongkong"),
	
	new Array("Taiyuan/M08imm023.JPG", "500", "342", "Bij de eerste bank van China in Pingyao staan links zakje met zand en rechts moderne blussers"),
	new Array("Taiyuan/M08imm025.JPG", "500", "342", "Detail van de zakjes met zand"),
	new Array("Chengde/M07imm018.JPG", "342", "500", "Zandemmertjes bij de Puoto tempel in Chengde"),
	new Array("Beijing/M02imm004.JPG", "500", "342", "Qianmen de Noordelijke poort van de oude stad van Peking"),
	new Array("Taiyuan/M08imm014.JPG", "500", "342", "De stadsmuur van Pingyao"),
	new Array("Taiyuan/M08imm030.JPG", "500", "342", "De poort in de in de stadsmuur van Pingyao"),
	new Array("Taiyuan/M08imm036.JPG", "342","500", "Stadsmuur van Pingyao met wachttorens om de tweehonderd meter"),
	new Array("Taiyuan/M08imm037.JPG", "342","500", "Stadsmuur van Pingyao een kern van leem met een bakstenen buitenkant"),
	new Array("Taiyuan/M08imm038.JPG", "342","500", "Stadsmuur van Pingyao een hoektoren"),
	new Array("Xian/M11imm006.JPG", "500","342", "Stadsmuur van Xi'an"),
	new Array("Xian/M10imm025.JPG", "342","500", "Drum tower van Xi'an zoals te vinden in elk (oude) stad altijd in combinatie met een Bell tower"),
	new Array("Xian/M10imm020.JPG", "500","342", "Bell tower van Xi'an"),
	
	new Array("Taiyuan/M08imm028.JPG", "500", "342", "Ezelkarretje in Pingyao"),
	new Array("Chengde/W04imm006.JPG", "500", "342", "Draagstoel bij de Putuo tempel"),
	new Array("Xian/W07imm037.JPG", "500", "342", "Een handkar met piepschuim dozen in Xian"),
	new Array("Beijing/W01imm005.JPG", "500", "342", "De bakfiets van de stadsreiniging in Beijing"),
	new Array("Suzhou/M14imm014.JPG", "500","342", "Populair vervoermiddel in heel China"),
	new Array("Taiyuan/M07Aimm022.JPG", "500","342", "Populair vervoermiddel in heel China zoals in Taiyuan te zien is in het spitsuur"),
	new Array("Beijing/W05imm012.JPG", "342","500", "Handkar van de schilder in Beijing"),
	new Array("Suzhou/M15imm020.JPG", "500","342", "Riksja tegen de brug op in Zhouzhuang"),
	new Array("Hong Kong/W15imm013.JPG", "342","500", "Een volle bagagedrager Parelrivier Guangzhou"),
	new Array("Suzhou/M15imm008.JPG", "342","500", "Punters in Zhouzhuang"),
	new Array("Suzhou/M14imm032.JPG", "500","342", "Sampan op weg van Tongli naar Zhouzhuang"),
	new Array("Suzhou/M14imm013.JPG", "342","500", "Betonnen boten in Suzhou"),
	new Array("Guilin/M17imm025.JPG", "500","342", "Vlot op de Li rivier"),
	new Array("Shanghai/M15imm035.JPG", "500","342", "Sleep bij de Bund in Shanghai"),
	new Array("Hong Kong/M19imm030.JPG", "500","342", "De draagvleugelboot naar Macau"),
	new Array("Taiyuan/W05imm036.JPG", "500","342", "Motorfiets met laadbak"),
	new Array("Guilin/M17imm037.JPG", "500","342", "Motorfiets met zijspan bij Yangshou"),
	new Array("Bustocht/M18imm018.JPG", "500","342", "Tractor met laadbak"),
	new Array("Chengde/M05imm004.JPG", "500","342", "Varkensvervoer in open laadbak"),
	new Array("Bustocht/W14imm008.JPG", "500", "342", "Varkensvervoer in mandjes"),
	new Array("Taiyuan/M07Aimm010.JPG", "500", "342", "Dieseltrein van de Chinese spoorwegen"),
	
	new Array("Beijing/W01imm009.JPG", "342", "500", "Aanvoer van steenkool briketten in Beijing"),
	new Array("Beijing/W01imm019.JPG", "500","342", "De kapper in Beijing"),
	new Array("Beijing/M01imm018.JPG", "500","342", "Ontspannen op de middag in Beijing"),
	new Array("Beijing/W01imm001.JPG", "342","500", "Kijken of er nog iets nuttigs in zit in Beijing"),
	new Array("Beijing/M01imm019.JPG", "342","500", "Kappers op straat in Beijing"),
	new Array("Beijing/W05imm010.JPG", "342","500", "Rustig de krant lezen in Beijing"),
	new Array("Beijing/M01imm016.JPG", "342","500", "'Split pants' voor de kleintjes"),
	new Array("Beijing/M04imm004.JPG", "342","500", "'Split pants' voor de kleintjes"),
	new Array("Verboden stad/M02imm011.JPG", "342","500", "Grote lol met verkleedpartij bij de Verboden Stad"),
	new Array("Verboden stad/M02imm012.JPG", "342","500", "Resultaat van de verkleedpartij"),	
	new Array("Beijing/M07Aimm005.JPG", "342","500", "Timmerman in Beijing"),
	new Array("Beijing/W05imm011.JPG", "342","500", "Fietsenmaker in direct bij de hand in Beijing"),
	new Array("Taiyuan/M08imm017.JPG", "342","500", "Krakelingenbakker in Pingyao"),
	new Array("Taiyuan/W06imm014.JPG", "342", "500", "Komt u maar gerust kijken hoofdstraat Pingyao"),
	new Array("Grote muur/W03imm016.JPG", "342","500", "Persoonlijke verkopers bij de Grote Muur van Jinshanling"),
	new Array("Chengde/M07imm036.JPG", "342","500", "Na even kijken wat ze komen doen toch trots op de foto bij Chengde"),
	new Array("Beijing/M03imm025.JPG", "500","342", "Theeverkoopster in Beijing"),
	new Array("Taiyuan/M10imm019.JPG", "500","342", "Jong geleerd is oud gedaan in Xian"),
	new Array("Taiyuan/M09imm017.JPG", "500","342", "Studenten die de Engelse taal oefenen in Tayuan"),
	new Array("Xian/M11imm023.JPG", "500","342", "Scholieren die de Engelse taal oefenen met elke buitenlander in Xian"),
	new Array("Taiyuan/W05imm023.JPG", "342","500", "Pa vindt het best leuk zoon liet zich pas na lange tijd pas fotograferen"),
	new Array("Taiyuan/M09imm029.JPG", "342","500", "Amusement op de openbare sessie van de wetswinkel in Tayuan"),
	new Array("Xian/W07imm034.JPG", "342","500", "Trotse moeder in Xian maak gerust maar een foto dat vind ik erg leuk"),
	new Array("Xian/M11imm015.JPG", "342","500", "Rustig moment bij de Kleien Wilde Ganzen Pagode in Xian"),
	new Array("Suzhou/M15imm021.JPG", "500","342", "Handel op de straathoek in Zhouzhuang"),
	new Array("Suzhou/W12imm003.JPG", "500","342", "Fotograferen niet op prijs gesteld, Zhouzhuang"),
	new Array("Suzhou/M13imm015.JPG", "500","342", "Gemeenschappelijke ochtendgymnastiek bij een fastfood restaurant in Suzhou"),
	new Array("Bustocht/W13imm038.JPG", "500","342", "Vrolijke markt in Chentang"),
	new Array("Guilin/M18imm012.JPG", "342","500", "Looky Looky no money for you! De verkoopkreet van de vrouwen en kinderen"),
	new Array("Taiyuan/M09imm018.JPG", "342","500", "Een mond vol (gouden) tanden Tayuan"),
	new Array("Xian/M13imm005.JPG", "342","500", "Recycling business Xian"),
	new Array("Bustocht/M18imm023.JPG", "342","500", "Spannend, die buitenlanders Chengtang"),
	new Array("Guilin/W13imm018.JPG", "342","500", "Grootmoeder op de familieboerderij Yangshou"),
	new Array("Hong Kong/W15imm015.JPG", "342","500", "Eenvoudig transport in Guangzhou"),
	new Array("Hong Kong/W15imm016.JPG", "342","500", "Verkoop van heet water in Guangzhou"),
	new Array("Hong Kong/W15imm014.JPG", "342","500", "Verkoop op de boulvard van de Parelrivier in Guangzhou")

	);

// Number of photos in this gallery
var photoNum = photoArray.length;



/*--------------------------------------------------------------------------*/

// Additional methods for Element added by SU, Couloir
Object.extend(Element, {
	getWidth: function(element) {
   	element = $(element);
   	return element.offsetWidth; 
	},
	setWidth: function(element,w) {
   	element = $(element);
    	element.style.width = w +"px";
	},
	setHeight: function(element,h) {
   	element = $(element);
    	element.style.height = h +"px";
	},
	setSrc: function(element,src) {
    	element = $(element);
    	element.src = src; 
	},
	setHref: function(element,href) {
    	element = $(element);
    	element.href = href; 
	},
	setInnerHTML: function(element,content) {
		element = $(element);
		element.innerHTML = content;
	}
});

/*--------------------------------------------------------------------------*/

var Slideshow = Class.create();

Slideshow.prototype = {
	initialize: function(photoId) {
		this.photoId = photoId;
		this.photo = 'Photo';
		this.photoBox = 'Container';
		this.prevLink = 'PrevLink';
		this.nextLink = 'NextLink';
		this.captionBox = 'CaptionContainer';
		this.caption = 'Caption';
		this.counter = 'Counter';
		this.loader = 'Loading';
	},
	getCurrentSize: function() {
		// Get current height and width, subtracting CSS border size
		this.wCur = Element.getWidth(this.photoBox) - borderSize;
		this.hCur = Element.getHeight(this.photoBox) - borderSize;
	},
	getNewSize: function() {
		// Get current height and width
		this.wNew = photoArray[photoId][1];
		this.hNew = photoArray[photoId][2];
	},
	getScaleFactor: function() {
		this.getCurrentSize();
		this.getNewSize();
		// Scalars based on change from old to new
		this.xScale = (this.wNew / this.wCur) * 100;
		this.yScale = (this.hNew / this.hCur) * 100;
	},
	setNewPhotoParams: function() {
		// Set source of new image
		Element.setSrc(this.photo,photoDir + photoArray[photoId][0]);
		// Set anchor for bookmarking
		Element.setHref(this.prevLink, "#" + (photoId+1));
		Element.setHref(this.nextLink, "#" + (photoId+1));
	},
	setPhotoCaption: function() {
		// Add caption from gallery array
		Element.setInnerHTML(this.caption,photoArray[photoId][3]);
		Element.setInnerHTML(this.counter,((photoId+1)+'/'+photoNum));
	},
	resizePhotoBox: function() {
		this.getScaleFactor();
		new Effect.Scale(this.photoBox, this.yScale, {scaleX: false, duration: 0.3, queue: 'front'});
		new Effect.Scale(this.photoBox, this.xScale, {scaleY: false, delay: 0.5, duration: 0.3});
		// Dynamically resize caption box as well
		Element.setWidth(this.captionBox,this.wNew-(-borderSize));
	},
	showPhoto: function(){
		new Effect.Fade(this.loader, {delay: 0.5, duration: 0.3});
		// Workaround for problems calling object method "afterFinish"
		new Effect.Appear(this.photo, {duration: 0.5, queue: 'end', afterFinish: function(){Element.show('CaptionContainer');Element.show('PrevLink');Element.show('NextLink');}});
	},
	nextPhoto: function(){
		// Figure out which photo is next
		(photoId == (photoArray.length - 1)) ? photoId = 0 : photoId++;
		this.initSwap();
	},
	prevPhoto: function(){
		// Figure out which photo is previous
		(photoId == 0) ? photoId = photoArray.length - 1 : photoId--;
		this.initSwap();
	},
	initSwap: function() {
		// Begin by hiding main elements
		Element.show(this.loader);
		Element.hide(this.photo);
		Element.hide(this.captionBox);
		Element.hide(this.prevLink);
		Element.hide(this.nextLink);
		// Set new dimensions and source, then resize
		this.setNewPhotoParams();
		this.resizePhotoBox();
		this.setPhotoCaption();
	}
}

/*--------------------------------------------------------------------------*/

// Establish CSS-driven events via Behaviour script
var myrules = {
	'#Photo' : function(element){
		element.onload = function(){
			var myPhoto = new Slideshow(photoId);
			myPhoto.showPhoto();
		}
	},
	'#PrevLink' : function(element){
		element.onmouseover = function(){
			soundManager.play('beep');
		}
		element.onclick = function(){
			var myPhoto = new Slideshow(photoId);
			myPhoto.prevPhoto();
			soundManager.play('select');
		}
	},
	'#NextLink' : function(element){
		element.onmouseover = function(){
			soundManager.play('beep');
		}
		element.onclick = function(){
			var myPhoto = new Slideshow(photoId);
			myPhoto.nextPhoto();
			soundManager.play('select');
		}
	},
	a : function(element){
		element.onfocus = function(){
			this.blur();
		}
	}
};

// Add window.onload event to initialize
Behaviour.addLoadEvent(init);
Behaviour.apply();
function init() {
	var myPhoto = new Slideshow(photoId);
	myPhoto.initSwap();
	soundManagerInit();
}