function slide(src,link,text,target,attr) {
  // Function for SPIRIT slideshow constructor

  // Image url link
  this.src = src;

  // Link url for info
  this.link = link;

  // SPIRIT description text
  this.text = text;

  // html target for window _blank for new, _self etc for others
  this.target = target;

  // This param can be set if you want to auto-play the slideshow
  // Duration of each slide on autoplay is declared in milliseconds
  // integer value declaration
  // this.timeout = 3000

  // this.attr declares the attributes for the window where the image is displayed
 
  this.attr = attr;

  // create an image object for the slide object above
  if (document.images) {
    this.image = new Image();
  }

  // Flag to indicate when load() has already been called [loaded]
  this.loaded = false;

  //=====================================================================
  
  this.load = function() {
    // Method to load image into slideobject

    if (!document.images) { return; }

    if (!this.loaded) {
      this.image.src = this.src;
      this.loaded = true;
    }
  }

  //=====================================================================
  
  this.hotlink = function() {
    // method jumps to image link
	// depending on the this.attr you can open a new window for e.g

    var mywindow;

    // if the slide object does not have a link - when clicked by user - no action
    if (!this.link) return;

    // option to open the link in a new _blank window
    if (this.target) {

      // If window attributes are specified,
      // use them to open the new window
      if (this.attr) {
        mywindow = window.open(this.link, this.target, this.attr);
  
      } else {
        // If window attributes are not specified, do not use them
        // (this will copy the attributes from the originating window)
        mywindow = window.open(this.link, this.target);
      }

      // Pop the window to the front
      if (mywindow && mywindow.focus) mywindow.focus();

    } else {
      // Open the link in the current window
      location.href = this.link;
    }
  }
}

//=================================================================================
// SPIRIT slideshow function - object that displays individial slides
//=================================================================================

function slideshow (slideshowname) {
  // this function constructs the slideshow object
  // called whenever you create a new object for the slideshow
  // SPIRIT = new slideshow("SPIRIT");

  // Showcase Slideshow Name call
  this.name = slideshowname;

  // we have 2 options for this param, false and true
  // the slideshow will loop if this is set to TRUE
  this.repeat = true;

  //  parameter to declare how many images are pre-fetched (loaded] into the client browser cache
  // -1 = preload all images
  //  0 = load each image as slide is loaded
 
  this.prefetch = 0;

  // declare in template for e.g document.images.SPIRIT_IMAGE
  this.image;

  // declares the div id - this script uses div tags to display the slide text that accompany each slide
  // once this variable is set it is then declared in the application template for the slideshow
  // after this variable is called,  the update () method is then called so that the slideshow display is updated on the client browser
  this.textid;

  // set if compatibility for older [pre NS 4] browsers or people without js turned on
  this.textarea;

  // Parameter that sets the timeout duration between slides
  // declared in milliseconds [1000ms = 1 sec]
  this.timeout = 4500;

  this.slides = new Array();
  this.current = 0;
  this.timeoutid = 0;

  //=====================================================================
  // slideshow primary method declarations
  //=====================================================================
  this.add_slide = function(slide) {
    
	// this adds an individual slide to the main slideshow
  
    var i = this.slides.length;
  
    // preload a slide if needed
	// again -1 to preload all, 0 to preload none i.e the images are loaded when the user loads the next image
    if (this.prefetch == -1) {
      slide.load();
    }

    this.slides[i] = slide;
  }

  //=====================================================================
  
  this.play = function(timeout) {
    
	// this method enables the slideshow to be auto-played
	// currently won't be used
    // if timeout param is set then a new default timeout will be set for the slideshow
 
    // checks whether slideshow is currently playing
    this.pause();
  
    // if timeout parameter is called above in application template
	// then set as new slide timeout
    if (timeout) {
      this.timeout = timeout;
    }
  
    // if the current slide has a timeout param declared use that
    // if not then use the default timeout duration
    if (typeof this.slides[ this.current ].timeout != 'undefined') {
      timeout = this.slides[ this.current ].timeout;
    } else {
      timeout = this.timeout;
    }

    // once the timeout parameter has been called
	// then call this.loop()
    this.timeoutid = setTimeout( this.name + ".loop()", timeout);
  }

  //=====================================================================
  
  this.pause = function() {
    // this method pauses the current slide depending on the timeout duration declared above
  
    if (this.timeoutid != 0) {

      clearTimeout(this.timeoutid);
      this.timeoutid = 0;

    }
  }

  // update function
  this.update = function() {
    // this method updates the image in the slideshow

    // check whether the slideshow has been initialised correctly
    if (! this.valid_image()) { return; }
  
    // call pre-update hook function if we declared one in  application template
    if (typeof this.pre_update_hook == 'function') {
      this.pre_update_hook();
    }

    // conv variable for current slide
    var slide = this.slides[ this.current ];

    // check whether client browser can detect js filters
	// fade etc
	// if CB does support set dofilter to true
	// if CB doesn't support set dofilter to false
    var dofilter = false;
    if (this.image &&
        typeof this.image.filters != 'undefined' &&
        typeof this.image.filters[0] != 'undefined') {

      dofilter = true;

    }

    // load the image if required for the checkbox on CE
    slide.load();
  
    // apply the transition filter, if supported by client browser
    if (dofilter) {

      // looks at template for transition name
	  // use fade transition for IE
	  // other browsers do not use filter
      // set transition filter now
      if (slide.filter &&
          this.image.style &&
          this.image.style.filter) {

        this.image.style.filter = slide.filter;

      }
      this.image.filters[0].Apply();
    }

    // update with next image in slideshow
    this.image.src = slide.image.src;

    // display the image transition
    if (dofilter) {
      this.image.filters[0].Play();
    }

    // update display text for image
	// text will be description
	// this is automated via xml data grab
    this.display_text();

    // Call post-update hook function if declared
    if (typeof this.post_update_hook == 'function') {
      this.post_update_hook();
    }

    // is there a requirement to preload slideshow images
	// if so load if prefetch value is greater than 0 or -1
    if (this.prefetch > 0) {

      var next, prev, count;

      // load the next slide images into the CB cache
      next = this.current;
      prev = this.current;
      count = 0;
      do {

        // get next and previous slide number (integer value id)
        // if needed loop at end of slideshow
        if (++next >= this.slides.length) next = 0;
        if (--prev < 0) prev = this.slides.length - 1;

        // preload the current slide image into the slideshow call
        this.slides[next].load();
        this.slides[prev].load();

        // loop around method until all images have been preloaded
		// stop when count = slide count

      } while (++count < this.prefetch);
    }
  }

  //=====================================================================
  this.goto_slide = function(n) {
    // this method goes to a specific slide dependent on the number that is specified
    // -1 jumps to last slide, conversely 0 jumps to starting slide
  
    if (n == -1) {
      n = this.slides.length - 1;
    }
  
    if (n < this.slides.length && n >= 0) {
      this.current = n;
    }
  
    this.update();
  }


  //=====================================================================
  this.goto_random_slide = function(include_current) {
    // picks random slide and image to display if required
    // If the include_current parameter is set to true
    // then set the shuffle parameter if required
    // shuffle()

    var i;

    // random and shuffle parameters can only be used if there is more than one slide
    if (this.slides.length > 1) {

      // generate slide number for random slide
      do {
        i = Math.floor(Math.random()*this.slides.length);
      } while (i == this.current);
 
      // go to and show slide
      this.goto_slide(i);
    }
  }

  //=====================================================================
  
  this.next = function() {
    // this method enables form button clicks to call 'next' image in the slideshow
	// user will click on 'next' button and the slideshow moves on

    // increment image number by 1 per slide
    if (this.current < this.slides.length - 1) {
      this.current++;
    } else if (this.repeat) {
      this.current = 0;
    }

    this.update();
  }

  //=====================================================================
  
  this.previous = function() {
    // this method enables form button clicks to call 'previous' image in the slideshow
  
    // Decrement the image number
    if (this.current > 0) {
      this.current--;
    } else if (this.repeat) {
      this.current = this.slides.length - 1;
    }
  
    this.update();
  }

  //=====================================================================
  
  this.shuffle = function() {

    var i, i2, slides_copy, slides_randomized;

    // copy array that contains the slides
    // sequential order
    slides_copy = new Array();
    for (i = 0; i < this.slides.length; i++) {
      slides_copy[i] = this.slides[i];
    }

    // randomize slide order to display random for each page visit
    slides_randomized = new Array();

    do {

      // Pick a random slide from those that remain that have not yet been displayed
      i = Math.floor(Math.random()*slides_copy.length);

      // add the slide to the end of the randomized array
      slides_randomized[ slides_randomized.length ] =
        slides_copy[i];

      // remove slide from the sequential array,
      // so that on this pass it will not be displayed again until the last slide image has been shown in the slideshow
      for (i2 = i + 1; i2 < slides_copy.length; i2++) {
        slides_copy[i2 - 1] = slides_copy[i2];
      }
      slides_copy.length--;

      // loop around till we removed all slides
	  // by doing this the slideshow can start over

    } while (slides_copy.length);

    // now set the slides to the randomized array
    this.slides = slides_randomized;
  }

  //=====================================================================
  
  this.get_text = function() {
    // get text of next slide
  
    return(this.slides[ this.current ].text);
  }

  //=====================================================================
  
  this.get_all_text = function(before_slide, after_slide) {
    // return the ShortDescriptor xml field text for all remaining slides
   all_text = "";
  
    // Loop through all the slides in the slideshow
    for (i=0; i < this.slides.length; i++) {
  
      slide = this.slides[i];
    
      if (slide.text) {
        all_text += before_slide + slide.text + after_slide;
      }
  
    }
  
    return(all_text);
  }

  //=====================================================================
  
  this.display_text = function(text) {
    // displays text description for current slide only
  
    // get the description text from the slideshow
    if (!text) {
      text = this.slides[ this.current ].text;
    }
  
    // if textarea tag is to be used for non js supported browsers
    // then change the text displayed within textarea
    if (this.textarea && typeof this.textarea.value != 'undefined') {
      this.textarea.value = text;
    }

   // if text id has been declared
   // get the elements id
    if (this.textid) {

      r = this.getElementById(this.textid);
      if (!r) { return false; }
      if (typeof r.innerHTML == 'undefined') { return false; }

      // update text in textarea html markup
      r.innerHTML = text;
    }
  }

  //=====================================================================
  
  this.hotlink = function() {
    // calls hotlink method for the current slide
	// calls image into slideshow
  
    this.slides[ this.current ].hotlink();
  }

  //=====================================================================
  
  this.save_position = function(cookiename) {
    // saves position of the slideshow in a cookie
	// set cookie to save current location in slideshow, ie what the current slide and id is
  
    if (!cookiename) {
      cookiename = this.name + '_slideshow';
    }
  
    document.cookie = cookiename + '=' + this.current;
  }

  //=====================================================================
  
  this.restore_position = function(cookiename) {
  // if slideshow_save_position() parameter was called,
  // return the slideshow to the previous state.
  
  // set cookie if required for slideshow image position
  
    if (!cookiename) {
      cookiename = this.name + '_slideshow';
    }
  
    var search = cookiename + "=";
  
    if (document.cookie.length > 0) {
      offset = document.cookie.indexOf(search);
      // if cookie exists
      if (offset != -1) { 
        offset += search.length;
        // set index of beginning of value
        end = document.cookie.indexOf(";", offset);
        // set index of end of cookie value
        if (end == -1) end = document.cookie.length;
        this.current = parseInt(unescape(document.cookie.substring(offset, end)));
        }
     }
  }

  //=====================================================================
  
  this.noscript = function() {
    // call this method to get plain html output file of the slideshow if needed
	// not currently used
  
    $html = "\n";
  
    // Loop through all the slides in the slideshow
    for (i=0; i < this.slides.length; i++) {
  
      slide = this.slides[i];
  
      $html += '<P>';
  
      if (slide.link) {
        $html += '<a href="' + slide.link + '">';
      }
  
      $html += '<img src="' + slide.src + '" ALT="SPIRIT Product Showcase">';
  
      if (slide.link) {
        $html += "<\/a>";
      }
  
      if (slide.text) {
        $html += "<BR>\n" + slide.text;
      }
  
      $html += "<\/P>" + "\n\n";
    }
  
    // Make the HTML browser-safe
    $html = $html.replace(/\&/g, "&amp;" );
    $html = $html.replace(/</g, "&lt;" );
    $html = $html.replace(/>/g, "&gt;" );
  
    return('<pre>' + $html + '</pre>');
  }

  //=====================================================================
  // Private methods
  //=====================================================================
  
  this.loop = function() {
    // method gets called automatically
	// advances to next slide in the slideshow
	// then sets timeout for slide
    // when next slide is loaded, if this is not done yet
	// the next slideshow image will not be showed

    // checks whether the current slideshow image has finished loading or not
    if (this.current < this.slides.length - 1) {
      next_slide = this.slides[this.current + 1];
      if (next_slide.image.complete == null || next_slide.image.complete) {
        this.next();
      }
    } else {
		
      // when at last slide
	  // call next
      this.next();
    }
    
    // when confirmed continue to play slideshow
    this.play();
  }

  //=====================================================================
  
  this.valid_image = function() {
    // Returns 1 if a valid image has been set for the slideshow
  
    if (!this.image)
    {
      return false;
    }
    else {
      return true;
    }
  }

  //=====================================================================
  
  this.getElementById = function(element_id) {
    // This method returns the element corresponding to the id
	// simple get by element id for layers and divs

    if (document.getElementById) {
      return document.getElementById(element_id);
    }
    else if (document.all) {
      return document.all[element_id];
    }
    else if (document.layers) {
      return document.layers[element_id];
    } else {
      return undefined;
    }
  }
}