var ACS_ModalPopup = Class.create({
  initialize: function(content_id, params) {
    this.params = params;
    
    // --------------------------------------------------------
    // Paramètres possibles :
    // --------------------------------------------------------
      /*
        content_id // /!\ Obligatoire : identifiant du popup "contenu"
        // Tout le reste est facultatif
        {
          contentPositionTop: 0,        // Si l'on souhaite préciser une position en dur, ne sera jamaus replacé automatiquement. - DEFAUT : centré (y compris scroll et resize)
          contentPositionLeft: 0,       // Si l'on souhaite préciser une position en dur, ne sera jamaus replacé automatiquement. - DEFAUT : centré (y compris scroll et resize)
          backgroundColor: '#FF0000',   // Couleur à appliquer au fond transparent - DEFAUT : #000000
          autoDetectCloseLinks: true,   // Détection automatique des liens pour fermer le popup - DEFAUT : non
          backgroundZIndex: 500,         // z-index du background transparent. à mettre tout en haut (le contenu du popup prendras cette valeur + 1000) - DEFAUT : 9999
          backgroundTransparency : 0.5  // Degré de transparence du fond de la popup
          hasVisualEffects : true       // Est-ce qu'on gère les jolis effets ou non ?
        }
      */
    
    // Définit l'élément à afficher dans le popup transparent
      this.modalContent = $(content_id);
    
    // Si le paramètre autoDetectCloseLinks a été passé et vaut true,
    // on lance des observers sur le click sur tout les éléments ayant la classe "acs_modal_popup_close_link"
      if ((this.isSet(this.params.autoDetectCloseLinks)) && (this.params.autoDetectCloseLinks == true)) {
        this.modalContent.select('.acs_modal_popup_close_link').each(function(close_link) {
          close_link.observe('click', this.close_popup.bind(this));
        }.bind(this));
      }
    
    // Observe le resize pour MAJ les dimensions d'affichage
      this.timerForResize = null;
      Event.observe(window, 'resize', this.timerForUpdateDisplaySizeAndPositionModalContent.bind(this));

    // Observe le scroll pour MAJ de la position du contenu
      Event.observe(window, 'scroll', this.positionModalContent.bind(this));
    
    // Paramètres du BG transparent
      this.transparentBackgroundHeight = this.getPageHeight();
      this.transparentBackgroundWidth = this.getPageWidth();
      this.transparentBackgroundId = 'ModalBoxTransparentBackground';
      this.transparentBackgroundColor = this.isSet(this.params.backgroundColor)  ? this.params.backgroundColor : '#000000';
      this.transparentBackgroundZIndex = this.isSet(this.params.backgroundZIndex)  ? this.params.backgroundZIndex : 9999;
      this.hasVisualEffects = this.isSet(this.params.hasVisualEffects)  ? this.params.hasVisualEffects : true;
      
      // Hack pour le fade() : si la valeur est à zéro (un vrai zéro), scriptaculous a un bug
      if (this.params.backgroundTransparency == 0) {
        this.params.backgroundTransparency = 0.00001;
      }
      
      this.transparentBackgroundTransparency = this.isSet(this.params.backgroundTransparency)  ? this.params.backgroundTransparency : 0.5;
      this.transparentBackgroundTransparencyBrowserSpecific = Math.round(this.transparentBackgroundTransparency * 100);
    
    // Récupère les dimensions de la zone visible de la page
      this.displayWidth = 0;
      this.displayHeight = 0;
    
    // Variable qui stoque si la popup est visible ou non
    // Evite de s'embêter avec les observers quand c'est caché
      this.popupIsVisible = false;
    
    // Insère le BG transparent une fois pour toute lors de l'initialisation
      this.insertTransparentBackground();
  },
  
  // Affiche la popup + le BG transparent
  open_popup: function() {
    this.popupIsVisible = true;
    
    this.setTransparentBackgroundColor();
    
    // BG
      this.setBackgroundTransparent();
      $(this.transparentBackgroundId).show();
      $(this.transparentBackgroundId).style.width = this.transparentBackgroundWidth + 'px';
      $(this.transparentBackgroundId).style.height = this.transparentBackgroundHeight + 'px';
    // Content
      this.updateDisplaySizeAndPositionModalContent();

      if (this.hasVisualEffects) {
        this.modalContent.appear();
      } else {
        this.modalContent.show();
      }
  },
  
  // Ferme la popup + le BG transparent
  close_popup: function() {
    this.popupIsVisible = false;
    
    if (this.hasVisualEffects) {
      new Effect.Parallel(
        [
          $(this.transparentBackgroundId).fade(), 
          this.modalContent.fade()
        ], 
        { 
          sync: true
        }
      );
    } else {
      $(this.transparentBackgroundId).hide(), 
      this.modalContent.hide()
    }
  },
  
  // Timer lors du resize pour replacer le contenu à la bonne position
  // Le timer est obligatoire à cause d'IE 6 qui lance l'event resize nimporte quand (boucles infinies)
  // Comme le timer est annulé quand un nouvel évènement se produit, on ne le lance au final que lorsqu'il n'y a plus d'events en boucle
  // /!\ Eviter une durée trop courte pour que les events ne se succèdent pas...
  timerForUpdateDisplaySizeAndPositionModalContent: function() {
    if (this.popupIsVisible == true) {
      window.clearTimeout(this.timerForResize);
      this.timerForResize = setTimeout(this.updateDisplaySizeAndPositionModalContent.bindAsEventListener(this), 200);
    }
  },
  
  // Mets à jour les dimensions de l'affichage, et replace le contenu de la popup
  updateDisplaySizeAndPositionModalContent: function() {
    this.updateDisplaySize();
    this.positionModalContent();
  },
  
  // Mets à jour les dimensions de la zone visible de la page
  updateDisplaySize: function() {
 
    if (self.innerHeight) {
      this.displayWidth = self.innerWidth;
      this.displayHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) {
      this.displayWidth = document.documentElement.clientWidth;
      this.displayHeight = document.documentElement.clientHeight;
    } else if (document.body) {
      this.displayWidth = document.body.clientWidth;
      this.displayHeight = document.body.clientHeight;
    }
  },
  
  // Se charge de positionner le contenu de la popup
  // Affiche le contenu centré dans la page, quel que soit le scroll;
  positionModalContent: function() {
    if (this.popupIsVisible == true) {
      // Récupère les dimensions de la popup à afficher
        var elementDimensions = this.modalContent.getDimensions();
        var elementWidth = elementDimensions.width;
        var elementHeight = elementDimensions.height;
      
      // Récupère le scroll
        var scrollDimensions = document.viewport.getScrollOffsets();
        var scrollLeft = scrollDimensions.left;
        var scrollTop = scrollDimensions.top;

      // Calcule la position de l'élément
        var elementPositionTop = this.isSet(this.params.contentPositionTop)  ? this.params.contentPositionTop : Math.round((this.displayHeight - elementHeight) / 2) + scrollTop;
        var elementPositionLeft = this.isSet(this.params.contentPositionLeft)  ? this.params.contentPositionLeft : Math.round((this.displayWidth - elementWidth) / 2) + scrollLeft;
      
      // Définit la position de l'élément en fonction des infos calculées au dessus
        this.modalContent.setStyle({
          zIndex: this.transparentBackgroundZIndex + 1000,
          position: 'absolute',
          top: elementPositionTop + 'px',
          left: elementPositionLeft + 'px'
        });
    }
  },
  
  // Insére la trame grise transparente servant de fond au popup
  insertTransparentBackground: function() {
    // Si le BG n'existe pas encore, on le crée, et on l'insère immédiatement après le <body>
    // Sinon, on ne fait rien (permets d'utiliser plusieurs popups différents sur une même page sans recréer à chaque fois ce BG)
    if (!$(this.transparentBackgroundId)) {
      // Créé l'élément avec les bons styles
        var div_transparent_bg = new Element('div', {id: this.transparentBackgroundId});
        div_transparent_bg.setStyle({
          margin: '0',
          padding: '0',
          border: '0',
          width: this.transparentBackgroundWidth + 'px',
          height: this.transparentBackgroundHeight + 'px',
          zIndex: this.transparentBackgroundZIndex,
          position: 'absolute',
          top: 0,
          left: 0,
          display: 'none'
        });
      
      // Insère l'élément dans la page
        $(document.body).insert({top: div_transparent_bg});
    }
  },
  
  // Change la couleur du BG transparent appellé à chaque ouverture de la popup, permets d'avoir plusieures couleurs différentes selon la popup, avec un seul et même div pour le BG
  setTransparentBackgroundColor: function() {
    $(this.transparentBackgroundId).setStyle({
      backgroundColor: this.transparentBackgroundColor
    });
  },
  
  // Passe le background en transparent.
  // A appeller avant chaque affichage de la popup (IE 6 reset la transparence à cause du fade())
  setBackgroundTransparent: function() {
    $(this.transparentBackgroundId).setStyle({
        '-moz-opacity': this.transparentBackgroundTransparency,                                   /* Old Mozilla & Netscape */
        opacity: this.transparentBackgroundTransparency,                                          /* Standard CSS */
        '-khtml-opacity': this.transparentBackgroundTransparency,                                  /* Safari 1.x */
        'filter': 'alpha(opacity=' + this.transparentBackgroundTransparencyBrowserSpecific + ')'   /* IE */
      });
  },

  // Récupère la hauteur totale du contenu, quel que soit le navigateur
  getPageHeight: function() {
    // FFX
      var height = document.documentElement.scrollHeight;
    // IE 7 + Opera with "min window"
      if(document.documentElement.clientHeight > height ) {
        height  = document.documentElement.clientHeight;
      }
    // Safari
      if(document.body.scrollHeight > height) {
        height = document.body.scrollHeight;
      }
    
    return height;
  },
  
  // Récupère la largeur totale du contenu, quel que soit le navigateur
  getPageWidth: function() {
    // FFX
      var width = document.documentElement.scrollWidth;

    // IE 7 + Opera with "min window"
      if(document.documentElement.clientWidth > width ) {
        width  = document.documentElement.clientWidth;
      }
    // Safari
      if(document.body.scrollWidth > width) {
        width = document.body.scrollWidth;
      }

    return width;
  },
  
  // Teste si une variable est définie ou non
  isSet: function(var_content) {
    if (typeof(var_content) == 'undefined') {
      return false;
    } else {
      return true;
    }
  }
});