var isOpen = false;
var topLink = 0;
var topMask = 0;
var hauteur = 0;
var hauteurInt = 0;
var hauteurLogo = 73;

window.addEvent('domready', function() {

  var mask = $('inscription_mask');
  var link = $('inscription_link');

  // Top du lien
  topLink = link.getTop();

  // Top du mask (laissant apparaitre le logo)
  topMask = topLink - hauteurLogo;

  // Récupération de la hauteur du mask (avec px puis sans)
  hauteur = mask.getStyle('height');
  hauteurInt = hauteur.toInt();

  // Définition des styles pour le mask
  // -> le top
  // -> la hauteur (pour qu'il soit caché)
  mask.setStyles({'top': topMask});
  mask.setStyles({'height': hauteurLogo});

  // Nouvelle heuteur du mask
  newTopMask = topLink - hauteurInt;

  // Définition de l'effet
  fx = new Fx.Styles(mask, {duration: 500, wait: false});

  // Après validation, si erreur
  // -> isOpen est mis à true dans le kontroleur
  if(isOpen)
    openMask();
    

  link.addEvent('click', function(event) {
  	event = new Event(event);

    if(!isOpen)
    	openMask();
      
    else
      closeMask();

    isOpen = !isOpen;
    
    event.stop();
  });


  function openMask()
  {
    fx.start({
    		'top': newTopMask,
    		'height': hauteurInt
    	});
    $('lien').className='puce_on';
  }
  
  function closeMask()
  {
    fx.start({
  		'top': topMask,
  		'height': hauteurLogo
  	});
    $('lien').className='puce_off';
  }
});