
var thisURL = document.location.href;
var splitURL = thisURL.split("#");
var photoId = splitURL[1] - 1;


var photoId = (!photoId)? 0 : photoId;


var borderSize = 10;


var photoDir = "photos/humedal campiche/";


var photoArray = new Array(
	
	new Array("1 panor.jpg", "500", "375", "Humedal Campiche"),
	new Array("1 patos.jpg", "500", "375", "Vegetación y fauna humedal Campiche"),
	new Array("1observando.jpg", "500", "375", "Observando la avifauna"),
	new Array("1 juegos ambientales3.jpg", "500", "375", "Actividades con los niños"),
	new Array("1explorando.jpg", "500", "375", "Explorando"),
	new Array("1observacion.jpg", "500", "375", "Avistando la avifauna"),
	new Array("1xxvoluntario y grupo.jpg", "500", "375", "Voluntario y grupo de visitantes"),
	new Array("1xynino.jpg", "500", "375", "Aprendiendo de las aves"),
	new Array("1xzmirando.jpg", "500", "375", "Actividad de observación de las especies"),
	new Array("1zpatos2.jpg", "500", "375", "Avifauna"),
	new Array("2huala.jpg", "500", "375", "Huala"),
	new Array("2isla.jpg", "500", "375", "Isla de Aves"),
	new Array("2patorana.jpg", "500", "375", "Pato rana"),
	new Array("2picaflor gig.jpg", "500", "375", "Picaflor gigante"),
	new Array("2picaflor gig2.jpg", "500", "375", "Picaflor gigante"),
	new Array("2pimpollo2.jpg", "500", "375", "Pimpollo"),
	new Array("2raro.jpg", "500", "375", "Escondido entre juncos"),
	new Array("2runrun.jpg", "500", "375", "Run run"),
	new Array("2tagua.jpg", "500", "375", "Tagua común"),
	new Array("2unwatthefuc.jpg", "500", "375", "Pitotoy"),
	new Array("27colores.jpg", "500", "375", "Sietecolores"),
	new Array("a la foto.jpg", "500", "375", "Niños que participan en las actividades en el humedal"),
	new Array("a la foto2.jpg", "500", "375", "Niños que participan en las actividades en el humedal"),
	new Array("actividades para ninos.jpg", "500", "375", "Actividades para niños"),
	new Array("juegos ambientales4.jpg", "500", "375", "Actividades para niños"),
	new Array("juegos ambientales5.jpg", "500", "375", "Actividades para niños"),
	new Array("gentemirando.jpg", "500", "375", "Familias observan la fauna de Campiche"),
	new Array("ninos hum escuela.jpg", "500", "375", "Actividades con niños de las escuelas de la comuna"),
	new Array("senorass.jpg", "500", "375", "Visitantes disfrutan de la avifauna"),
	new Array("voluntarios.jpg", "500", "375", "Voluntarios -  Verano 2008")
	);


var photoNum = photoArray.length;


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() {
		
		this.wCur = Element.getWidth(this.photoBox) - borderSize;
		this.hCur = Element.getHeight(this.photoBox) - borderSize;
	},
	getNewSize: function() {
		
		this.wNew = photoArray[photoId][1];
		this.hNew = photoArray[photoId][2];
	},
	getScaleFactor: function() {
		this.getCurrentSize();
		this.getNewSize();
		
		this.xScale = (this.wNew / this.wCur) * 100;
		this.yScale = (this.hNew / this.hCur) * 100;
	},
	setNewPhotoParams: function() {
	
		Element.setSrc(this.photo,photoDir + photoArray[photoId][0]);
		
		Element.setHref(this.prevLink, "#" + (photoId+1));
		Element.setHref(this.nextLink, "#" + (photoId+1));
	},
	setPhotoCaption: function() {
	
		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});
		
		Element.setWidth(this.captionBox,this.wNew-(-borderSize));
	},
	showPhoto: function(){
		new Effect.Fade(this.loader, {delay: 0.5, duration: 0.3});
	
		new Effect.Appear(this.photo, {duration: 0.5, queue: 'end', afterFinish: function(){Element.show('CaptionContainer');Element.show('PrevLink');Element.show('NextLink');}});
	},
	nextPhoto: function(){
		
		(photoId == (photoArray.length - 1)) ? photoId = 0 : photoId++;
		this.initSwap();
	},
	prevPhoto: function(){
		
		(photoId == 0) ? photoId = photoArray.length - 1 : photoId--;
		this.initSwap();
	},
	initSwap: function() {
		
		Element.show(this.loader);
		Element.hide(this.photo);
		Element.hide(this.captionBox);
		Element.hide(this.prevLink);
		Element.hide(this.nextLink);
		
		this.setNewPhotoParams();
		this.resizePhotoBox();
		this.setPhotoCaption();
	}
}


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();
		}
	}
};


Behaviour.addLoadEvent(init);
Behaviour.apply();
function init() {
	var myPhoto = new Slideshow(photoId);
	myPhoto.initSwap();
	soundManagerInit();
}
