$(document).ready(function() {
	$('#prev2').css({'background-image': 'url(../images/arrow_up.gif)', 'background-repeat': 'no-repeat', 'background-position': '4px 5px'});
	$('#pause').css({'background-image': 'url(../images/pause.gif)', 'background-repeat': 'no-repeat', 'background-position': '4px 5px'});
	$('#play').css({'background-image': 'url(../images/arrow_right.gif)', 'background-repeat': 'no-repeat', 'background-position': '4px 5px'});
	$('#next2').css({'background-image': 'url(../images/arrow_down.gif)', 'background-repeat': 'no-repeat', 'background-position': '4px 5px'});
  $('#carousel').css({'width': '876px', 'overflow' : 'hidden'}).cycle({
		slideExpr: '.client_wrap',
    fx: 'scrollVert',
		speed:    800,
		timeout:  6000,
    delay:    -200,
		next:    '#next2', 
		prev:    '#prev2',
    easing:  'easeOutQuint',
    pager:  '#pager',
    pagerAnchorBuilder: function(idx, slide) {
		var src = $('img',slide).attr('alt'); 
    return '<a href="#" title="View '+src+'"><img src="../images/clearpixel.gif" width="12" height="12" /></a>'; 
    } 
  });
  
  function showControl() {
    $('#td_nav').animate({
      width: 20
    },600, 'easeInQuart');
	}
  function hideControl() {
    $('#td_nav').animate({
      width: 0
    },600, 'easeOutQuart');
	}
  
  $('#carousel_wrap').hoverIntent({
    over: showControl,
    timeout: 900,
    out: hideControl
  });
  
  $('#pause').click(function() { 
    $(this).hide();
    $('#play').fadeIn(400);
    $('#carousel').cycle('pause');
    return false;
  });
  
  $('#play').click(function() { 
    $(this).hide();
    $('#pause').fadeIn(400);
    $('#carousel').cycle('resume');
   return false;
  });
	$("#carousel a[rel=Client_Group]").fancybox({
		onStart		:	function() {
			$('#carousel').cycle('pause');
		},
		onClosed	:	function() {
      $('#carousel').cycle('resume');
		},
		'transitionIn'	: 'elastic',
		'transitionOut'	: 'elastic',
		'easingIn'      : 'easeOutQuint',
		'easingOut'     : 'easeInQuint',
		'titlePosition' 	: 'over',
		'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
			return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp;:&nbsp; ' + title : '') + '</span>';
		}
	});	
});