// JavaScript Document

brandx = new Array();
brandx["Blackhole"] = 0;
brandx["Sesitec"] = 283;
brandx["Liquid Force"] = 566;
brandx["Winch Snow Fighters"] = 849;
brandx["Jetpilot"] = 1132;
brandx["Supra"] = 1132;
brandx["Moomba"] = 1132;

var x = 0;
var autoscroll = true;

$(document).ready(function() {
  var pane = $('.scroll').jScrollPane({
	showArrows: true,
	horizontalDragMinWidth: 362,
	horizontalDragMaxWidth: 362,
	animateScroll: true,
	animateDuration: 500,
	hideFocus: true,
	clickOnTrack: true
  });

  var api = pane.data('jsp');
  var timer = setInterval(scroller, 3000);
	
  $('.brands img').hover(function() {
	$(this).animate({opacity: "1"}, 300);
  }, function() {
	$(this).animate({opacity: "0"}, 300);
  });
  
  $('.brands img').click(function() {
	brand = $(this).attr("alt");
	x = brandx[brand];	
	api.scrollTo(x, 0);
	if (autoscroll) {
	  clearInterval(timer);
	  autoscroll = false;
	}
  });
  
  $('.jspHorizontalBar, .jspArrow').click(function() {
	  clearInterval(timer);
	  autoscroll = false;
  });
  
  function scroller() {
    x += 283;
	if (x > 1132) x = 0;
	api.scrollTo(x, 0);
  }
  

});