// Run the slideshow. Must be used with slideshow.php.
function SlideShow(container, images) {
  this._images = images;
  this._currentIndex = 0;
  this._previousIndex = 0;

  var myself = this;
  var containerImgs = container.getElementsByTagName("img");
  for (var i = 0, img; (img = containerImgs[i]); i++) {
    switch (img.id) {
      case "mainImg":
        this._imgNode = img;
        img.onclick = function() { myself.next() };
        break;
      
      case "nextButton":
        img.onclick = function() { myself.next() };
        break;
      
      case "prevButton":
        img.onclick = function() { myself.previous() };
        break;
      
      case "closeButton":
        img.onclick = function() { closeCurrent() };
        break;
    }
  }
  

  this._caption = JsUtil.findNode(container, 'div', 'slideshowCaption'); 

  this._waitOverlay = JsUtil.findNode(container, 'div', 'slideshowOverlay');

  container.onmouseover = function() { CssUtil.addCssClass(this, "over") };
  container.onmouseout = function() { CssUtil.removeCssClass(this, "over") };
  CssUtil.addCssClass(container, "over");
  
  this._setCaption(images[0]);
  images[0].loaded = true;
}

// Show next image
SlideShow.prototype.next = function() {
  if (this._images.length > 1) {
    this._currentIndex = ++this._currentIndex % this._images.length;
    this._show();
  }
};

// Show previous image
SlideShow.prototype.previous = function() {
  if (this._images.length > 1) {
    this._currentIndex = (--this._currentIndex + this._images.length) % this._images.length;
    this._show();
  }
};

// Show the current image
SlideShow.prototype._show = function() {
  this._stopFadeIn();
  this._setOpacity(0);
  var img = this._images[this._currentIndex];
  if (! img.loaded) this._waitOn();
  
  this._previousIndex = this._currentIndex;
  
  var myself = this;
  this._imgNode.onload = function() { myself._startFadeIn() };
  // Timeout avoids unsightly 'flash' in Firefox.
  setTimeout(function() { myself._imgNode.src = img.url }, 1);
  
};

// Show the "loading" message
SlideShow.prototype._waitOn = function() {
  this._waitOverlay.style.display = "block";
};

// Remove the "loading" message
SlideShow.prototype._waitOff = function() {
  this._waitOverlay.style.display = "none";
};

// Start fading a new image in
SlideShow.prototype._startFadeIn = function() {
  var img = this._images[this._currentIndex];
  img.loaded = true;
  this._setCaption(img);
  this._imgNode.height = img.height;
  this._imgNode.width = img.width;
  this._imgNode.style.marginLeft = img.marginLeft + "px";
  this._imgNode.style.border = img.border;

  this._waitOff();
  var myself = this;
  this._timer = setInterval(function() {myself._fadeIn()}, SlideShow.FADE_INTERVAL);
};

// Stop fading an image in
SlideShow.prototype._stopFadeIn = function() {
  clearInterval(this._timer);
  this._timer = null;
};

// Called on an interval to provide the fade-in effect
SlideShow.prototype._fadeIn = function() {
  if (this._currentOpacity >= 100) {
    this._stopFadeIn();
  } else {
    var newOpacity = Math.min(this._currentOpacity + SlideShow.FADE_INCREMENT, 100);
    this._setOpacity(newOpacity);
  }
};

// Set the image opacity
SlideShow.prototype._setOpacity = function(opacity) {
  this._imgNode.style.opacity = opacity/100;
  this._imgNode.style.mozOpacity = opacity/100;
  this._imgNode.style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=" + opacity + ")";
  this._currentOpacity = opacity;
};

// Set the caption
SlideShow.prototype._setCaption = function(img) {
  this._caption.innerHTML = img.caption;
  this._imgNode.title = img.caption;
};

// Initialize all registered slideshows
// Static method
SlideShow.init = function() {
  var containers = document.getElementsByName("slideshowContainer");
  if (containers.length != SlideShow._shows.length) {
    throw "The number of slideshows doesn't match the number of container nodes.";
  }
  
  for (var i = 0; i < SlideShow._shows.length; i++) {
    var show = new SlideShow(containers[i], SlideShow._shows[i]);
  }
};

// Static method to add the parameters for a slideshow to the structure.
SlideShow.addShow = function(images) {
  SlideShow._shows.push(images);
};

SlideShow._shows = [];

SlideShow.FADE_INTERVAL = 40;
SlideShow.FADE_INCREMENT = 5;