function mycarousel_initCallback(carousel)
{

  jQuery('.jcarousel-control a').bind('click', function() {
        carousel.scroll(jQuery.jcarousel.intval(jQuery(this).attr("alt")));
        carousel.startAuto(0);
        return false;
  });

  jQuery('#mycarousel-next').bind('click', function() {
    carousel.next();
    carousel.startAuto(0);
    return false;
  });

  jQuery('#mycarousel-prev').bind('click', function() {
    carousel.prev();
    carousel.startAuto(0);
    return false;
  });


  // Disable autoscrolling if the user clicks the prev or next button.
  /*carousel.buttonNext.bind('click', function() {
    carousel.startAuto(0);
  });

  carousel.buttonPrev.bind('click', function() {
    carousel.startAuto(0);
  });*/

  // Pause autoscrolling if the user moves with the cursor over the clip.
  carousel.clip.hover(function() {
    carousel.stopAuto();
  });
};

$(document).ready(function(){

  jQuery('#mycarousel').jcarousel({
    auto: 2,
    scroll: 1,
    initCallback: mycarousel_initCallback,
    buttonNextHTML: null,
    buttonPrevHTML: null
  });

  /*jQuery('#mycarousel_thumb').jcarousel({
    auto: 1,
    scroll: 1,
    initCallback: mycarousel_initCallback,
    buttonNextHTML: null,
    buttonPrevHTML: null
  });*/

  renderScroll('thumb-scroller');

  $('a.gallery').lightBox();
});

function renderScroll(id)
{
   var div = $('#'+id),
		ul = $('#'+id+'-ul'),
		ulPadding = 15;

	//Get menu width
	var divWidth = div.width();

	//Remove scrollbars
	div.css({overflow: 'hidden'});

	//Find last image container
	var lastLi = ul.find('li:last-child');

	//When user move mouse over menu
	div.mousemove(function(e){
		//As images are loaded ul width increases,
		//so we recalculate it each time
		var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding;
		var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
		div.scrollLeft(left);
	});

}