//FIXME: after one cycle it stops turning on
function cycleMiddle(right) {
  if (right) {
    var new_middle = $(window.current_middle).next();
    new_middle = new_middle.length ? new_middle : $(window.current_middle).parent().find('li').first();
  } else {
    var new_middle = $(window.current_middle).prev();
    new_middle = new_middle.length ? new_middle : $(window.current_middle).parent().find('li').last();
  }
  turnOff(window.current_middle);
  turnOn(new_middle);

  // Set the cached one now
  window.current_middle = new_middle;

  loadBottom();
}

function loadBottom() {
  clearBottom();
  $('#bottom_content').load(current_middle.find('a').attr('rel'));
}

function clearBottom() {
  $('#bottom_content td').empty();
}

function turnOn(element) {
  var img = $(element).children('img.carousel_image');
  img.attr('src', function() {
    return this.src.replace(/_off/, '_on');
  });
}

function turnOff(element) {
  var img = $(element).children('img.carousel_image');
  img.attr('src', function() {
    return this.src.replace(/_on/, '_off');
  });
}

function bindGalleryImages() {
  $('a.gallery_image').lightBox();
  $('img.thumb').each(function() {
    $(this).css('position','absolute');
    $(this).css('left', '-' + ( parseInt( $(this).attr('width') ) / 2 ) + 'px' );
    $(this).css('top', '-' + ( parseInt( $(this).attr('height') ) / 2 ) + 'px' );
    $(this).css('margin-left', '50%' );
    $(this).css('margin-top', '50%' );
    return $(this).wrap('<div class="thumb-img"><div class="thumb-inner">' + '</div><div class="thumb-strip"></div><div class="thumb-zoom"></div></div>');
  });
}

$(document).ready(function() {
  window.current_middle = $($("#carousel > ul > li")[2]);
  window.carousel_count = $("#carousel > ul > li").length

  turnOn(window.current_middle);

  $("#carousel").jCarouselLite({
    btnNext:  ".next",
    btnPrev:  ".prev",
    speed:    450,
    visible:  5,
    scroll:   1,
    circular: true,
    easing:   "easeOutBack"
  });

  loadBottom();

  $('img.carousel_image').bind('mouseover', function() {
    turnOn($(this).parent('li'));
  });

  $('img.carousel_image').bind('mouseout', function() {
    if ($(this).parent().attr('id') != window.current_middle.attr('id')) {
      turnOff($(this).parent('li'));
    }
  });

  $('.prev').bind('mouseover', function() {
    $(this).removeClass('prev');
    $(this).addClass('prev_on');
  });

  $('.prev').bind('mouseout', function() {
    $(this).removeClass('prev_on');
    $(this).addClass('prev');
  });

  $('.next').bind('mouseover', function() {
    $(this).removeClass('next');
    $(this).addClass('next_on');
  });

  $('.next').bind('mouseout', function() {
    $(this).removeClass('next_on');
    $(this).addClass('next');
  });

  $('.prev').bind('click', function() {
    cycleMiddle(false);
  });
  
  $('.next').bind('click', function() {
    cycleMiddle(true);
  });

  $('#down_arrow').bind('mouseover', function() {
    $(this).removeClass('down_arrow_on');
    $(this).addClass('down_arrow_off');
  });

  $('#down_arrow').bind('mouseout', function() {
    $(this).removeClass('down_arrow_off');
    $(this).addClass('down_arrow_on');
  });
});