var Lightbox = {
  callbacks: {},
  registerCallback: function( eventType, callback ) {
    Lightbox.callbacks[ eventType ] = callback;
  },
  fire: function( eventType ) {
    if ( typeof Lightbox.callbacks[ eventType ] == 'undefined' || Lightbox.callbacks[ eventType ] == null )
      return false;
    Lightbox.callbacks[ eventType ]();
  },

  updateSize: function() {
    var lightbox = document.getElementById( 'lightbox' );
    if ( lightbox ) {
      var win_w, win_h, doc_w, doc_h;
      doc_w = DocumentDimension.getDocumentWidth();
      doc_h = DocumentDimension.getDocumentHeight();

      var size_w = doc_w;
      if ( lightbox.__screen.__image_area.offsetWidth )
        size_w = Math.max( lightbox.__screen.__image_area.offsetWidth, size_w );
      var size_h = doc_h;
      if ( lightbox.__screen.__image_area.offsetHeight )
        size_h = Math.max( lightbox.__screen.__image_area.offsetHeight, size_h );

      Lightbox.resizeLightbox( lightbox, size_w, size_h );
      Lightbox.centerLightbox( lightbox, size_w, size_h );
    }
  },
  resizeLightbox: function( lightbox, width, height ) {
    lightbox.style.width = lightbox.__opacity.style.width = width + 'px';
    lightbox.style.height = lightbox.__opacity.style.height = height + 'px';
  },
  centerLightbox: function( lightbox, width, height ) {
    var new_x = ( width / 2 ) - ( lightbox.__screen.__image_area.offsetWidth / 2 );
    var new_y = ( height / 2 ) - ( lightbox.__screen.__image_area.offsetHeight / 2 );
    lightbox.__screen.__image_area.style.top = new_y + 'px';
    lightbox.__screen.__image_area.style.left = new_x + 'px';
  },

  //  Callback appelée lorsque l'image à afficher est complètement téléchargée
  onImageLoaded: function( loadedImage, lightbox, imageLegendText ) {
    //  On insère l'image
    var image = document.createElement( 'img' );
    image.src = loadedImage.src;
    lightbox.__screen.__image_area.appendChild( image );

    //  On insère un bouton "fermer"
    new ImagePreloader( 'pix/boutons/fermer.gif', function( closeImage ) {
      var close = document.createElement( 'img' );
      close.id = 'lightbox_close';
      close.src = 'pix/boutons/fermer.gif';
      close.style.background = 'transparent';
      close.style.top = ( loadedImage.height - closeImage.height ) + 'px';
      close.style.left = ( loadedImage.width - closeImage.width ) + 'px';
      lightbox.__screen.__image_area.appendChild( close );
    } );

    //  On insère la légende
    if ( imageLegendText != null ) {
      var legend_area = document.createElement( 'div' );
      legend_area.id = 'lightbox_image_legend';

      var legend_text = document.createElement( 'span' );
      legend_text.id = 'lightbox_image_legend_text';
      legend_text.appendChild( document.createTextNode( imageLegendText ) );

      legend_area.appendChild( legend_text );
      lightbox.__screen.__image_area.appendChild( legend_area );
    }

    Lightbox.fire( 'onOpen' );

    //  On affiche la lightbox
    lightbox.__screen.__preload_panel.style.display = 'none';
    lightbox.__screen.__image_area.style.display = 'block';

    Lightbox.updateSize();
  },

  showPicture: function( imgFilepath, imgLegend ) {
    var lightbox = document.getElementById( 'lightbox' );
    if ( !lightbox ) {
      var windowHeight = DocumentDimension.getWindowHeight();

      //  Conteneur global
      lightbox = document.createElement( 'div' );
      lightbox.id = 'lightbox';
      lightbox.style.height = windowHeight + 'px';

      //  Conteneur Opacité
      lightbox.__opacity = document.createElement( 'div' );
      lightbox.__opacity.id = 'lightbox_opacity';
      lightbox.__opacity.style.height = windowHeight + 'px';
      lightbox.appendChild( lightbox.__opacity );

      //  Conteneur Principal
      lightbox.__screen = document.createElement( 'div' );
      lightbox.__screen.id = 'lightbox_screen';
      lightbox.appendChild( lightbox.__screen );

      //  Zone d'affichage de l'image et de la légende associée
      lightbox.__screen.__image_area = document.createElement( 'div' );
      lightbox.__screen.__image_area.id = 'lightbox_image_area';
      lightbox.__screen.__image_area.style.display = 'none'; //  display = 'block' ne fonctionne pas avec opéra si le display: 'none' apparaît dans la css, on masque donc en script
      lightbox.__screen.appendChild( lightbox.__screen.__image_area );

      //  Panneau de chargement
      lightbox.__screen.__preload_panel = document.createElement( 'img' );
      lightbox.__screen.__preload_panel.id = 'lightbox_preload';
      lightbox.__screen.__preload_panel.src = '/pix/loading.gif';
      lightbox.__screen.__preload_panel.style.top = ( ( windowHeight / 2 ) - 200 ) + 'px';
      lightbox.__screen.__preload_panel.style.left = ( ( DocumentDimension.getWindowWidth() / 2 ) - 200 ) + 'px';
      lightbox.__screen.appendChild( lightbox.__screen.__preload_panel );

      lightbox.onclick = function( e ) {
        this.style.display = 'none';
        Lightbox.fire( 'onClose' );
      }

      document.getElementsByTagName( 'body' )[ 0 ].appendChild( lightbox );
    } else {
      //  On supprime le contenu de la zone d'affichage
      while( lightbox.__screen.__image_area.childNodes.length )
        lightbox.__screen.__image_area.removeChild( lightbox.__screen.__image_area.firstChild );
      lightbox.style.display = 'block';
      lightbox.__screen.__image_area.style.display = 'none';
    }

    lightbox.__screen.__preload_panel.style.display = 'block';
    new ImagePreloader( imgFilepath, Delegate.create( Lightbox, 'onImageLoaded', lightbox, imgLegend ) );
  }
}

addListener( window, 'resize', function( e ) { Lightbox.updateSize(); } );
addListener( window, 'scroll', function( e ) { Lightbox.updateSize(); } );