window.addEvent('domready', function(){
	var list = $$('#mainMenu ul li a');
	list.each(function(element){
		if (!element.hasClass('selected')){
			var fx = new Fx.Styles(element, {duration:150, wait:false});
			element.addEvent('mouseenter', function(){
				fx.start({
					'margin-left': 15,
					'color': '#000'
				});
			});

			element.addEvent('mouseleave', function(){
				fx.start({
					'margin-left': 0,
					//'font-weight': 'normal',
					'color': '#fff'
				});
			});			
		};
	});

//Comprobar en explorer 6
	var photoList = $$('ul#sidebar li');
	photoList.each(function(element){
		var fx = new Fx.Styles(element, {duration:150, wait:false});

		element.addEvent('mouseenter', function(){
			fx.start({
				'background-color':'#999',
				'width':'164',
				'padding-left':'25'
			});
			
		});
		element.addEvent('mouseleave', function(){
			fx.start({
				'background-color':'#4f4f4f',
				'width':'189',				
				'padding-left':'0'
			});
		});
	});

/*
	var photoList = $$('ul#sidebar li img');
	photoList.each(function(element){
		var fx = new Fx.Styles(element, {duration:150, wait:false});

		element.addEvent('mouseenter', function(){
			fx.start({
				'margin-left':29,
				'opacity':.5
			});
			
		});
		element.addEvent('mouseleave', function(){
			fx.start({
				'margin-left':5,
				'opacity':1
			});
		});
	});
*/
	
	// Click en las photos
	var photoList = $$('ul#sidebar li img');
	photoList.each(function(element){
		//$('image').setProperty('src','foto.gif'); /element.js (native)
		element.addEvent('click', function(){
			//get photo's name
			var photo = element.getProperty('src').split('-s.jpg')[0]+'-m.jpg';
			//get photo from server
			var img = new Asset.image(photo, {id:'image', title:'Titulo'});

			//fadeout effect
			new Fx.Styles(	$('image'),{duration:200,
										onComplete:function(){
											//replace old <img> with new img element
											$('image').replaceWith(img);
											//fade in effect
											new Fx.Styles($('image'),{duration:200}).start({opacity:1});
										}
			}).start({'opacity':0});
		});
	});
});