function changeSlide(filename) {
  var lastSlash = filename.lastIndexOf('/');
  if( lastSlash != -1 ) {
    lastSlash += 1;
    filename = filename.substr(lastSlash, filename.length - lastSlash);
  }
  var prevImg = jQuery('.bigPic:first');
  if( prevImg ) {
    prevImg.fadeOut(500);
  }
  jQuery('.bigWrap').append('<div class="bigPic"><img src="portfolio_images/large/' + filename + '"></div>');
  jQuery('.bigPic:last').fadeIn(500);
}

var isScrolling = false;
var isAnimating = false;

var xpos = false;

function startScroller(e, item) {
  xpos = e.pageX - item.offsetLeft;
  scroller();
}

function scroller() {
  if( isAnimating ) { 
    return;
  }
  if( isScrolling ) {
//jQuery('#mousePos').html(e.pageX - item.offsetLeft); 
//jQuery('#mousePos').html(parseInt(jQuery('.thumbs').css('left')));
     // The width of the thingie is 885px.  We want to scroll when the mouse is over
     // the left 200px and the right 200px, and increase/decrease speed depending on 
     // mouse position.  Also, we don't want to scroll forever - limit to the width 
     // of the div.
     if( xpos < 200 ) {
       //alert(parseInt(jQuery('.thumbs').css('left')));
       if( parseInt( jQuery('.thumbs').css('left')) < 0 ) {
         isAnimating = true;
         // further = faster!
         if( xpos < 100 ) {
           jQuery('.thumbs').animate({'left':'+=15px'},20,'linear',function(){ isAnimating = false; scroller(); });
         }
         else {
           jQuery('.thumbs').animate({'left':'+=5px'},20,'linear',function(){ isAnimating = false; scroller(); });
         }
       }
       else {
         setTimeout('scroller',10);
       }
     }
     if( xpos > 685 ) {
       if( parseInt(jQuery('.thumbs').css('left')) >= maxLeftScroll ) {
         isAnimating = true;
         if( xpos > 785 ) {
           jQuery('.thumbs').animate({'left':'-=15px'},20,'linear',function(){ isAnimating = false; scroller(); });
         } 
         else {
           jQuery('.thumbs').animate({'left':'-=5px'},20,'linear',function(){ isAnimating = false; scroller(); });
         }
       }
       else {
         setTimeout('scroller',10);
       }
     }
  }
}

function stopScroll(e) {
  isScrolling = false;
}

var fullImages = [];
function preloadImages() {
  jQuery('.thumbImg').each( function(index, item) {
      filename = item.src;
      var lastSlash = filename.lastIndexOf('/');
      if( lastSlash != -1 ) {
        lastSlash += 1;
        filename = filename.substr(lastSlash, filename.length - lastSlash);
      }
      filename = 'portfolio_images/large/' + filename;
      tmpimg = new Image(440,401);
      tmpimg.src = filename;
      fullImages[fullImages.length] = tmpimg;
  });
}
