/* 
 * El Magico (I)
 *   - ajouter ze effects au site 
 *
 * (Requires Mootools framework)
 *
 * (C) Modanoo.com 2008
 * Author: Phil Moore (phil.moore@tmgmedia.com) - {available for marriages, funerals and Bar Mitzvahs}
 *
 */

/* Convenience function to add the "over" class on rollover, and remove it when the mouse leaves */
function setRollover(elem) {
	elem.addEvent('mouseenter', function() { elem.addClass('over'); });
	elem.addEvent('mouseleave', function() { elem.removeClass('over'); });	
}

window.addEvent('domready', function() {
	
	/* Ajouter les "over" sur les navigation */
	$$('#nav li.top-level').each(setRollover);
	
	/* Ajouter l'animation du fond des boutons */
	$$('.bouton').each( function(b) {
								 b.set('tween', {duration:200,property:'background-position'}).setStyle('background-position', '0 0');
								 b.addEvent('mouseenter', function() { b.setStyle('background-position', '-186px 0').tween('0 0'); });
								 //b.addEvent('mouseleave', function() { b.tween('-186px 0'); });
							});
	
	/* Ajouter le focus/blur effets sur les champs <input> mail */
	$$('input').filter(function(elem) { return elem.getProperty('name') == "email"; }).each( function(input) {
		input.value = (input.value == '' ? 'votre adresse mail' : input.value);
		input.addEvent('focus', function() { if (input.value=="votre adresse mail") input.value = ''; });
		input.addEvent('blur', function() { if (input.value=="") input.value = 'votre adresse mail'; });
	});

	/* Ajouter le focus/blur effets sur les champs <input> recherche */
	$$('input').filter(function(elem) { return elem.getProperty('name') == "q"; }).each( function(input) {
		input.value = (input.value == '' ? 'rechercher' : input.value);
		input.addEvent('focus', function() { if (input.value=="rechercher") input.value = ''; });
		input.addEvent('blur', function() { if (input.value=="") input.value = 'rechercher'; });
	});
	
	// ajouter le class CSS 'over' à chaque offre en rollOver
	$$('.offre-grid .offre').each(function(offre) { setRollover(offre); });
	
	/* Montrer les descriptions pour un rollover */
	$$('.offre-grid .description.fade-in').each( function (desc) {
		// format the text
		var text = new Element('span', {'class' : 'show-text'}).set('html', desc.get('html'));	// 'wrap' the text with span.show-text
		desc.empty();	// we don't want a duplicate of the text
		desc.grab(new Element('span', {'class' : 'fond'}).setStyle('opacity', '0.8')).grab(text);	// create the background to the overlay
		desc.getParent().getFirst().grab(desc);	// move the description element to the image <a>
		
		// add the rollover effects
		desc.fade('hide').setStyle('display', 'block').set('tween', {duration:200});	// switch out the default display:none & initialise the fade
		if (desc.getSize().y > 180) desc.setStyle('height', 180);
		desc.getParent().addEvent('mouseenter', function() { desc.fade('in'); });	// fade in on mouseover <a>
		desc.getParent().addEvent('mouseleave', function() { desc.fade('out'); });	// fade out on mouseout <a>
	});
	
	/* Glisser les titres / sources s'ils sont trop longs */
	$$('.gliss-x').each( function(elem) {
		var offset = elem.getParent().getStyle('width').toInt() - elem.getStyle('padding-left').toInt() - elem.getFirst().getSize().x;
		if (offset < 0) {
			elem.scroller = new Fx.Tween(elem, {property : 'margin-left', wait:false});
			elem.addEvent('mouseenter', function() { elem.scroller.start(offset); });
			elem.addEvent('mouseleave', function() { elem.scroller.start(0); });
		}
	});
	
	// faire le "jump" effet pour les tags
	var tags = $$('.tags a');
	tags.each( function (tag) {
		tag.set('lastHilite', null);
		tag.set('running', "0");
		tag.addEvent('mouseenter', function() {
			if (tag.get('running') == "0" && tag.get('lastHilite') != this.href) {
				tags.set('running', "1");
				tag.highlighted = true;			
				highlight = new Element('span', {"class":"tagtextflash", "text":this.get('text')}).inject(this);
				tag.fx = new Fx.Morph(highlight, {'duration':400});
				tag.fx.start({"font-size" : "368px", "opacity":0}).chain(function() { 
																						highlight.destroy();
																						tags.set('lastHilite', tag.href);
																						tags.set('running', "0");
																				});
			}
		});
	});

});