/**
 * creativitea.js
 * 
 * Custom scrolly thingies for the CreativiTea page.
 */

$(function () {
  var dx = [0,0,0,0];
  // Below are the minimum and maximum scrolls for the scrollable list items.
  // For convenience of math they are expressed as absolute values but they'll
  // be negative left-margin CSS values during and after the animations. To
  // adjust them use Firebug to determine the value you want for either edge
  // and replace that value here. 
  var min_margin = [450, 950, 1201, 450];
  var max_margin = [1900, 1600, 1401, 2100];
  
  $("ol#supported-art > li.scrollable_")
  .each(function (i) {
    $(this).bind("mousemove", function (e) {
      // Elaborate method of determining where, relative to the centre of the window,
      // the mouse is when it's over this block.
      dx[i] = e.pageX - ($(window).width() / 2.0);
    })
    .bind("mouseleave", function (e) {
      dx[i] = 0;
      $(this).animate({ marginLeft: "-1301px" });
    });
  });
  
  // Constant animation interval is ALWAYS ON. Adjust the number at the end of this
  // call to change the animation speed.
  window.setInterval(function () {
    $("ol#supported-art > li.scrollable_")
    .each(function (i) {
      // Adjust the value below to widen/narrow the non-scrolling area of this block.
      if(Math.abs(dx[i]) > 300) {
        target_margin = (-parseInt($("ol#supported-art > li.scrollable_").eq(i).css("margin-left"))) + (dx[i] > 0 ? 7 : -7);  // Number of pixels to step each frame
        if(target_margin > max_margin[i]) { target_margin = max_margin[i]; }
        if(target_margin < min_margin[i]) { target_margin = min_margin[i]; }
        $("ol#supported-art > li.scrollable_").eq(i).css("margin-left", "-" + target_margin + "px");
      }
    });
  }, 33);
});