(function($) {
	$.widget("ui.hscroller", {

		_init: function() {
			var self = this;
			$(this.options.right_btn_id).mousedown(function() { self.scroll_right() });
			$(this.options.left_btn_id).mousedown(function() { self.scroll_left() });
		},

		disable_buttons: function() {
			$(this.options.left_btn_id).hide();
			$(this.options.right_btn_id).hide();
		},

		enable_buttons: function() {
			$(this.options.left_btn_id).show();
			$(this.options.right_btn_id).show();
		},

		get_left_pos: function() {
			var left = $(this.options.scrolled_box_id).css("left");
			var len = left.length - 2;
			return left.substr(0, len);
		},

		scroll_right: function() {
			this.disable_buttons();
			var left = this.get_left_pos();
			if (left <= ((-1) * (this.options.rightpos))) {
				$(this.options.scrolled_box_id).animate({ "left": this.options.leftpos + "px" }, this.options.timeout, this.options.effect, this.enable_buttons());
			} else {
				$(this.options.scrolled_box_id).animate({ "left": "-=" + this.options.stepwidth + "px" }, this.options.timeout, this.options.effect, this.enable_buttons());
			}
		},

		scroll_left: function() {
			this.disable_buttons();
			var left = this.get_left_pos();
			if (left >= this.options.leftpos) {
				$(this.options.scrolled_box_id).animate({ "left": "-" + this.options.rightpos + "px" }, this.options.timeout, this.options.effect, this.enable_buttons());
			} else {
				$(this.options.scrolled_box_id).animate({ "left": "+=" + this.options.stepwidth + "px" }, this.options.timeout, this.options.effect, this.enable_buttons());
			}
		}

	});

	$.ui.hscroller.defaults = {
		scrolled_box_id: "#items",
		right_btn_id: "#scroll_right_btn",
		left_btn_id: "#scroll_left_btn",
		timeout: 500,
		leftpos: 0,
		rightpos: 1740,
		stepwidth: 870,
		effect: "swing"
	};

})(jQuery);