var ImageRotator = Class.create({
    delay: 3000,
    currentSlide : 0,
    pause: false,
    
    initialize : function () {
        if($('image-rotator')){
          this.lis = $('image-rotator').getElementsByTagName('li');
          var width=0;
          var height = 0;
          if(this.lis.length>0){
            this.imageWidth = this.lis[0].clientWidth;
            this.imageHeight = this.lis[0].clientHeight;
            this.containerWidth = (this.lis.length+1) * Element.getWidth(this.lis[0]);
            this.containerHeight = this.lis[0].clientHeight;
          }
        
          slide_container = $('image-rotator').getElementsBySelector('ul')[0];
          slide_container.setStyle({width:this.containerWidth+'px', height:this.containerHeight+'px'}); 
          Event.observe('image-rotator','mouseover', (function (){this.pause = 1;}).bind(this));
          Event.observe('image-rotator','mouseout', (function() {this.pause=0;}).bind(this));
          this.slide_container = slide_container;
          this.addImageLinks();
    }
        
  },
  addImageLinks : function(){
    if($('image-rotator')){
      var rotator = $('image-rotator');
      var slideLinks = new Element('div', {'class':'slide-link-container'});
      for(var i=this.lis.length-1;i>=0; i--){
        var slideLink = new Element('a', { 'class':'control', 'id':'slide-control-link-'+i});
        slideLink.observe('click', (function (event){
            var slideNo = event.target.id.split('-')[event.target.id.split('-').length-1];
            this.moveToSlide(slideNo);}).bind(this));
        slideLinks.insert(slideLink);
      }
      rotator.insert(slideLinks);
    }
  },

  start : function () {
        if($('image-rotator')){
          this.currentSlide = 0;
          //this.timer = setTimeout(this.move.bind(this), this.delay);
          this.moveToSlide(0);
        }
  },

  move : function(){ 
    if (!this.pause) {
       this.moveToSlide(this.currentSlide+1);
    }
    else{
      this.timer = setTimeout(this.move.bind(this), this.delay);
    }
  },

  moveToSlide : function (toSlide){
    if(!this.motion){
      clearTimeout(this.timer);
      if(toSlide>=this.lis.length)
        toSlide=0;
      this.toSlide = toSlide;
      var move = (this.currentSlide - toSlide)*this.imageWidth;

      new Effect.Move(this.slide_container, { x: move, beforeStart:this.beforeStart.bind(this),afterFinish:this.afterFinish.bind(this)});

      this.timer = setTimeout(this.move.bind(this), this.delay);
    }

  },
  
  beforeStart: function(){
    this.motion = true;      
  },

  afterFinish : function (){
    this.motion = false;
    if($('slide-control-link-'+this.currentSlide)){
      $('slide-control-link-'+this.currentSlide).removeClassName('control-active');
      $('slide-control-link-'+this.currentSlide).addClassName('control');
    }
    this.currentSlide = this.toSlide;
    if($('slide-control-link-'+this.currentSlide)){
      $('slide-control-link-'+this.currentSlide).addClassName('control-active');
      $('slide-control-link-'+this.currentSlide).removeClassName('control');
    }
  }
  
});



Event.observe(window, 'load', function() {new ImageRotator().start();}, false);