$(function() {
  var scroll = new Scroll();
});

var Scroll = function() {
  this.container = $("#projects .thumbs");
  this.arrL = $("#projects .arrow-left");
  this.arrR = $("#projects .arrow-right");

  this.delta = 140;
  this.duration = 400;
  if (this.container.get(0)) {
    this.init();
  }
}
Scroll.prototype = {
  init: function() {
    var self = this;
    self.arrL.click(function() {self.scroll(-1)});
    self.arrR.click(function() {self.scroll(1)});
    $("#projects .thumbs a").hover(function() {
      $("dfn",this).stop(true,true).animate({opacity: 0},200);
    }, function() {
      $("dfn",this).stop(true,true).animate({opacity: 0.4},200);
    });
    self.checkScrolls();
  },
  scroll: function(k) {
    var self = this;
    var el = self.container.get(0);
    var newValue = el.scrollLeft + self.delta*k;
    var maxValue = el.scrollWidth - el.clientWidth;
    if (newValue <= 0) {
      newValue = 0;
      self.arrL.hide();
    } else if (newValue >= maxValue) {
      newValue = maxValue;
      self.arrR.hide();
    }
    self.container.animate({scrollLeft: newValue},{duration: self.duration, complete: function() {self.checkScrolls()}});
    
    self.checkScrolls();
  },
  checkScrolls: function() {
    var self = this;
    var el = self.container.get(0);
    var curValue = el.scrollLeft;
    var maxValue = el.scrollWidth - el.clientWidth;
    if (curValue == 0) {
      self.arrL.hide();
    } else {
      self.arrL.show();
    }
    if (curValue == maxValue) {
      self.arrR.hide();
    } else {
      self.arrR.show();
    }
  }
}