function ScrollArea(viewportSelector, contentSelector, forwardSelector, backwardSelector) {
	var _this = this;
	
	
	
	this.init = function(viewportSelector, contentSelector, forwardSelector, backwardSelector) {
		this.viewport = jQuery(viewportSelector);
		this.content = jQuery(contentSelector);
		
		this.contentWidth = 0;
		this.viewportWidth = this.viewport.width();
		
		this.scrollInterval = null;
		
		this.speed = 2;
		
		this.scrollForwardElement = jQuery(forwardSelector);
		this.scrollBackwardElement = jQuery(backwardSelector);
		
		this.setContentWidth();
		
		if (this.contentWidth > this.viewportWidth + 4) {
			this.addEventListeners();
		} else {
			this.removeButtons();
		}
	}
	
	
	
	this.setContentWidth = function() {
		var width = 0;
		var thumbnails = this.content.children();
		
		thumbnails.each(function() {
			width += jQuery(this).outerWidth();
		});
		
		this.contentWidth = width;
		this.content.css('width', this.contentWidth);
	}
	
	
	
	this.addEventListeners = function() {
		this.scrollForwardElement.bind('click', function(event) {
			event.preventDefault();
		}).bind('mousedown', function(event) {
			event.preventDefault();
			_this.scrollForward();
		}).bind('mouseup', function(event) {
			event.preventDefault();
			_this.stopScroll();
		}).bind('mouseout', function(event) {
			event.preventDefault();
			_this.stopScroll();
		});
		
		this.scrollBackwardElement.bind('click', function(event) {
			event.preventDefault();
		}).bind('mousedown', function(event) {
			event.preventDefault();
			_this.scrollBackward();
		}).bind('mouseup', function(event) {
			event.preventDefault();
			_this.stopScroll();
		}).bind('mouseout', function(event) {
			event.preventDefault();
			_this.stopScroll();
		});
	}
	
	
	
	this.scrollForward = function() {
		if (this.scrollInterval == null) {
			this.scrollInterval = setInterval(function() {
				var currentPos = _this.content.position();
				var newPos = currentPos.left - _this.speed;
				if (newPos > (_this.viewportWidth - _this.contentWidth)) {
					_this.content.css('left', newPos);
				} else {
					_this.content.css('left', _this.viewportWidth - _this.contentWidth);
				}
			}, 1);
		}
	}
	
	
	
	this.scrollBackward = function() {
		if (this.scrollInterval == null) {
			this.scrollInterval = setInterval(function() {
				var currentPos = _this.content.position();
				var newPos = currentPos.left + _this.speed;
				if (newPos < 0) {
					_this.content.css('left', newPos);
				} else {
					_this.content.css('left', 0);
				}
			}, 1);
		}
	}
	
	
	
	this.stopScroll = function() {
		clearInterval(this.scrollInterval);
		this.scrollInterval = null;
	}
	
	
	
	this.removeButtons = function() {
		this.scrollForwardElement.remove();
		this.scrollBackwardElement.remove();
	}
	
	
	
	this.init(viewportSelector, contentSelector, forwardSelector, backwardSelector);
}

jQuery(window).load(function() {
	var scrollArea = new ScrollArea('#ScrollArea', '#ScrollAreaContent', '#ScrollForward', '#ScrollBack');
});