var selfcarousel = null;
var scrollDirection = null;
var isVertical = false;
var size = null;
function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
   selfcarousel = carousel;
   var idx = carousel.index(i, size);
   if (!isVertical) {
      idx = carousel.index(i, size);
   }
   carousel.add(i, mycarousel_getItemHTML(idx));
}
;

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt)
{
   carousel.remove(i);
}
;

function mycarousel_getItemHTML(idx)
{
   if (isVertical) {
      return '<div class="exhibitionContainer" style="width:6000px;float:left;overflow:hidden;">' + $('#exhibitionContainer' + idx).html() + '</div>';
   } else {
      return '<div class="exhibition" style="margin-top:10px;">' + $('#exhibition' + idx).html() + '</div>';
   }
}
;

$().ready(function() {
   scrollDirection = $(".scrollDirection").val();
   if (scrollDirection == 'horizontal') {
      size = $('.exhibition').size();
   }
   else {
      size = $('.exhContainer').size();
   }
   var animation = 3000 * size;
   var autoChange = 1;
   var offset = size;
   var scroll = 3;
   if (scrollDirection == 'vertical') {
      isVertical = true;
      animation = "slow";
      autoChange = 8;
      offset = 1;
      scroll = 1;
   }
   $('#mycarousel').jcarousel({
      vertical: isVertical,
      scroll: scroll,
      auto:autoChange,
      animation:animation,
      wrap:"circular",
      itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
      itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback}
   });

   $("#mycarousel").mouseover(function() {
      selfcarousel.stopAuto();
   });

   $("#mycarousel").mouseout(function() {
      selfcarousel.startAuto(autoChange);
   });
});