// template

var animSpeed = 500;
var animSpeedQuick = 250;

$(document).ready(function() {
  rotatorInit();
});

// rotator

var interval = 2000;
var fadeTime = 500;
var rotators;

function Rotator(id, e, c, interval, fadeTime) {
  // methods
  this.pause = function() {
    if (this.timer == -1) {
      this.timer = window.setInterval("rotators[" + id + "].next();", interval);
    } else {
      window.clearInterval(this.timer);
      this.timer = -1;
    }
  }
  this.resetTimer = function() {
    if (this.timer > -1) {
      window.clearInterval(this.timer);
      this.timer = window.setInterval("rotators[" + id + "].next();", interval);
    }
  }
  this.jump = function(i) {
    if (i != this.index) {
      var current = $(this.images[this.index]);
      this.index = i;
      var next = $(this.images[this.index]);
      this.zIndex++;
      next.css({ opacity: 0, display: "block", zIndex: this.zIndex });
      $("#rotatorControls img").attr("src", "/_images/button-square-grey.png");
      $("#rotatorButton" + this.index).attr("src", "/_images/button-square-orange.png");
      next.fadeTo(this.fadeTime, 1, function() {
        current.css({ display: "none" });
      });
    }
    this.resetTimer();
  }
  this.next = function() {
    if (!this.paused) {
      var current = $(this.images[this.index]);
      this.index++;
      if (this.index == this.images.length) this.index = 0;
      var next = $(this.images[this.index]);
      this.zIndex++;
      next.css({ opacity: 0, display: "block", zIndex: this.zIndex });
      $("#rotatorControls img").attr("src", "/_images/button-square-grey.png");
      $("#rotatorButton" + this.index).attr("src", "/_images/button-square-orange.png");
      next.fadeTo(this.fadeTime, 1, function() {
        current.css({ display: "none" });
      });
    }
  }
  // init vars
  this.id = id;
  this.element = e;
  this.controls = c;
  this.interval = interval;
  this.fadeTime = fadeTime;
  this.timer = -1;
  this.zIndex = 3;
  this.index = 0;
  this.paused = false;
  // find images
  var images = new Array();
  this.element.find(".rotatorItem").each(function() {
    images.push(this);
  });
  this.images = images;
  if (this.images.length == 0) return;
  // show first
  var first = $(this.images[0]);
  first.css({ display: "block" });
  // init timer
  if (this.images.length > 1) {
    var html = "";
    for (var i = 0; i < this.images.length; i++) {
      html += "<img onclick=\"rotators[" + this.id + "].jump(" + i + ");\" id=\"rotatorButton" + i + "\" src=\"/_images/button-square-";
      if (i == 0) {
        html += "orange.png\"/>";
      } else {
        html += "grey.png\"/>";
      }
    }
    c.html(html);
    c.css("display", "block");
    this.pause();
  }
}

function rotatorInit() {
  rotators = new Array();
  rotators[0] = new Rotator(0, $("#rotator"), $("#rotatorControls"), interval, fadeTime);
  // add pause behaviour to parent control
  $("#navRight")
    .bind("mouseenter", function(ev) { rotators[0].paused = true; })
    .bind("mouseleave", function(ev) { rotators[0].paused = false; rotators[0].resetTimer(); });
}