var Album = Class.create({
	initialize:function(){
		this.bigPics = new Array();
		this.pics = $$('.albumsPhoto');
		this.img = $('bigPics');
		this.start = 0;
		if(!this.img)
			return;

		var _self = this;
		var nbr = 0;
		this.pics.each(function(n){
			if(nbr >= 4)
				n.hide();
			var nb = _self.bigPics.length;
			var imgsrc = n.getAttribute('src').split("/");
			imgsrc = imgsrc[imgsrc.length-1];
			_self.bigPics[nb] = new Image();
			_self.bigPics[nb].src = "/photos/450-450/"+imgsrc;
			n.setAttribute("picsId",nb);
			n.setOpacity(0.5);
			n.observe("click",function(){
				var picsId = this.getAttribute("picsId");
				_self.img.setAttribute("src",_self.bigPics[picsId].src);
			});
			n.observe("mouseover",function(){
				this.setOpacity(1);
			});
			n.observe("mouseout",function(){
				this.setOpacity(0.5);
			});
			nbr++;
		});
		this.initScrolling();
	},
	initScrolling:function(){
		var leftArrow = $('leftArrow');
		var rightArrow = $('rightArrow');
		var _self = this;
		if(!leftArrow || !rightArrow)
			return;
		
		leftArrow.observe("mousedown",function(){
			this.setStyle("background-color: #DDD");
		})
		leftArrow.observe("mouseup",function(){
			if(!this.getAttribute("over"))
				this.setStyle("background-color: #FFF");
			else
				this.setStyle("background-color: #EEE");
		});
		leftArrow.observe("mouseover",function(){
			this.setAttribute("over",true);
			this.setStyle("background-color: #EEE");
		});
		leftArrow.observe("mouseout",function(){
			this.setAttribute("over",false);
			this.setStyle("background-color: #FFF");
		});

		leftArrow.observe("click",function(){
			if(_self.start == 0)
				return;
			_self.start--;
			_self.pics[_self.start].show();
			if(_self.pics[_self.start+4])
				_self.pics[_self.start+4].hide();
		});


		rightArrow.observe("mousedown",function(){
			this.setStyle("background-color: #DDD");
		})
		rightArrow.observe("mouseup",function(){
			if(!this.getAttribute("over"))
				this.setStyle("background-color: #FFF");
			else
				this.setStyle("background-color: #EEE");
		});
		rightArrow.observe("mouseover",function(){
			this.setAttribute("over",true);
			this.setStyle("background-color: #EEE");
		});
		rightArrow.observe("mouseout",function(){
			this.setAttribute("over",false);
			this.setStyle("background-color: #FFF");
		});

		rightArrow.observe("click",function(){
			if(_self.pics.length-_self.start <= 4)
				return;
			_self.pics[_self.start].hide();
			if(_self.pics[_self.start+4])
				_self.pics[_self.start+4].show();
			_self.start++;
		});
		
	}
});