Diaporama = Class.create();

Diaporama.prototype =
{
  effect: 1 ,
  time: 3000 ,
  current_image: 0 ,
  image: new Array(),
  id_diapo: 'diaporama',
  id_nav: 'nav',
  by_classname: 'image',
  handle: null,
  compteur: false,
  start: true,
  imgNav: {
    previous: 'IMG/previous.png',
    previousOn: 'IMG/previous2.png',
    play: 'IMG/play.png',
    playOn: 'IMG/play2.png',
    pause: 'IMG/pause.png',
    pauseOn: 'IMG/play2.png',
    next: 'IMG/next.png',
    nextOn: 'IMG/next2.png',
    width: '',
    display: 'all',
    refresh: true
  },
  
  // {{{ initialize
  initialize: function(options)
  {
    if( typeof(options.id_diapo) != 'undefined' ) this.id_diapo = options.id_diapo ;
    if( typeof(options.id_nav) != 'undefined' ) this.id_nav = options.id_nav ;
    if( typeof(options.by_classname) != 'undefined' ) this.by_classname = options.by_classname ;
    if( typeof(options.effect) != 'undefined' ) this.effect = options.effect ;
    if( typeof(options.time) != 'undefined' ) this.time = options.time ;
    if( typeof(options.current_image) != 'undefined' ) this.current_image = options.current_image ;
    if( typeof(options.compteur) != 'undefined' ) this.compteur = options.compteur ;
    if( typeof(options.start) != 'undefined' ) this.start = options.start ;
    if( typeof(options.imgNav) != 'undefined' )
    {
      if( typeof(options.imgNav.previous) != 'undefined' ) this.imgNav.previous = options.imgNav.previous ;
      if( typeof(options.imgNav.previousOn) != 'undefined' ) this.imgNav.previousOn = options.imgNav.previousOn ;
      if( typeof(options.imgNav.play) != 'undefined' ) this.imgNav.play = options.imgNav.play ;
      if( typeof(options.imgNav.playOn) != 'undefined' ) this.imgNav.playOn = options.imgNav.playOn ;
      if( typeof(options.imgNav.pause) != 'undefined' ) this.imgNav.pause = options.imgNav.pause ;
      if( typeof(options.imgNav.pauseOn) != 'undefined' ) this.imgNav.pauseOn = options.imgNav.pauseOn ;
      if( typeof(options.imgNav.next) != 'undefined' ) this.imgNav.next = options.imgNav.next ;
      if( typeof(options.imgNav.nextOn) != 'undefined' ) this.imgNav.nextOn = options.imgNav.nextOn ;
      if( typeof(options.imgNav.width) != 'undefined' ) this.imgNav.width = options.imgNav.width ;
      if( typeof(options.imgNav.display) != 'undefined' ) this.imgNav.display = options.imgNav.display ;
      if( typeof(options.imgNav.refresh) != 'undefined' ) this.imgNav.refresh = options.imgNav.refresh ;
    }
  },
  // }}}
  
  // {{{ init
  init: function ()
  {
    var _id_ = document.getElementsByClassName(this.by_classname) ;
	  if(_id_ && ( _id_.length > 1 ) )
	  {
		  this.image = _id_;
		  
	    if( this.current_image > (this.image.length-1) ) this.current_image = 0 ;
	    this.next_image = this.current_image+1;
	    this.prev_image = this.current_image-1;
	    if( this.current_image == (this.image.length-1) ) this.next_image = 0;
	    if( this.current_image == 0 ) this.prev_image = this.image.length-1;
	
		  for(i=0; i < this.image.length; i++)
		  {
			  if( i != this.current_image ) this.image[i].style.display = "none";
  		  this.image[i].style.position = "absolute";
		  }
      if( $(this.id_nav) && this.imgNav.width )
      {
        $(this.id_nav).style.width = this.imgNav.width ;
      }
      
      if( $('cpt-nav') )
      {
        $('cpt-nav').hide();
        if( this.compteur ) $('cpt-nav').show();
      }
      if( $('btn-nav') )
      {
        btnPlay = this.imgNav.play ;
        btnPause = this.imgNav.pause ;
        if( this.imgNav.display == 'all' && this.time > 0 )
        {
          btnPlay = (this.start) ? this.imgNav.playOn : this.imgNav.play;
          btnPause = (this.start) ? this.imgNav.pause : this.imgNav.pauseOn;
        }
        new Insertion.Bottom( $('btn-nav'), '<img id="btn-prev" src="'+this.imgNav.previous+'" alt="precedent" title="Image précédente" style="cursor:pointer;" />');
        new Insertion.Bottom( $('btn-nav'), '<img id="btn-pause" src="'+btnPause+'" alt="pause" title="Diaporama en pause" style="cursor:pointer;" />');
        if( ( ! this.start && this.imgNav.display != 'all' ) || this.time == 0 ) $('btn-pause').hide();
        new Insertion.Bottom( $('btn-nav'), '<img id="btn-play" src="'+btnPlay+'" alt="lecture" title="Diaporama en lecture" style="cursor:pointer;" />');
        if( ( this.imgNav.display != 'all' && this.start ) || this.time == 0) $('btn-play').hide();
        new Insertion.Bottom( $('btn-nav'), '<img id="btn-next" src="'+this.imgNav.next+'" alt="suivant" title="Image suivante" style="cursor:pointer;" />');
        
        $('btn-prev').onclick = this.action_prev.bind(this);
        $('btn-next').onclick = this.action_next.bind(this);
        if( this.time > 0 )
        {
          if( $('btn-pause') ) $('btn-pause').onclick = this.action_pause.bind(this);
          if( $('btn-play') ) $('btn-play').onclick = this.action_play.bind(this);
        }
      }
      
      if( $(this.id_nav) ) $(this.id_nav).show();
      $(this.id_diapo).style.height = this.image[this.current_image].clientHeight+'px';
      this.update_nav();
      
	    if(this.image.length > 1 && this.start ) this.galerie();
	  }
    else
    {
      if( $(this.id_nav) ) $(this.id_nav).hide() ;
    }
  },
  // }}}
  
  // {{{ update_nav
  update_nav: function()
  {
    if( ( this.time == 0 ) && $('btn-prev') && $('btn-next') )
    {
	    if(this.current_image > 0) {
		    $("btn-prev").style.display = "";
	    } else {
		    if( this.imgNav.display != 'all' ) $("btn-prev").style.display = "none";
	    }
	
	    if(this.current_image < (this.image.length-1)) {
		    $("btn-next").style.display = "";
	    } else {
		    if( this.imgNav.display != 'all' ) $("btn-next").style.display = "none";
	    }
	  }
    if( $('cpt-nav') && this.compteur )
    {
      $('cpt-nav').innerHTML = (this.current_image+1)+'/'+this.image.length;
    }
  },
  // }}}
 
  // {{{ galerie
  galerie: function ()
  {
    clearTimeout(this.handle) ;
    this.handle = null ;
    //if( console ) console.log('prev: '+this.prev_image+' - current: '+this.current_image+' - next: '+this.next_image);
    if( this.time > 0 ) this.handle = setTimeout(this.nextimage.bind(this), this.time);
  },
  // }}}
  
  // {{{ nextimage
  nextimage: function ()
  {
    if( this.effect == 0 )
    {
      new Effect.Fade(this.image[this.current_image],
      {
        duration: 0
      });
      new Effect.Appear(this.image[this.next_image],
      {
        duration: 0,
        beforeStart: this.beforeStart.bind(this),
        afterFinish: this.afterFinish.bind(this)
      });
    }
	  if( this.effect == 1 )
	  {
      new Effect.Fade(this.image[this.current_image],
      {
        duration: 0.5
      });
	    new Effect.Appear(this.image[this.next_image],
	    {
        duration: 0.5,
        beforeStart: this.beforeStart.bind(this),
        afterFinish: this.afterFinish.bind(this)
      });
	  }
	  if( this.effect == 2 )
	  {
	    new Effect.BlindUp(this.image[this.current_image],
      {
        duration: 0.5
      });
	    new Effect.BlindDown(this.image[this.next_image],
	    {
        duration: 0.5,
        beforeStart: this.beforeStart.bind(this),
        afterFinish: this.afterFinish.bind(this)
      });
	  }
	
	  if( this.next_image >= (this.image.length-1) )
	  {
		  this.current_image = this.next_image;
		  this.next_image = 0;
		  this.prev_image = this.current_image-1;
	  } else {
		  this.current_image = this.next_image;
		  this.next_image++;
		  if( this.prev_image == (this.image.length-1) ) this.prev_image = 0 ;
		  else this.prev_image++;
		  
	  }
	  this.update_nav();
  	if( this.handle ) this.galerie();
  },
  // }}}
  
  // {{{ previmage
  previmage: function ()
  {
    if( this.effect == 0 )
    {
      new Effect.Fade(this.image[this.current_image],
      {
        duration: 0
      });
      new Effect.Appear(this.image[this.prev_image],
      {
        duration: 0,
        beforeStart: this.beforeStart.bind(this),
        afterFinish: this.afterFinish.bind(this)
      });
    }
	  if( this.effect == 1 )
	  {
      new Effect.Fade(this.image[this.current_image],
      {
        duration: 0.5
      });
	    new Effect.Appear(this.image[this.prev_image],
	    {
        duration: 0.5,
        beforeStart: this.beforeStart.bind(this),
        afterFinish: this.afterFinish.bind(this)
      });
	  }
	  if( this.effect == 2 )
	  {
	    new Effect.BlindUp(this.image[this.current_image],
      {
        duration: 0.5
      });
	    new Effect.BlindDown(this.image[this.next_image],
	    {
        duration: 0.5,
        beforeStart: this.beforeStart.bind(this),
        afterFinish: this.afterFinish.bind(this)
      });
	  }
	
	  if( this.prev_image < 0 )
	  {
		  this.current_image = this.image.length-1;
		  this.prev_image = this.image.length-1;
	  } else {
		  this.current_image = this.prev_image;
		  if( this.prev_image == 0 ) this.prev_image = this.image.length-1 ;
		  else this.prev_image--;
		  if( this.next_image == 0 ) this.next_image = this.image.length-1 ;
		  else this.next_image--;
	  }
	  
	  this.update_nav();
  	if( this.handle ) this.galerie();
  },
  // }}}
  
  // {{{ afterFinish
  afterFinish: function()
  {
    $(this.id_diapo).style.height = this.image[this.current_image].clientHeight+'px';
    if( $(this.id_nav) && this.imgNav.refresh ) $(this.id_nav).toggle();
    //if( $(this.id_nav) ) new Effect.Appear(this.id_nav, { duration: 0.5 });
    if( this.imgNav.display == 'all' )
    {
      $('btn-next').src = this.imgNav.next ; 
      $('btn-prev').src = this.imgNav.previous ; 
    }
  },
  // }}}
  
  // {{{ beforeStart
  beforeStart: function()
  {
    if( $(this.id_nav) && this.imgNav.refresh ) $(this.id_nav).toggle();
    //if( $(this.id_nav) ) new Effect.Fade(this.id_nav, { duration: 0.5 });

  },
  // }}}
  
  // {{{ img
  img: function (dir)
  {
    switch( dir )
    {
      case 'next': 
        if( this.imgNav.display == 'all' ) $('btn-next').src = this.imgNav.nextOn ;
  	    this.nextimage();
        //if( this.imgNav.display == 'all' ) $('btn-next').src = this.imgNav.next ; 
        break;
      case 'previous':
        if( this.imgNav.display == 'all' ) $('btn-prev').src = this.imgNav.previousOn ;
	      this.previmage();
        //if( this.imgNav.display == 'all' ) $('btn-prev').src = this.imgNav.previous ; 
        break;
      case 'pause':
        clearTimeout(this.handle) ;
        this.handle = null ;
        if( $('btn-pause') && this.imgNav.display != 'all' ) $('btn-pause').hide();
        if( $('btn-play') && this.imgNav.display != 'all' ) $('btn-play').show();
        if( this.imgNav.display == 'all' )
        {
          $('btn-pause').src = this.imgNav.pauseOn ;
          $('btn-play').src = this.imgNav.play ;
        }
        break;
      case 'play':
        if( $('btn-play') && this.imgNav.display != 'all' ) $('btn-play').hide();
        if( $('btn-pause') && this.imgNav.display != 'all' ) $('btn-pause').show();
        if( this.imgNav.display == 'all' )
        {
          $('btn-pause').src = this.imgNav.pause ;
          $('btn-play').src = this.imgNav.playOn ;
        }
        this.nextimage();
        this.galerie();
        break
    }
  },
  // }}}
  
  action_prev: function() { this.img('previous'); },
  action_next: function() { this.img('next'); },
  action_pause: function() { this.img('pause'); },
  action_play: function() { this.img('play'); }
  
}
