/* IIP Javascript SlideShow Class
 */
var IIP_SlideShow = new Class({

   Extends: IIPB,
   initialize: function( main_id, options ) {

    this.source = main_id || alert( 'No element ID given to IIP constructor' );
    this.server = options['server'] || '/fcgi-bin/iipsrv.fcgi';
    this.render = options['render'] || 'random';

    this.images = new Array(options['image'].length);
    options['image'] || alert( 'Image location not set in IIP constructor options');
    if( $type(options['image']) == 'array' ){
	for( i=0; i<options['image'].length;i++ ){
	    this.images[i] = { src:options['image'][i], sds:"0,90" };
	}
    }
    else this.images = [{ src:options['image'], sds:"0,90"} ];

    this.credit = options['credit'] || null;
    this.scale = options['scale'] || null;

    if( options['zoom'] == 0 ) this.initialZoom = 0;
    else this.initialZoom = options['zoom'] || 1;
    
    this.showNavButtons = true;
    if( options['showNavButtons'] == false ) this.showNavButtons = false;

    // If we want to assign a function for a click within the image
    // - used for multispectral curve visualization, for example
    this.targetclick = options['targetclick'] || null;
    
    // Extra Options
    this.centerzoom = options['centerzoom'] || null;
    this.hideNav = options['hideNav'] || null;
    this.hideIcon = options['hideIcon'] || null;
    this.randomstart = options['randomstart'] || null;

    // Additional slide show stuff 
    //time between image changes in milliseconds
    this.period = $random((options['period'] * 0.9), (options['period']* 1.1)) || $random((7500 * 0.9), (7500* 1.1));
    // If page runs for more than "10 mins" ("600000" microseconds), 
    // without any interaction, pause it.
    this.timeout = options['timeout'] || 600000;    
    this.maximise = options['maximise'] || null;
    this.hideDetails = options['hideDetails'] || null;
    
    this.slrefresh;
    this.currentObject;
    this.currentRef;
    this.startTime = new Date()
    this.start = this.startTime.getTime();
    // ////////////////////////////////////////////////////////////////////////
    
    this.max_width = 0;
    this.max_height = 0;
    this.min_x = 0;
    this.min_y = 0;
    this.sds = "0,90";
    this.contrast = 1.0;
    this.opacity = 0;
    this.wid = 0;
    this.hei = 0;
    this.rgn_x = 0;
    this.rgn_y = 0;
    this.rgn_w = this.wid;
    this.rgn_h = this.wid;
    this.xfit = 0;
    this.yfit = 0;
    this.navpos = [0,0];
    this.tileSize = [0,0];
    this.num_resolutions = 0;
    this.res;
    this.refresher = null;

    // Number of tiles loaded
    this.nTilesLoaded = 0;
    this.nTilesToLoad = 0;

    /* Load us up when the DOM is fully loaded! 
     */
    window.addEvent( 'domready', function(){  this.load() }.bind(this) );
  },

  iipload: function() {
  
	var d = new Date();
	var ct = d.getTime();
	
  new Request(
    {
	method: 'get',
	url: 'ajax.php?process=slideshow&ct='+ct,
	onComplete: function(transport){
	    var response = transport || alert( "No response from server " + this.server );
	   
			var loc_vals = new Array ();
			eval ('loc_vals = ' + response);
			
			this.images = new Array(1);
      this.images = [{ src:loc_vals['image'], sds:"0,90"} ];
      
			this.server = loc_vals['server'];
	    
	    this.max_width = loc_vals['max_width'];
	    this.max_height = loc_vals['max_height'];

	    this.tileSize[0] = loc_vals['tile_size'];
	    this.tileSize[1] = loc_vals['tile_size'];

	    this.num_resolutions = loc_vals['num_resolution'];
	    this.res = this.num_resolutions;
	    
	    // Credit can be dynamically updated if required.
	    this.credit = loc_vals['credit'];
	    
	    if (this.randomstart != 'fixedzoom')
	      {
	      if (this.res > 3)
  				{this.initialZoom = $random(1, this.res -1);}
				else
  				{this.initialZoom = $random(0, this.res - 1);}
	      }
	    
      this.createWindows();	    
	    
	    if (this.randomstart)
	      {var rx = $random(0, this.wid) - this.rgn_x;
         var ry = $random(0, this.hei) - this.rgn_y;
         this.scrollTo( rx, ry );}
         
      }.bind(this),
	onFailure: function(){ alert('Unable to get image and tile sizes from server!'); }
    } ).send();
  },

/* Use a AJAX request to get the image size, tile size and number of resolutions from the server
   */
  load: function(){
  	
  if (this.maximise)
        {
        var winD = Window.getSize();
	      var winW = winD.x, winH = winD.y;
	    
        $(this.source).style.top = '0px';
	      $(this.source).style.left = '0px';
	      $(this.source).style.height = winH - 4 + 'px';
	      $(this.source).style.width = winW - 4 + 'px';
        }	

  new Element('div', {
    'id': this.source+'_con',
    'class': 'con'
	  }).injectInside($(this.source));
	       
  new Element('img', {
    src: 'images/start.png', 
    'class':'controlIm', 
    'id': this.source+'_controlIm'} ).injectInside(this.source+'_con');
        
  new Element('div', {
	  'id': this.source+'_currentDetails',
	  'class': 'currentDetails'
	  }).injectInside($(this.source));
	       	    
  $(this.source+'_controlIm').addEvent('click', function() {this.imSwitch();}.bind(this));
    
  this.slideShow();
  this.imSwitch(); 
  },  
    
  slideShow: function ()
    {
    if ($(this.source+'_target'))
      {$(this.source+'_target').getChildren().each( function(el) 
		    {el.dispose();});
        $(this.source+'_target').dispose();
        }

	  this.iipload();

		var currentTime = new Date()
    var now = currentTime.getTime();
  
    // If page runs for more than 10 mins (600000 microseconds), 
    // without any interaction, pause it.
    if ((now - this.start) > this.timeout)
      {this.imSwitch();}
    },
      
  imSwitch: function() 
    {
    if (this.hideDetails)
		  {$(this.source+'_controlIm').setStyle('filter', 'alpha(opacity=10)');
       $(this.source+'_controlIm').setStyle('opacity', '0.1');}
       
	  var csrc = $(this.source+'_controlIm').getProperty('src');
	  if (csrc == "images/start.png")
   		{
	    $(this.source+'_currentDetails').setStyle('display', 'none');
	    $(this.source+'_controlIm').setProperty('src', 'images/pause.png');
		 
	    this.slrefresh = (this.slideShow.bind(this)).periodical(this.period);
		    
	    this.startTime = new Date()
      this.start = this.startTime.getTime();
	    }
	  else
		  {
     	$(this.source+'_controlIm').setProperty('src', 'images/start.png');
		  $clear(this.slrefresh);
		  this.refreshDetails();
		  
		  if (this.hideDetails)
		    {}
      else
        {$(this.source+'_currentDetails').setStyle('display', 'block');}
      }
	  },
	    
    refreshDetails: function()
	    {	
	    $(this.source+'_currentDetails').getChildren().each( function(el) 
		    {el.dispose();});

      if (this.currentObject)
        {
	      var tft = new Element("font", {'class': 'h3'});    
        var tftv = document.createTextNode(this.currentObject);
  	      tft.appendChild(tftv);
  	    $(this.source+'_currentDetails').appendChild(tft);
        }
      if (this.currentRef && this.currentObject)
        { 
  	      tft = new Element("br");  
  	    $(this.source+'_currentDetails').appendChild(tft); 
  	      tft = new Element("br");  
  	    $(this.source+'_currentDetails').appendChild(tft); 
        }
      if (this.currentRef)
        {
  	      tft = new Element("font", {'class': 'h3'});    
          tftv = document.createTextNode(''+this.currentRef);
	        tft.appendChild(tftv);
	      $(this.source+'_currentDetails').appendChild(tft);
        }
	    }

});