window.addEvent('domready', function()
{
  if($('show-recette'))
  {
	/* *****************************************
	***** MENU GAUCHE **************************
	** ****************************************/

	//$ Menu gauche // sélection de la recette
    $$('.recette-select').each(function(el)
    {
		//$ Récup. de l'élément texte du bouton
		var span = el.getElements('span');
		var spancolor = span[0].getStyle('color');
		//$ Animation du bouton et de son texte
		var FXbtn = new Fx.Tween(el);
		var FXfont = new Fx.Tween(span[0]);
		//$ Calcul de la largeur totale pour déplacer le BG du bouton
		var xPos = el.getStyle('width').toInt()+el.getStyle('padding-left').toInt()+el.getStyle('padding-right').toInt();
		//alert(el.xPos);
		//$ Boutons sous-menu couleur 1
		el.addEvents(
		{
			'mouseenter' :function(){
				if(!el.hasClass('on')){
					FXbtn.cancel();
					FXfont.cancel();
					el.setStyle('background-position','0 0');
					FXbtn.start('background-position',xPos+'px 0');
					FXfont.start('color','#ffffff');
				}
			},
			'mouseleave' :function(){
				if(!el.hasClass('on')){
					FXbtn.cancel();
					FXfont.cancel();
					FXbtn.start('background-position','0 0');
					FXfont.start('color',spancolor);
				}
			},
			'click' :function(){
				if(!el.hasClass('on')){
					//$ Comparaison avec les autres boutons pour récupérer l'actif
					spansCR = $$('.recette-tool .recette-select');
					for(i=0; i<spansCR.length; i++){
						if(spansCR[i].hasClass('on')){
							spanOn = spansCR[i];
						}
					}
					getRecette(el.get('wid'), el.get('inCoaching'));
					//$ Animation du bouton à désenclencher et de son texte
					spanOn.span = spanOn.getElement('span');
					spanOn.FXbtn = new Fx.Tween(spanOn);
					spanOn.span.FXfont = new Fx.Tween(spanOn.span);

					spanOn.FXbtn.start('background-position','0 0');
					spanOn.span.FXfont.start('color',el.spancolor);
					spanOn.removeClass('on');

					//$ Animation du bouton à enclencher et de son texte
					FXbtn.cancel();
					FXfont.cancel();
					FXbtn.start('background-position',xPos+'px 0');
					FXfont.start('color','#ffffff');
					el.addClass('on');
				}
			}
		});

    });

	//$ Menu gauche // sélection de la recette // Initialisation de l'actif
	initRecetteSel = function(){
		spansCR = $$('.recette-tool .recette-select');
		for(i=0; i<spansCR.length; i++){
			if(spansCR[i].hasClass('on')){
				var xPos = spansCR[i].getStyle('width').toInt()+spansCR[i].getStyle('padding-left').toInt()+spansCR[i].getStyle('padding-right').toInt();
				spansCR[i].span = spansCR[i].getElements('span');
				spansCR[i].FXbtn = new Fx.Tween(spansCR[i]);
				spansCR[i].FXfont = new Fx.Tween(spansCR[i].span[0]);
				spansCR[i].setStyle('background-position','0 0');
				spansCR[i].FXbtn.start('background-position',xPos+' 0');
				spansCR[i].FXfont.start('color','#ffffff');
			}
		}
	}
	//$ Menu gauche // sélection de la recette // Initialisation de l'actif
	initRecetteSel();




	/* *****************************************
	***** MENU DROITE **************************
	** ****************************************/

	//$ Menu droite // infos de la recette // Initialisation générale
	initRecetteComs = function(el){
	  if($('btn-'+el))
	  {
		var spans = $('btn-'+el).getElements('span');
		for(i=0; i<spans.length; i++){
			if(spans[i].hasClass('hov')){
				btnHov = spans[i];
			}
			if(spans[i].hasClass('off')){
				btnOff = spans[i];
			}
		}
		$('btn-'+el).FXOff         = new Fx.Tween(btnOff,{duration: 400});
		$('btn-'+el).FXHov         = new Fx.Tween(btnHov,{duration: 400});

		$('btn-'+el).FXOff.cancel();
		$('btn-'+el).FXOff.start('opacity',0);

		$('btn-'+el).FXHov.cancel();
		$('btn-'+el).FXHov.start('opacity',0);

		_oldRCId = el;
		$('btn-'+el).removeClass('moverc');
		$('btn-'+el).addClass('on');
	}
	}

	//$ Menu droite // infos de la recette // fonction générale
	initRecetteBtns = function(el){
		el.commonid = String(el.id).replace('btn-','');
		el._newBtn = $('btn-'+el.commonid);
		el._newPage = $('recette-'+el.commonid);

		el.spans = el.getElements('span');
		for(i=0; i<el.spans.length; i++){
			if(el.spans[i].hasClass('hov')){
				el.spanHov = el.spans[i];
			}
			if(el.spans[i].hasClass('off')){
				el.spanOff = el.spans[i];
			}
		}
		el.spanOff.Fx = new Fx.Tween(el.spanOff, { duration:400 });
		el.spanHov.Fx = new Fx.Tween(el.spanHov, { duration:400 });

		var _jumpsrc = $('show-recette').getElements('.btn');
		for(i=0; i<_jumpsrc.length; i++){
			if(_jumpsrc[i] == el){
				 el.jump = i;
			}
		}
		el.jumptorc = (el._newPage.getStyle('width').toInt() + el._newPage.getStyle('margin-left').toInt() + el._newPage.getStyle('margin-right').toInt()) * el.jump;

		el.addEvent('mouseenter', function()
		{
			if(!el.hasClass('on')){
				el.spanOff.Fx.cancel();
				el.spanOff.Fx.start('opacity',0);
			}
		});

		el.addEvent('mouseleave', function()
		{
			if(!el.hasClass('on')){
				el.spanOff.Fx.cancel();
				el.spanOff.Fx.start('opacity',1);
			}
		});

		el.addEvent('click', function()
		{
			if(!el.hasClass('on')){
				_newRCId = el.commonid;
				var spans = $('btn-'+_oldRCId).getElements('span');
				for(i=0; i<spans.length; i++){
					if(spans[i].hasClass('hov')){
						spanHov = spans[i];
					}
					if(spans[i].hasClass('off')){
						spanOff = spans[i];
					}
				}
				spanOff.Fx = new Fx.Tween(spanOff, { duration:400 });
				spanHov.Fx = new Fx.Tween(spanHov, { duration:400 });

				new Fx.Tween($('recette-slide'),
				{
					duration: 400
				}).start('left',-el.jumptorc);

				spanHov.Fx.cancel();
				spanHov.Fx.start('opacity',1);

				spanHov.Fx.addEvent('complete', function(){
					spanOff.setStyle('display','block');
					spanOff.Fx.start('opacity',1);
				 });


				el.spanHov.Fx.start('opacity',0);

				$('btn-'+_newRCId).removeClass('moverc');
				$('btn-'+_newRCId).addClass('on');
				$('btn-'+_oldRCId).removeClass('on');
				$('btn-'+_oldRCId).addClass('moverc');
				_oldRCId = _newRCId;
			}
		});
	}

	//$ Menu droite // infos de la recette // Initialisation de la fonction générale
	$$('.moverc').each(function(el)
	{
		initRecetteBtns(el);
	});

	//$ Menu droite // infos de la recette // Initialisation de la fonction d'initialisation
	initRecetteComs('photo');

  }
});

function getRecette(wid, b)
{
  var b = b || 0;
  new Request(
  {
    method: 'post',
    url: document.mdcgi+'/recettes-detail.mtd',
    onSuccess:function(html)
    {
      $('show-recette').set('html', html);

      $$('.moverc').each(function(el)
    	{
    		initRecetteBtns(el);
    	});
    	initRecetteComs('photo');
    }
  }).send('wid='+wid+'&bcoach='+b);
}