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/quirilluca/";


var photoArray = new Array(
	
	new Array("1playa2.jpg", "500", "375", "Vegetación en Acantilados de la Quirilluca"),
	new Array("1quiri agost.jpg", "500", "375", "Talud de acceso a Playa la Quirilluca"),
	new Array("quiri dic.jpg", "500", "375", "Talud y Acantilados"),
	new Array("1quiri en agosto.jpg", "500", "375", "Quirilluca en agosto"),
	new Array("1quiri en agosto2.jpg", "500", "375", "Quirilluca en agosto"),
	new Array("1quirii.jpg", "500", "375", "Acantilados y vista a Zapallar"),
	new Array("2aacolores.jpg", "500", "375", "Colores"),
	new Array("2aafranklin.jpg", "500", "375", "Gaviotas Franklin"),
	new Array("2aaplaya.jpg", "500", "375", "Sobrevuelo"),
	new Array("2aaquiri copy.jpg", "500", "375", "Cactáceas"),
	new Array("2aguil.jpg", "500", "375", "Aguilucho"),
	new Array("2aguiluis.jpg", "500", "375", "Aguilucho"),
	new Array("2capacho.jpg", "500", "375", "Capachitos"),
	new Array("2dirter.jpg", "500", "375", "Atraido por el color"),
	new Array("2fbicho.jpg", "500", "375", "Insectos"),
	new Array("2flord.jpg", "500", "375", "Orquídeas"),
	new Array("2gusano.jpg", "500", "375", "Insectos"),
	new Array("2hormiga cacto.jpg", "500", "375", "Hormiga en flor de cactus"),
	new Array("2jote.jpg", "500", "375", "Jote cabeza negra"),
	new Array("2liola.jpg", "500", "375", "Liolaemus lemniscatus - Lagartija lemniscata"),
	new Array("2liolam.jpg", "500", "375", "Liolaemus lemniscatus - Lagartija lemniscata"),
	new Array("2pluma.jpg", "500", "375", "Flor de la plumilla"),
	new Array("2reloj.jpg", "500", "375", "Relojito"),
	new Array("2salta.jpg", "500", "375", "Saltamonte"),
	new Array("3alafoto.jpg", "500", "375", "De visita en el bosque"),
	new Array("3caminando a los bosques.jpg", "500", "375", "Caminando al bosque"),
	new Array("3delbosq.jpg", "500", "375", "Aprendiendo en terreno"),
	new Array("3flores.jpg", "500", "375", "Flores"),
	new Array("4mirando.jpg", "500", "375", "Observador"),
	new Array("4quiri agosto.jpg", "500", "375", "Talud"),
	new Array("26nifidicacioin.jpg", "500", "375", "Nidificacion de piqueros"),
	new Array("26padre e hijo piq.jpg", "500", "375", "Piqueros - Sula variegata"),
	new Array("26nidif gav.jpg", "500", "375", "Nidificación de gaviotas dominicanas"),
	new Array("26nidifi.jpg", "500", "375", "Nidificacion de piqueros"),
	new Array("26nifidicacioin.jpg", "500", "375", "Nidificacion de piqueros"),
	new Array("26piq nidif.jpg", "500", "375", "Piqueros"),
	new Array("26piq nif.jpg", "500", "375", "Piqueros"),
	new Array("26pique.jpg", "500", "375", "Piqueros"),
	new Array("edificio.jpg", "500", "375", "Construcción de edificios"),
	new Array("escu.jpg", "500", "375", "Alumnas de la escuela de Maitencillo"),
	new Array("escua a.jpg", "500", "375", "Alumnos, profesores y monitores en actividad educativa"),
	new Array("queir agost.jpg", "500", "375", "Colores de invierno"),	
	new Array("vol.jpg", "500", "375", "Voluntarios Verano 2009")
	);


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();
}