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


var photoArray = new Array(
	
	new Array("1 agua.jpg", "500", "375", "Nutria Marina - Chungungo - Lontra felina"),
	new Array("1amonitr.jpg", "500", "375", "Monitores en jornadas de observación"),
	new Array("1amonitrr_2.jpg", "500", "375", "Monitores en jornadas de observación"),
	new Array("1famchung.jpg", "500", "375", "Familia observa a las nutrias marinas"),
	new Array("1mirandoch.jpg", "500", "375", "Observando en busca de nutrias"),
	new Array("1monitgr1.jpg", "500", "375", "Grupo Nº1 Tercera jornada de Monitoreo"),
	new Array("2achungo en agua.jpg", "500", "375", "Chungungo nadando"),
	new Array("2chun comiendo.jpg", "500", "375", "Chungungo alimentándose"),
	new Array("2chunrocas.jpg", "500", "375", "Chungungo en las rocas"),
	new Array("2xchungo al agua.jpg", "500", "375", "Nutria Marina nadando"),
	new Array("3chuingueand.jpg", "500", "375", "Monitores del programa de Monitoreo de Nutrias"),
	new Array("3chunasao.jpg", "500", "375", "Puesta de sol en las jornadas de Monitoreo de Nutrias"),
	new Array("chung.jpg", "500", "375", "Chungungueando en las rocas"),
	new Array("3conteo1.jpg", "500", "375", "Monitores en primera jornada de observación"),
	new Array("oraschun.jpg", "500", "375", "Asistentes a las jornadas de observación de nutrias"),
	new Array("3gemelas.jpg", "500", "375", "Asistentes a la Primera jornada de conteo de nutrias"),
	new Array("3monitrr.jpg", "500", "375", "Monitores"),
	new Array("5elmastrodisquero.jpg", "500", "375", "Disco en celebración de una jornada de conteo")
	);


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