/**
 * Image Slideshow
 * 
 * @author FrHe@edoras, 2006-01-21
 *   
 * @param  elementId         PageId of the RedDot slideshow element
 * @param  placeholderImage  Placeholder image if slideshow is empty
 */   
function slideshow(elementId, placeholderImage)
{
  this.slideshowImages       = new Array();
  this.slideshowImages72dpi  = new Array();
  this.slideshowImages300dpi = new Array();
  this.slideshowDescriptions = new Array();
  this.slideshowPopupLinks   = new Array();

  this.slideshowImages72dpiWidth = new Array();
  this.slideshowImages72dpiHeight = new Array();
  this.slideshowImages300dpiWidth = new Array();
  this.slideshowImages300dpiHeight = new Array();

  this.counter               = 0;
  this.totalImages           = 0;
  this.elementId             = elementId;
  this.placeholderImage      = placeholderImage;


  /**
   * Push an image into the slideshow
   *
   * @param  image        Image filename
   * @param  description  Image description
   * @param  popuplink    Link to the image popup template
   */  
  this.pushImage = function(image, image72dpi, image300dpi, description, popuplink, image72dpiWidth, image72dpiHeight, image300dpiWidth, image300dpiHeight)
  {
    this.slideshowImages.push(image);
    this.slideshowImages72dpi.push(image72dpi);
    this.slideshowImages300dpi.push(image300dpi);
    this.slideshowDescriptions.push(description);
    this.slideshowPopupLinks.push(popuplink);

    this.slideshowImages72dpiWidth.push(parseInt(image72dpiWidth));
    this.slideshowImages72dpiHeight.push(parseInt(image72dpiHeight));
    this.slideshowImages300dpiWidth.push(parseInt(image300dpiWidth));
    this.slideshowImages300dpiHeight.push(parseInt(image300dpiHeight));
  }


  /**
   * Init slideshow after all images were added, load the first image in array
   */     
  this.initSlideshow = function()
  {
    this.totalImages = this.slideshowImages.length;
    if (this.totalImages > 0)
    {
      // Load first picture and properties
      //document.getElementById('MainArticleInBlock' + this.elementId).style.display = 'block';

      this.updateSlideshow(this.elementId, 0);

      // Display slideshow navigation only if there is more than one image
      if (this.totalImages < 2) {
        document.getElementById('GalleryNavigation' + this.elementId).style.display = 'none';
        document.getElementById('border' + this.elementId).className                = '';
        document.getElementById('showallLink' + this.elementId).style.display       = 'none';
      } else {
        document.getElementById('border' + this.elementId).className                = 'image imageSpacer';
      }
    
      // Set total number of images
      document.getElementById('max' + this.elementId).innerHTML     = this.slideshowImages.length;
    }  else {
      document.getElementById('image' + this.elementId).src         = this.placeholderImage;
    }
  }


  /**
   * Loads previous image if current image is not the first slideshow image
   */     
  this.previousImage = function()
  {
    if (this.counter > 0)
    {
      this.counter--;
      this.updateSlideshow(this.elementId, this.counter);
    }
  }


  /**
   * Loads next image if current image is not the last slideshow image
   */     
  this.nextImage = function()
  {
    if (this.counter < this.slideshowImages.length - 1)
    {
      this.counter++;
      this.updateSlideshow(this.elementId, this.counter);
    }
  }


  /**
   * Opens the detail image popup
   * 
   * @param  width   width of the popup window
   * @param  height  height of the popup window         
   */     
  this.zoomImage = function(width, height)
  {
    var popupUrl = (this.slideshowPopupLinks[this.counter] != '') ? this.slideshowPopupLinks[this.counter] : '';
    window.open(popupUrl, 'slideshowPopup', 'width=' + width + ', height='+ height + ', resizable=yes');
  }


  /**
   * Shows "All images" container at the end of the template
   */     
  this.showAllImagesContainer = function()
  {
    document.getElementById('showall' + this.elementId).style.display = 'block';
    document.location.href = '#showall' + this.elementId;
  }


  /**
   * Hides "All images" container at the end of the template
   */     
  this.hideAllImagesContainer = function()
  {
    document.getElementById('showall' + this.elementId).style.display = 'none';
    document.location.href = '#GalleryNavigation' + this.elementId;
  }


  /**
   * Used internally to update the slideshow element
   */
  this.updateSlideshow = function(slideshowItem, itemNumber)
  {
    document.getElementById('image' + slideshowItem).src          = this.slideshowImages[itemNumber];

    var link72dpi  = document.getElementById('image72dpi' + slideshowItem);
    var link300dpi = document.getElementById('image300dpi' + slideshowItem);

    // Check if 300dpi resolution is as big as the 72dpi resolution
    var link300dpiEnable = true;    
    if ( (this.slideshowImages300dpiWidth[itemNumber] != "" || this.slideshowImages72dpiWidth[itemNumber] != "") 
         && 
         (this.slideshowImages300dpiWidth[itemNumber] <= this.slideshowImages72dpiWidth[itemNumber] &&
          this.slideshowImages300dpiHeight[itemNumber] <= this.slideshowImages72dpiHeight[itemNumber])
        )
    {
        link300dpiEnable = false;
    }

    if (link72dpi != null)
    {    
      // Attach 72dpi image to link if image exists
      if (this.slideshowImages72dpi[itemNumber] != '')
      {
        link72dpi.href  =  this.slideshowImages72dpi[itemNumber];
      } else {
        link72dpi.parentNode.removeChild(link72dpi);
      }
    }

    if (link300dpi != null)
    {
      // Attach 300dpi image to link if image exists and image is not a gif
      if (this.slideshowImages300dpi[itemNumber] != '' && this.slideshowImages300dpi[itemNumber].toLowerCase().lastIndexOf('.gif') == -1 && link300dpiEnable )
      {
        link300dpi.href  =  this.slideshowImages300dpi[itemNumber];
        link300dpi.style.position = "static";    
      } else {
        //link300dpi.parentNode.removeChild(link300dpi);
        link300dpi.style.position = "absolute";
        link300dpi.style.left = "-5000px";
      }
    }

    // Display current image number and description
    document.getElementById('akt' + slideshowItem).innerHTML      = itemNumber + 1;
    document.getElementById('text' + slideshowItem).innerHTML     = this.slideshowDescriptions[itemNumber];
    document.getElementById('text' + slideshowItem).style.display = (document.getElementById('text' + slideshowItem).innerHTML == '') ? 'none' : 'block';
  }
}