var $galerie = new Galerie();

function Galerie() {

  $this = this;

  this.article = null;
  this.idPrecedente = null;
  this.idSuivante = null;
  
  this.div = null;
  this.closeButton = null;
  this.apercu = null;
  this.previousButton = null;
  this.libelle = null;
  this.nextButton = null;


  this.build = function() {
    if(this.div)
      return;
    this.div = document.createElement("DIV");
    this.div.className = "galerieImage";

    var $divCloseButton = document.createElement("DIV");
    $divCloseButton.style.textAlign = "right";
    this.closeButton = document.createElement("IMG");
    this.closeButton.src = "images/close.gif";
    this.closeButton.className = "bouton";
    this.closeButton.onclick = function() { $this.ferme() };

    this.apercu = document.createElement("IMG");
    this.apercu.style.margin = "20px";
    this.apercu.width = 300;
    this.apercu.height = 300;
    this.apercu.onclick = function() { $this.ferme() };

    this.previousButton = document.createElement("IMG");
    this.previousButton.style.marginRight = "30px";
    this.previousButton.src = "images/previous.gif";
    this.previousButton.className = "bouton";
    this.previousButton.onclick = function() { $this.afficheImagePrecedente() };

    this.libelle = document.createElement("FONT");
  
    this.nextButton = document.createElement("IMG");
    this.nextButton.style.marginLeft = "30px";
    this.nextButton.src = "images/next.gif";
    this.nextButton.className = "bouton";
    this.nextButton.onclick = function() { $this.afficheImageSuivante() };
  
    $divCloseButton.appendChild(this.closeButton);
    this.div.appendChild($divCloseButton);
    this.div.appendChild(this.apercu);
    this.div.appendChild(document.createElement("BR"));
    this.div.appendChild(this.previousButton);
    this.div.appendChild(this.libelle);
    this.div.appendChild(this.nextButton);
    document.body.appendChild(this.div);
  }

  this.afficheImage = function($article, $image) {
    this.build();
    if($article)
      this.article = $article;
    this.apercu.src = "images/empty.gif";
    this.apercu.style.background = "transparent url('images/ajax.gif') no-repeat center center";
    this.div.style.display = "block";
    centrer(this.div);
    ajax("sys.galerie.asp?ACTION=IMAGE_INFO&ARTICLE=" + this.article + "&IMAGE=" + $image, null, "$this.ajaxImage(json($result))");
  }

  this.ajaxImage = function($infos) {
    this.apercu.style.background = "";
    this.apercu.src = $infos.url;
    this.apercu.width = $infos.width;
    this.apercu.height = $infos.height;
    this.libelle.innerHTML = $infos.libelle;
    this.idPrecedente = $infos.previous;
    this.previousButton.style.visibility = $infos.previous ? "visible" : "hidden";
    this.idSuivante = $infos.next;
    this.nextButton.style.visibility = $infos.next ? "visible" : "hidden";
    this.div.style.display = "block";
    centrer(this.div);
  }

  this.afficheImagePrecedente = function() {
    if(this.idPrecedente)
      this.afficheImage(null, this.idPrecedente);
  }

  this.afficheImageSuivante = function() {
    if(this.idSuivante)
      this.afficheImage(null, this.idSuivante);
  }

  this.ferme = function() {
    this.div.style.display = "none";
  }

}