
var portfolio = {
				
	inicialize: function(options){
		
		this.options = Object.extend({
			resizeDuration: 400,
			resizeTransition: Fx.Transitions.sineInOut,
			container: document.body,
			descriptions: true,
			opacity: 0.7,
			url: ''
		}, options || {});
		
		this.first_showing = 1;
		this.last_showing = 3;
		
		this.next = 1 + 3;
		
		this.number_objects = $A($$('.carousel_item')).length;
		
		
		$$('.carousel_item').each(function(el) {
			
			el.onclick = this.click.pass(el, this);			
			
		}, this);
		
		if ( $('projects_cont') ) {		
		
			this.setupArrows();
		}
	
	},
	
	click: function(element) {
		
		this.url = element.href;
		// TODO: Hacerlo SmoothScroll. Mootools 1.3?
		var myFx = new Fx.Scroll(window).toElement('worksCarouselCont');
		
		this.changeProfile();
		
		return false;
	},
	
	changeProfile: function() {
		
		var myFx = new Fx.Elements($('workProfileCont'), {
		    duration: 1000, 
		    onComplete: function(){
			this.loadContents();
		    }.bind(this)
		});
		
		myFx.start({
		    0: {
			opacity: [1,0]
		    }
		});

		
		

		// carrega els continguts per loadContents()
		
	},
	
		
	loadContents: function () {
		// Insert the ajax folder to call an ajax controller
		this.url = this.url.replace("/work/", "/workprofile/");
		this.url = this.url.replace("/feina/", "/workprofile/");
		this.url = this.url.replace("/trabajo/", "/workprofile/");


		//*
		//* The simple way for an Ajax request, use onRequest/onComplete/onFailure
		//* to do add your own Ajax depended code.
		var showContents = this.showContents.bind(this).delay(500);
		var ajaxOptions = {
			url: this.url,
			method: 'post',
			onComplete: showContents,
			onSuccess: function(responseText) {
				$('workProfile').set('html', responseText);
			},
			onFailure: function() {
				$('workProfile').set('text', 'Sorry, your request failed :(');
			}

		};
			
		this.ajaxRequest = new Request(ajaxOptions).send();
			
		return false;
	},
	
	
	showContents: function () {
		
		this.images = [];
		$$('#workProfile img').each(function(el) {
			this.images.push(el.getProperty('src'));	
		}, this);
		
		var myFx = new Fx.Elements($('workProfileCont'), {
					    duration: 1000
					});
					
		var myEffect = new Fx.Morph('workProfileCont', {
		    duration: 500,
		    transition: Fx.Transitions.Sine.easeOut,
		    complete: myFx.start({
			    0: {
				opacity: [0,1]
			    }
			})
		});
		
		if  (this.images.length > 0 ) {
			new Asset.images(this.images, {
					
				onComplete: function() {
					
					var profileHeight = $('workProfile').getStyle('height').toInt();
					var contHeight = $('workProfileCont').getStyle('height').toInt();
					 
					myEffect.start({
					    'height': [contHeight, profileHeight], // Morphs the 'height' style from 10px to 100px.
					});
		
				}.bind(this)
			});
			
			new MultiBox('mb');
		}
		else {
					
			var profileHeight = $('workProfile').getStyle('height').toInt();
			var contHeight = $('workProfileCont').getStyle('height').toInt();
			 
			myEffect.start({
			    'height': [contHeight, profileHeight], // Morphs the 'height' style from 10px to 100px.
			});
			
			new MultiBox('mb');

		}
		
		
	}
	
	
	
};


