/***************************************
   =IMAGE CAROUSEL
-------------------------------------- */

jQuery(document).ready(function() {
  var spacing = 110;
  
  function createControl(src) {
    return jQuery('<img/>')
      .attr('src', src)
      .addClass('control')
      .css('opacity', 0.6)
      .css('display', 'none');
  }
      
  var $leftRollover = createControl('http://yangsiwei.com/wp-content/themes/womenyijia/images/left.gif');
  var $rightRollover = createControl('http://yangsiwei.com/wp-content/themes/womenyijia/images/right.gif');
  var $enlargeRollover = createControl('http://yangsiwei.com/wp-content/themes/womenyijia/images/enlarge.gif');
  /*
  var $enlargedCover = jQuery('<img/>')
    .addClass('enlarged')
    .hide()
    .appendTo('#featured-cases');
  var $closeButton = createControl('http://yangsiwei.com/wp-content/themes/womenyijia/images/close.gif')
    .addClass('enlarged-control')
    .appendTo('#featured-cases');
  var $priceBadge = jQuery('<div/>')
    .addClass('enlarged-price')
    .css('opacity', 0.6)
    .css('display', 'none')
    .appendTo('#featured-cases');
    //*/
  var $waitThrobber = jQuery('<img/>')
    .attr('src', 'http://yangsiwei.com/wp-content/themes/womenyijia/images/wait.gif')
    .addClass('control')
    .addClass('waitimg')
    .css('z-index', 4)
    .hide();

  jQuery('#featured-cases').css({
    'width': spacing * 3,
    'height': '145px',
    'overflow': 'hidden'
  }).find('.covers a').css({
    'float': 'none',
    'position': 'absolute',
    'left': 1000
  });

  var setUpCovers = function() {
    var $covers = jQuery('#featured-cases .covers a');

    $covers.unbind('click').unbind('mouseover').unbind('mouseout');

    // Left image; scroll right (to view images on left) when clicked.
    $covers.eq(0).css('left', 0).click(function(event) {
      $covers.eq(0).animate({'left': spacing}, 'fast');
      $covers.eq(1).animate({'left': spacing * 2}, 'fast');
      $covers.eq(2).animate({'left': spacing * 3}, 'fast');
      $covers.eq($covers.length - 1).css('left', -spacing).animate({'left': 0}, 'fast', function() {
        jQuery(this).prependTo('#featured-cases .covers');
        setUpCovers();
      });

      event.preventDefault();
    }).hover(function() {
      $leftRollover.appendTo(this).show();
    }, function() {
      $leftRollover.hide();
    });

    // Right image; scroll left (to view images on right) when clicked.
    $covers.eq(2).css('left', spacing * 2).click(function(event) {
      $covers.eq(0).animate({'left': -spacing}, 'fast', function() {
        jQuery(this).appendTo('#featured-cases .covers');
        setUpCovers();
      });
      $covers.eq(1).animate({'left': 0}, 'fast');
      $covers.eq(2).animate({'left': spacing}, 'fast');
      $covers.eq(3).css('left', spacing * 3).animate({'left': spacing * 2}, 'fast');

      event.preventDefault();
    }).hover(function() {
      $rightRollover.appendTo(this).show();
    }, function() {
      $rightRollover.hide();
    });
	
    // Center image; enlarge cover when clicked.
    $covers.eq(1).css('left', spacing).hover(function() {
      $enlargeRollover.appendTo(this).show();
    }, function() {
      $enlargeRollover.hide();
    });
  };

  setUpCovers();
});