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


var photoArray = new Array(
	
	new Array("afuera.jpg", "500", "375", "Acuarios Chinchimén - 2009"),
	new Array("1charla acuario2.jpg", "500", "375", "Charlas en los acuarios - 2009"),
	new Array("1charla acuario3.jpg", "500", "375", "Charlas en los acuarios - 2009"),
	new Array("1info.jpg", "500", "375", "Niños curiosos leen sobre las especies marinas"),
	new Array("1maasni.jpg", "500", "375", "Niños en charlas"),
	new Array("1manos2.jpg", "500", "375", "Tacto y observación"),
	new Array("1nenes.jpg", "500", "375", "Niños sorprendidos"),
	new Array("1sapeando.jpg", "500", "375", "Curiosidad"),
	new Array("1tijereta.jpg", "500", "375", "Tijereta - jaiba"),
	new Array("2aanudibranq.jpg", "500", "375", "Nudibranquio"),
	new Array("2aapatiria.jpg", "500", "375", "Paritias - estrellas de mar"),
	new Array("2aapotomar.jpg", "500", "375", "Actinias - Poto de mar"),
	new Array("2abtijerett.jpg", "500", "375", "Jaiba tijereta"),
	new Array("2acuarios.jpg", "500", "375", "Niños observan acuarios"),
	new Array("2baunco.jpg", "500", "375", "Baunco"),
	new Array("2bauncos.jpg", "500", "375", "Bauncos"),
	new Array("2cangrejo moya.jpg", "500", "375", "Cangrejo"),
	new Array("2hermita.jpg", "500", "375", "Cangrejo Hermitaño"),
	new Array("2ostion.jpg", "500", "375", "Ostión"),
	new Array("2peejesap.jpg", "500", "375", "Pejesapo"),
	new Array("2pepino.jpg", "500", "375", "Pepino de Mar"),
	new Array("2picoroco.jpg", "500", "375", "Picoroco"),
	new Array("2potocomiendopez.jpg", "500", "375", "Actinia comiendo un pez"),
	new Array("2torito.jpg", "500", "375", "Torito"),
	new Array("2trombollito 3 aletas.jpg", "500", "375", "Trombollito"),
	new Array("2vieja2.jpg", "500", "375", "Vieja"),
	new Array("3mesa.jpg", "500", "375", "Mesa de bienvenida"),
	new Array("3observador.jpg", "500", "375", "Niño observador")
	);


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