/* Hobbs Homepage Image Rotation Script
 Related Job No.: hob287
 Author: Dan Scotton (danscotton@gmail.com)
 Date: 23/10/09
 ----------------------------------------------------*/
imageRotation = {
 slides: [],
 timer: null,
 buttons: [],
 init: function() {
  this.slides[0] = $('slide1');
  this.enableSlides();
  if(this.slides.length > 1) {
   this.createButtons();
   this.selectButton(0);
   this.startCounter();
  }
 },
 enableSlides: function() {
  var pageSlides = $('page').getChildren();
  for(var i = 1; i < pageSlides.length; i++) {
   if(pageSlides[i].hasClass('slide') && pageSlides[i].getProperty('id')!='slide1') {
    pageSlides[i].setProperty('id', 'slide'+(i));
    pageSlides[i].setStyle('display', 'block');
    //console.log(((pageSlides.length - (i-1)) * 10));
    pageSlides[i].setStyle('z-index', ((pageSlides.length - (i-1)) * 10));
    this.slides.push(pageSlides[i]);
   }
  }
 },
 startCounter: function() {
  this.timer = setInterval(imageRotation.nextSlide, 5000);
 },
 resetCounter: function(index) {
  clearInterval(this.timer);
 },
 nextSlide: function(index, instant) {
  if(instant) {
   this.switchSlide(index);
  }
  else {
   var current = imageRotation.slides.shift();
   imageRotation.slides.push(current);
   imageRotation.fadeSlide(current);
   imageRotation.selectButton(current.getProperty('id').match(/\d/)[0]);
  }
 },
 fadeSlide: function(slide) {
  this.fade = new Fx.Style(slide, 'opacity', {
   duration: 1000,
   wait: false,
   transition: Fx.Transitions.linear,
   onComplete: function(slide) {
    imageRotation.sendToBack();
    $(slide).setStyle('opacity', 1);
    imageRotation.bindButtons();
   }.bind(this)
  });
  this.fade.start(0);
  this.unBindButtons();
 },
 switchSlide: function(index) {
  this.resetCounter();
  this.resetFades();
  var offset = this.slides.indexOf($('slide'+index));
  for(var i = 0; i < offset; i++) {
   var current = imageRotation.slides.shift();
   imageRotation.slides.push(current);
   imageRotation.sendToBack();
  }
  this.selectButton(index-1);
  this.startCounter();
 },
 resetFades: function() {
  if(imageRotation.fade) {
   imageRotation.fade.stop();
   this.slides.each(function(slide) {
    slide.setStyle('opacity', 1);
   });
  }
 },
 sendToBack: function() {
  this.slides.each(function(slide, index) {
   if(index == 0) {
    this.slides[this.slides.length-1].setStyle('z-index', 10);
   }
   else {
    this.slides[(index-1)].setStyle('z-index', ((this.slides.length - (index-1)) * 10));
   }
  }, this);
 },
 createButtons: function() {
  var div = new Element('div', {
   'id': 'buttons'       
  });
  var ol = new Element('ol', {
   'id': 'controls'
  });
  this.slides.each(function(slide, index) {
   var li = new Element('li');
   var a = new Element('a', {
    'href': '#',
    'id': 'button'+(index+1)
   });
   a.appendText(index+1);
   this.buttons.push(a);
   li.adopt(a);
   ol.adopt(li);
  }, this);
  this.bindButtons();
  div.adopt(ol);
  $('page').adopt(div);
  $('controls').style.width = (this.slides.length * 23) + 'px';
 },
 bindButtons: function() {
  this.buttons.each(function(button, index) {
   button.onclick = function() {
    imageRotation.nextSlide((index+1), true);
    return false;
   }
  });
 },
 unBindButtons: function() {
  this.buttons.each(function(button, index) {
   button.onclick = function() {
    return false;
   }
  });
 },
 selectButton: function(index) {
  this.buttons.each(function(button) {
   button['className'] = '';
  });
  if(index == this.buttons.length) index = 0;
  this.buttons[index]['className'] = 'selected';
 }
}