$(document).ready(function()
{
  var eq = function(index)
  {
    return ':eq(' + index + ')';
  }

  // initializes the promo player
  //
  $('#promoplayer').each(
    function()
    {
      $('#promoplayer ul').hide();
  
      var promo = $(this);
      var items = $('#promoplayer ul li img');

      var fadeTo = function(index)
      {
        // fade out the current promo
        $('#promoplayer .promoitem.selected')
          .removeClass('selected')
          .fadeOut('normal', function() // fade in the new promo
            {
              // cycle the highlighted index
              var idx = eq(index);
              $('#promoplayer a.jump.selected').removeClass('selected');
              $('#promoplayer a.jump' + idx).addClass('selected');

              var item = $('#promoplayer .promoitem' + idx);

              // set promo label
              $('#promoplayer #promolabel span').text(item[0].title);

              // show the item
              item.addClass('selected').fadeIn('normal');
            });
        return false;
      }

      var fadeToPrev = function()
      {
        var items = $('#promoplayer .promoitem');
        var nextindex = items.filter('.selected').data('index') - 1;

        if (nextindex < 0)
        {
          nextindex = items.length - 1;
        }

        return fadeTo(nextindex);
      }

      var fadeToNext = function()
      {

        var items = $('#promoplayer .promoitem');
        var nextindex = items.filter('.selected').data('index') + 1;

        if (nextindex >= items.length)
        {
          nextindex = 0;
        }

        return fadeTo(nextindex);
      }

      var cancelLoop = function()
      {
        clearInterval(promo.data('loopid'));
      }

      // create the elements

      promo.append(
          '<div id="promofader"></div>'
        + '<div id="promolabel">-> <span></span></div>'
        + '<div id="promonav"></div>');

      var nav = $('#promonav');
      nav.append('<a id="promo-rw">&nbsp;</a>');
  
      for (var i=0; i<items.length; i++)
      {
        promo.prepend('<div class="promoitem round rc4 rc-white"></div>');
        nav.append('<a class="jump"></a>');
      }
  
      nav.append('<a id="promo-ff">&nbsp;</a>');
  
      // assign the event handlers and set up the promos
  
      $('#promonav #promo-rw').click(function(){cancelLoop();fadeToPrev();});
      $('#promonav #promo-ff').click(function(){cancelLoop();fadeToNext();});

      var divs = $('#promoplayer div.promoitem');
      var navs = $('#promonav a.jump');

      for (var i=0; i<items.length; i++)
      {
        divs[i].title = items[i].title;
        $(divs[i])
          .css('background', '#000 url("' + items[i].src + '") 0 0 no-repeat')
          .data('index',i)
          .data('href',items[i].parentNode.href)
          .hide()
        $(navs[i])
          .text((i+1))
          .click(function(){cancelLoop();fadeTo(this.innerHTML-1);});
      }

      // show first item
      var item = $('#promoplayer .promoitem:first');
      item.addClass('selected').show();

      // highlight index, set promo label
      $('#promoplayer a.jump:first').addClass('selected');
      $('#promoplayer #promolabel span').text(item[0].title);

      // set up promo clicking and start the loop of promos
      promo
        .click(function(event)
          {
            // clicks on A tags are for the promo player controls
            if ('A' != event.target.tagName)
            {
              location.href = $('#promoplayer .promoitem.selected').data('href');
            }
          })
        .data('loopid', setInterval(function(){fadeToNext()}, 7000) );
    });
});