/** ImageViewer class, requires jQuery and expected markup on page */

function ImageViewer(images) {
  this.currentImage = 0;
  this.articleImages = images;
  this.confirmButtons();
  var self = this;
  setTimeout(function() { self.preLoadImages(); self.setUpImagePopUp(); }, 250);
}

ImageViewer.prototype.nextImage = function() {
  this.currentImage++;
  this.updateImage();
}
        
ImageViewer.prototype.previousImage = function() {
  this.currentImage--;
  this.updateImage();
}

ImageViewer.prototype.confirmButtons = function() {
  if (this.currentImage < 1) {
    jQuery("#previous").get(0).disabled = true;
  } else {
    jQuery("#previous").get(0).disabled = false;
  }
  if (this.currentImage >= this.articleImages.length - 1) {
    jQuery("#next").get(0).disabled = true;
  } else {
    jQuery("#next").get(0).disabled = false;
  }
}

/** this is new (loading stuff) and needs work */
ImageViewer.prototype.updateImage = function() {
  this.confirmButtons();
  var img = new Image();
  var currentImage = this.articleImages[this.currentImage];
  jQuery("#imageStandard").hide(10, function() {
    jQuery("#image").addClass("imageLoading");
    jQuery(img).load(function() {
	  jQuery(this).hide();
	  jQuery(this).css('display', 'none');
	  jQuery("#image").removeClass("imageLoading");
      jQuery("#imageLink").attr({href: currentImage.filelink, title: currentImage.title});
      jQuery("div.imageCaption > div > span").text(currentImage.title);
	  jQuery("#imageLink").empty().append(this);
	  jQuery(this).show();
    }).attr({id: "imageStandard", src: currentImage.standard, alt: currentImage.title});
  });
}

ImageViewer.prototype.preLoadImages = function() {
  this.confirmPreloadDiv();
  var preload = jQuery("div#preload");
  preload.append('<img src="/images/loading.gif"/>');
  for (var i = 0; i < this.articleImages.length; i++) {
    preload.append('<img src="' + this.articleImages[i].standard +'"/>');
  }
}

ImageViewer.prototype.preLoadPopUpImages = function() {
  this.confirmPreloadDiv();
  var preload = jQuery("div#preload");
  for (var i = 0; i < this.articleImages.length; i++) {
    preload.append('<img src="' + this.articleImages[i].filelink +'"/>');
  }
}

ImageViewer.prototype.preLoadNextPopUpImages = function() {
  this.confirmPreloadDiv();
  var preload = jQuery("div#preload");
  if (this.currentImage > 0) {
    preload.append('<img src="' + this.articleImages[this.currentImage - 1].filelink +'"/>');
  }
  if (this.currentImage < this.articleImages.length - 1) {
    preload.append('<img src="' + this.articleImages[this.currentImage + 1].filelink +'"/>');
  }
}

ImageViewer.prototype.confirmPreloadDiv = function() {
  if (!jQuery("div#preload").get(0)) {
    jQuery("div#articleImages").append('<div id="preload" style="display: none"></div>');
  }
}

ImageViewer.prototype.firstImagePoppedUp = false;

ImageViewer.prototype.setUpImagePopUp = function() {
  jQuery("body").css("style", "position: relative;");
  jQuery("body").prepend('<div id="imagePopUp">'
      + '<div id="popUpImageTitle" style="float: left; margin: 0;"></div>'
      + '<div style="float: right; margin: 0; padding: 5px;"><a href="#" onclick="imageViewer.hideImagePopUp(); return false;" title="close">close</a></div>'
      + '<div id="popUpImage" class="clear"></div></div>'); 
}

ImageViewer.prototype.revealImagePopUp = function() {
  var img = new Image();
  var image = this.articleImages[this.currentImage];

  jQuery("#imagePopUp > div#popUpImage")
    .empty().css('height', image.popUpHeight + 'px')
    .addClass("imageLoading");
  jQuery("#imagePopUp > div#popUpImageTitle").text(image.title);

  jQuery(img).load(function() {
      jQuery(this).hide().css('display', 'none');
      jQuery("#imagePopUp > div#popUpImage").removeClass("imageLoading").append(this);
      jQuery(this).fadeIn();
    }).attr({src: image.filelink, alt: image.title, height: image.popUpHeight});

  var self = this;
  jQuery("#imagePopUp").fadeIn("slow", function() {
      setTimeout(function() { self.preLoadNextPopUpImages(); }, 250);
    });
}

ImageViewer.prototype.hideImagePopUp = function() {
  jQuery("#imagePopUp").fadeOut("slow");
}