// Mootools Constructor
window.addEvent('domready', function(){
	// Slider	
	var scroll = new Scroller('slider', {area: 100, velocity: .2});
	$('slider').addEvent('mouseenter', scroll.start.bind(scroll));
	$('slider').addEvent('mouseleave', scroll.stop.bind(scroll));
	$('slider').setStyle('cursor', 'pointer');
	// Opening projects
	$$('#slider li').addEvent('click', function(e){	
		// Hidding intro text
		$$('#intro').setStyle('display', 'none');
		new Event(e).stop();
		var temp=$(this).getProperties('id','title');
		if(temp.id){
		var miAjax = new Ajax('/proyectos/datos/'+temp.id,
		{   		
			method: 'get',
			data:'ejemplo=cuatro&variable=mootools',
			update: $('projects'),
			onComplete: function()
			{
				$('projects').setStyle('opacity', '0');
				$('projects').setStyle('display', 'block');
				$('projects').setStyle('position', 'absolute');				
				// Transition
				fadeIn = new Fx.Style('projects', 'opacity', {
					duration: 500,
					transition: Fx.Transitions.Quart.easeInOut
				});
				fadeIn.start(0,1);
				// Closing projects 
				$$('#projects a.close').addEvent('click', function(e){			
					fadeOut = new Fx.Style('projects', 'opacity', {
						duration: 200,
						transition: Fx.Transitions.Quart.easeOut
					});
					fadeOut.start(1, 0);
					// Show intro and hide description
					mySlide.toggle();
					$$('#intro').setStyle('display', 'block');
				});
				$$('#thumbs a').addEvent('click', function(e){
					$('imgaux').setProperty('src',$(this));
					vari=$(this).getProperties('id','title');
					$$('#projectimg span').setHTML(vari.title);
					new Event(e).stop();
				});
				mySlide = new Fx.Slide('toggle').hide(); 		   				
				$$('#show').addEvent('click', function(e){					 
					e = new Event(e);
					mySlide.toggle();
					e.stop(); 				   				   
				});
				mySlide2 = new Fx.Slide('iframe').hide(); 		   				
				$$('#show-vid').addEvent('click', function(e){					 
					e = new Event(e);
					mySlide2.toggle();
					e.stop(); 				   				   
				});
			}
		});		
		miAjax.request();
		}
	});
	// Styling footer when it's a slider page
	var footerElement = document.getElementById('footer');
	footerElement.style.position = 'absolute';
	footerElement.style.bottom = 20 + 'px';	
	// IE has a different behaviour
	ie7 = ((document.all)&&(navigator.appVersion.indexOf('MSIE 7.')!=-1)) ? true : false;

	if(ie7) {
		footerElement.style.margin = '0 0 0 -500px';
	}

});