/**
 * FeatureItems
 * Add a juicy bit of web 2.0 goodness to the feature images
 */
 
var FeatureItems = {
  setup: function() {
    // collect all the pieces
    var fis = FeatureItems;
    Log.debug('FeatureItems setup');
    fis.imgHolder = $e('ft-img');
    fis.imgTotal = $j(fis.imgHolder).children().size();
    
    fis.items = [];
    // put items in array - remember, they are stored in reverse order
    $j(fis.imgHolder).children().each(function(i, img) {
      fis.items[fis.imgTotal - i] = {
        imageNode: img
      }
    });
    
    var pieces;
    $j('#ft-controls a').each(function(i, a) {
      // add links to items
      fis.items[fis.imgTotal - i].anchor = a;
      pieces = a.title.split('|');
      fis.items[fis.imgTotal - i].title = pieces[0];
      fis.items[fis.imgTotal - i].subtitle = pieces[1];
      fis.items[fis.imgTotal - i].link = a.href;      
    })    
    
    // wire mouse events
    .hover(
      // over
      fis.controlOver,
      // out
      fis.startTime
    );
    
    $j('#ft-text a').hover(fis.stopTime, fis.startTime);
    $j(fis.imgHolder).hover(fis.stopTime, fis.startTime);
    
    // start transitions
    fis.current = 1;  
    fis.startTime();    
  },
  
  controlOver: function() {
    var fis = FeatureItems;
    fis.stopTime();
    Log.debug('over control ' + this.innerHTML);
    fis.makeActive(parseInt(this.innerHTML));
  },
  
  // only to be called by makeActive
  makeInactive: function(number) {
    var fis = FeatureItems;    
    Log.debug('makeInactive ' + number);
    Log.debug('anchor ' + fis.items[number].anchor);
    // make button inactive
    $j(fis.items[number].anchor).parent().removeClass('active');    
  },
  
  makeActive: function(number, withTransition) {
    var fis = FeatureItems;    
    if (fis.current == number) return;
    Log.debug('makeActive ' + number);
    var item = fis.items[number];
    // transition
    if (withTransition) {
      Log.debug('with transition');
      $j(item.imageNode).hide().fadeIn(600);
    }
    // put image at the front
    $j(fis.imgHolder).append(item.imageNode);
    // change link
    fis.imgHolder.href = item.link;
    // make button active
    $j(item.anchor).parent().addClass('active');
    
    var newText = function() {
      // put new text in
      $j('#ft-text strong').text(item.title);
      $j('#ft-text span').text(item.subtitle);
      // change link
      $j('#ft-text a').attr('href', item.link);
    };
    // transition
    if (withTransition) {
      $j('#ft-text a').fadeOut(300, function() {
        newText();
        $j('#ft-text a').fadeIn(300);        
      });
    }
    else newText();
        
    fis.makeInactive(fis.current);    
    fis.current = number;
  },
  
  stopTime: function() {
    clearTimeout(FeatureItems.timeout);
  },
  
  startTime: function() {
    var fis = FeatureItems; 
    fis.timeout = setTimeout(
      function() {
        fis.makeActive((fis.current % fis.imgTotal) + 1, true);
        fis.startTime();
      },
      3500
    );
  }
  
};

Finish.addTask(FeatureItems.setup, 'FeatureItems.setup');