/*
  This provides the infinite scrolling, icon zooming, client logo area at
  the bottom of each page.
*/

$(function(){

  // set up scrolling
  $("#clients-dock").smoothDivScroll({
      scrollingSpeed: 10,
      autoScroll: "always",
      autoScrollDirection: "endlessloop",
      pauseAutoScroll: "mouseover",
      scrollingSpeed: 10,
      autoScrollSpeed: 1
  });

  $('#clients-dock img').each(function(){
    set_defaults($(this));
  });

  // use jquery live() to automatically add the onmouseover and onmouseout
  // functions to each dynamically added logo element.
  $('#clients-dock img').livequery(function(){
    set_defaults($(this));
  });

  $('#clients-dock img').live("mouseover", function(){
    var img = $(this);

    if (!img.data('init')) {
      img.data('init', true);
      img.hoverIntent({
        over: hover_on,
        out: hover_off
      });
      img.trigger('mouseover');
    }

  });

  function set_defaults(img) {
    img.css('width', 'auto');
    img.css('height', 'auto');
    var w = img.width();
    var h = img.height();

    // store the images original width and height
    var wh = {
      w: w,
      h: h
    };
    img.data('wh', wh);

    // store the images default width and height
    var ratio = 1.3;
    var new_width = (w / ratio) + 'px';
    var new_height = (h / ratio) + 'px';

    var default_wh = {
      w: new_width,
      h: new_height
    };
    img.data('default_wh', default_wh);

    // set image defaults once the page has loaded
    img.css('opacity', '0.5');
    img.css('width', new_width);
    img.css('height', new_height);
  }

  // actions for the elements onmouseover state
  function hover_on() {
    var data = $(this).data('wh');
    var w = data.w + 'px';
    var h = data.h + 'px';

    $(this).animate({
      width: w,
      height: h,
      opacity: '1.0'
    });
  };

  // actions for the elements onmouseout state
  function hover_off() {
    var data = $(this).data('default_wh');
    var w = data.w;
    var h = data.h;

    $(this).animate({
      width: w,
      height: h,
      opacity: '0.5'
    });
  };

});