
var BT = {};
BT.carousel = {};

BT.carousel.Controller = function(container, items) {
  this.init(container, items);
}

BT.carousel.Controller.prototype._container = null;
BT.carousel.Controller.prototype._els = [];
BT.carousel.Controller.prototype._items = {};
BT.carousel.Controller.prototype._activeItem = null;
BT.carousel.Controller.prototype._timer = null;
BT.carousel.Controller.prototype._interval = 1750;

BT.carousel.Controller.prototype.init = function(container, els) {
  this._container = $(container);
  this._activeItem = 0;

  for (var i = 0, j = els.length; i < j; i ++) {
    this._els.push(els[i]);

    var el = $(els[i]);
    this._items[el.id] = new BT.carousel.Item(el, {
      'active': (i == this._activeItem),
      'scope': this,
      'pause': function() { this.stop(); },
      'unpause': function() { this.play(); }
    });
  }

  $A(document.getElementsByClassName('anim-item-control-start', this._container)).each((function(el) {
    Event.observe(el, 'click', (function() {
      this.play();
    }).bind(this));
  }).bind(this));

  Element.replaceClassName(this._container, 'anim-loading', 'anim-animating');

  this.play();
};

BT.carousel.Controller.prototype.batch = function(fn, idxFn) {
  for (var i = 0, j = this._els.length; i < j; i ++) {
    this._items[this._els[i]][fn]((idxFn?idxFn(i):null));
  }
};

BT.carousel.Controller.prototype.play = function() {
  this.batch('unpause');

  this._timer = setTimeout((function() {
    this.next();
  }).bind(this), this._interval);

  Element.replaceClassName(this._container, 'anim-paused', 'anim-animating');
};

BT.carousel.Controller.prototype.stop = function() { 
  if (!Element.hasClassName(this._container, 'anim-loading')) {
    var item = this._items[this._els[this._activeItem]];

    item.display();
    item.pause();

    if (this._timer) {
      this._timer = clearTimeout(this._timer);
    }

    Element.replaceClassName(this._container, 'anim-animating', 'anim-paused');
  }
};

BT.carousel.Controller.prototype.next = function() {
  var oldItem = this._activeItem,
      newItem = oldItem + 1;

  if (newItem == this._els.length) newItem = 0;

  this.batch('queue', (function(idx) { 
    return idx == this.oldItem ? 2 : idx == this.newItem ? 3 : 1;
  }).bind({'newItem': newItem, 'oldItem': oldItem }));

  this._activeItem = newItem;

  this._items[this._els[newItem]].animate((function() {
    this.onAnimateComplete();
  }).bind(this));
};

BT.carousel.Controller.prototype.onAnimateComplete = function() {
  this._timer = setTimeout((function() {
    this.next();
  }).bind(this), this._interval);  
};

BT.carousel.Item = function(el, args) {
  this.init(el, args);
};

BT.carousel.Item.prototype._el = null;
BT.carousel.Item.prototype._image = null;
BT.carousel.Item.prototype._caption = null;
BT.carousel.Item.prototype._timer = null;
BT.carousel.Item.prototype._interval = 25;
BT.carousel.Item.prototype._fade = 0;

BT.carousel.Item.prototype.init = function(el, args) {
  this._el = el;

  this._image = Element.getFirstChildByTagName(document.getElementsByClassName('anim-item-image', this._el)[0], 'IMG');
  this._caption = Element.getFirstChildByTagName(document.getElementsByClassName('anim-item-caption', this._el)[0], 'P');

  if (args.active) {
    this._fade = 100;
  }
  else {
    Element.setOpacity(this._el, 0);
  }

  this.setCaption();

  Event.observe(this._image, 'click', args.pause.bind(args.scope));

  $A(document.getElementsByClassName('anim-item-image-target', this._el)).each((function(el) {
    Event.observe(el, 'mouseover', (function() {
      this.scope[this.fn](this.value);
    }).bind({'scope': this, 'fn': 'setCaption', 'value': el.title}));
  }).bind(this));
};

BT.carousel.Item.prototype.animate = function(fn) {
  this._timer = setInterval((function() {
    this.fade(fn);
  }).bind(this), this._interval);
};

BT.carousel.Item.prototype.fade = function(fn) {
  if (this._fade < 100) {
    this._fade += 5;
    Element.setOpacity(this._el, this._fade);
  }
  else {
    this.display();
    fn();
  }
};

BT.carousel.Item.prototype.display = function() {
  if (this._timer) {
    this._timer = clearInterval(this._timer);
  }

  Element.setOpacity(this._el, 100);
};

BT.carousel.Item.prototype.queue = function(idx) {
  this._el.style.zIndex = idx;

  if (idx < 2) {
    this._fade = 0;
    Element.setOpacity(this._el, 0);
  }
}

BT.carousel.Item.prototype.unpause = function() {
  this.toggleAnimation(true);
  this.setCaption();
};

BT.carousel.Item.prototype.pause = function() {
  this.toggleAnimation(false);
};

BT.carousel.Item.prototype.toggleAnimation = function(doAnimation) {
  (Element[(doAnimation?'removeClassName':'addClassName')])(this._el, 'anim-item-paused');
};

BT.carousel.Item.prototype.setCaption = function(val) {
  this._caption.innerHTML = val ? val : this._image.alt;
};

Event.observe(window, "load", function() { 
  var _a = new BT.carousel.Controller('anim-holder', ['anim-item-1', 'anim-item-2', 'anim-item-3', 'anim-item-4', 'anim-item-5', 'anim-item-6', 'anim-item-7', 'anim-item-8', 'anim-item-9', 'anim-item-10', 'anim-item-11', 'anim-item-12', 'anim-item-13', 'anim-item-14']);
});

