// Script by Drew Noakes.  http://drewnoakes.com/

// time to wait before queueing the next screen update
var TIMEOUT_INTERVAL_MILLIS = 10;
var minX = -170;
var maxX = 100;

var sliders = [
    { linkId:"gallery",     imageUrl:"images/slider-gallery.jpg" }
  , { linkId:"phone",       imageUrl:"images/slider-phone.jpg" }
  , { linkId:"code",        imageUrl:"images/slider-code.jpg" }
  , { linkId:"resume",      imageUrl:"images/slider-resume.jpg" }
  , { linkId:"crowland",    imageUrl:"images/slider-101crowland.jpg" }
  , { linkId:"mousepotato", imageUrl:"images/slider-mousepotato.jpg" }
  , { linkId:"tabs",        imageUrl:"images/slider-tabs.jpg" }
  , { linkId:"drewfm",      imageUrl:"images/slider-drewfm.jpg" }
  , { linkId:"flickr",      imageUrl:"images/slider-flickr.jpg" }
]

function loadImages()
{
  for (var i=0; i<sliders.length; i++) {
    var slider = sliders[i];
    var linkElement = document.getElementById(slider.linkId);
    if (linkElement) {
      var imageDivId = "sliderImage" + i;
      document.write("<div style='position:absolute; width:50px; height:50px;' id='" + imageDivId + "'><img src='" + slider.imageUrl + "'/></div>");
      var imageDiv = document.getElementById(imageDivId);
      imageDiv.style.left = minX + 'px';
      imageDiv.ZIndex = i;
      linkElement.onmouseover = rollImageIn;
      linkElement.onmouseout = rollImageOut;
      linkElement.slider = slider;
      slider.direction = 0;
      slider.imageDiv = imageDiv;
      slider.linkElement = linkElement;
      slider.xPos = minX;
    }
  }
  updateSliders();
}

function rollImageIn(evt)
{
  evt = evt || window.event;
  var linkElement = this;
  var slider = linkElement.slider;
  slider.direction = 1;
  if (slider.xPos <= minX) {
    var yPos = 0;
    if (evt && evt.clientY)
      yPos += evt.clientY;
    if (document.documentElement.scrollTop)
      yPos += document.documentElement.scrollTop;
    if (document.body.scrollTop)
      yPos += document.body.scrollTop;
    slider.imageDiv.style.top = yPos + 'px';
  }
}

function rollImageOut(evt)
{
  var linkElement = this;
  var slider = linkElement.slider;
  slider.direction = -1;
}

function updateSliders()
{
  for (var i=0; i<sliders.length; i++) {
    var slider = sliders[i];
    if (slider.direction==0 || !slider.linkElement) {
      continue;
    } else {
      if (slider.direction<0)
        slider.xPos -= 1;
      else
        slider.xPos += 8;
      slider.imageDiv.style.left = slider.xPos + 'px';
      limitExtremity(slider);
    }
  }
  setTimeout('updateSliders()', TIMEOUT_INTERVAL_MILLIS);
}

function limitExtremity(slider)
{
  var imageDiv = slider.imageDiv;
  if (slider.xPos>=maxX) {
    slider.xPos = maxX;
    slider.direction = 0;
  } else if (slider.xPos<=minX) {
    slider.xPos = minX;
    slider.direction = 0;
  }
}