window.addEvent('domready', function() {
	var mailLink = $E('a', $('address'));

	/*mailLink.addEvent('mousedown', function(){
		mailLink.href = 'mailto:rui.dacosta@gmail.com';
	});
	mailLink.addEvent('mouseup', function(){
		setTimeout('myLink.href = "./email.php";', 50)
	});
	mailLink.addEvent('mouseleave', function(){
		if(mailLink.href.match('@'))
		{
			mailLink.href = './email.php';
		}
	});*/

	var hoverTime = 200;
	var moveTime = 500;
	var fadeTime = 350;
	
	var mySlide = new Fx.Slide('info', {duration:fadeTime, wait:true});
	mySlide.hide();

	var arrLeft = $('arrowleft');
	var arrRight = $('arrowright');
	var lowOpac = .4;
	
	function makeHover(addTo)
	{
		if($('hover'))
		{
			$('hover').remove();
		}
		
		var myHover = new Element('div', {
			'id':'hover',
			'styles':{
				'display':'block',
				'position':'absolute',
				'top':25,
				'left':265,
				'width':220,
				'height':150,
				'opacity':.01,
				'background-color':'black',
				'color':'white',
				'text-align':'center',
				'z-index':10000,
				'font-family':'"Century Gothic", "Trebuchet MS", Verdana, Arial, sans-serif;',
				'font-size':'.8em',
				'font-weight':'bold',
				'text-transform':'uppercase',
				'line-height':'150px',
				'cursor':'pointer'
			}
		});
		addTo.appendChild(myHover);
		var hoverFX = new Fx.Styles(myHover, {duration:hoverTime, wait:true});
		myHover.addEvent('mouseenter', function(){
			if($('info').parentNode.getStyle('height') != '0px')
			{
				myHover.innerHTML = 'Click to hide info';
			}
			else
			{
				myHover.innerHTML = 'Click to show info';
			}
			hoverFX.start({
				'opacity':.7
			});
		});
		myHover.addEvent('mouseleave', function(){
			hoverFX.start({
				'opacity':.01
			});
		});
		myHover.addEvents({
			'click':function(){
				myHover.fireEvent('run');
			},
			'run':function(){
				if($('info').parentNode.getStyle('height') != '0px')
				{
					myHover.innerHTML = 'Click to show info';
					mySlide.slideOut();
				}
				else
				{
					$E('div', $('info')).innerHTML = $E('div', myHover.parentNode).innerHTML;
					myHover.innerHTML = 'Click to hide info';
					mySlide.slideIn();
				}
			}
		});
		myHover.fireEvent('run');
	}
		
	var piecesDiv = $('pieces');
	piecesDiv.setStyle('margin-left', -250)
	var fx = new Fx.Styles(piecesDiv, {duration:moveTime, wait:true});
	
	$ES('.piece', 'pieces').each(function(item,index){
		item.setStyle('opacity', lowOpac);
	});
	myPieces = $ES('.piece', 'pieces');
	myPieces[2].setStyle('opacity', 1);
	
	makeHover(myPieces[2]);
	
	arrRight.addEvents({
		'click': function(e){
			var event = new Event(e);
			event.stop();
			this.blur();
			arrRight.fireEvent('run');
		},
		'run': function(){
			if($('hover'))
			{
				var hoverFX = new Fx.Styles($('hover'), {duration:hoverTime, wait:true});
				hoverFX.start({
					'opacity':.01
				});
			}
			
			myPieces = $ES('.piece', 'pieces');
			mySlide.slideOut();
			
			var fx2 = new Fx.Styles(myPieces[2], {duration:fadeTime, wait:true});
			fx2.start({
				'opacity':1
			}).chain(function(){
				this.start({
					'opacity':lowOpac
				});
			});
			
			fx.start({
				'margin-left':-250
			}).chain(function(){
				this.start({
					'margin-left':-500
				});
			}).chain(function(){
				var temp = $E('.piece', 'pieces').clone();
				$E('.piece', 'pieces').remove();
				piecesDiv.setStyle('margin-left', -250);
				piecesDiv.appendChild(temp);
				myPieces = $ES('.piece', 'pieces');
				var fx3 = new Fx.Styles(myPieces[2], {duration:fadeTime, wait:true});
				fx3.start({
					'opacity':1
				}).chain(function(){
					makeHover(myPieces[2]);
				});
			});
		}
	});
	
	arrLeft.addEvents({
		'click': function(e){
			var event = new Event(e);
			event.stop();
			this.blur();
			arrLeft.fireEvent('run');
		},
		'run': function(){
			if($('hover'))
			{
				var hoverFX = new Fx.Styles($('hover'), {duration:hoverTime, wait:true});
				hoverFX.start({
					'opacity':.01
				});
			}
			
			myPieces = $ES('.piece', 'pieces');
			mySlide.slideOut();
			
			var fx2 = new Fx.Styles(myPieces[2], {duration:fadeTime, wait:true});
			fx2.start({
				'opacity':1
			}).chain(function(){
				this.start({
					'opacity':lowOpac
				});
			});
			
			fx.start({
				'margin-left':-250
			}).chain(function(){
				this.start({
					'margin-left':0
				});
			}).chain(function(){
				var lastPiece = $ES('.piece', 'pieces').getLast();
				var temp = lastPiece.clone();
				lastPiece.remove();
				temp.injectBefore($E('.piece', 'pieces'));
				piecesDiv.setStyle('margin-left', -250);
				myPieces = $ES('.piece', 'pieces');
				var fx3 = new Fx.Styles(myPieces[2], {duration:fadeTime, wait:true});
				fx3.start({
					'opacity':1
				}).chain(function(){
					makeHover(myPieces[2]);
				});
			});
		}
	});
	
	window.addEvent('keydown', function(e){
		var event = new Event(e);
		if(event.key == 'left')
		{
			arrLeft.fireEvent('run');
		}
		if(event.key == 'right')
		{
			arrRight.fireEvent('run');
		}
		if(event.key == 'enter')
		{
			event.stop();
			if($('hover'))
			{
				$('hover').fireEvent('run');
			}
		}
	});

});