jQuery.fn.wojtekScroll = function(options) {
	return this.each(function(){
		
		$me = $(this);
		$list = $me.find('ul:first');

		$(this).find('img').load(function() {
			changeWidth();
		});
		
		var listWidth = 0;
		var meWidth = 0;
		var listDiff = 0;
		
		function changeWidth() {
			$me.prepend('<div></div>');
			$div = $me.find('div:first');
			$div.css({
				'float': 'left',
				'width': '100000px'
			});
			$list.appendTo($div);
			listWidth = $list.outerWidth();
			meWidth = $me.outerWidth();
			listDiff = listWidth - meWidth
			$list.appendTo($me);
			$div.remove();
		}
		
		options = options || {};
		
		options.scrollBarClass = options.scrollBarClass || "wojtekScrollBar";
		options.scrollHandleClass = options.scrollHandleClass || "wojtekScrollHandle";
		options.arrowClass = options.arrowClass || "";
		options.arrowStep = parseInt(options.arrowStep || 1);
		if(options.scrollClickable == false) {
			options.scrollClickable = false;
		} else {
			options.scrollClickable = true;
		}
		
		$me.css({
			'overflow': 'hidden',
			'position': 'relative'
		});
		
		$me.append('<div class="'+options.scrollBarClass+'"><div class="'+options.scrollHandleClass+'"></div></div>');
		$scroll = $me.find('div.'+options.scrollBarClass+':first');
		$handle = $me.find('div.'+options.scrollHandleClass+':first');
		
		$scroll.css({
			'height': $handle.outerHeight()+'px',
			'position': 'absolute',
			'left': '0',
			'bottom': '0',
			'width': '100%'
		});
		$scroll.css('width',$scroll.outerWidth()+'px');
		$handle.css({
			'position': 'absolute',
			'left': '0',
			'top': parseInt($scroll.css('paddingTop'))+'px',
			'cursor': 'pointer'
		});
		$me.css('paddingBottom',(parseInt($me.css('paddingBottom'))+$scroll.outerHeight())+'px');		
		
		if(options.arrowClass.length > 0) {
			$scroll.prepend('<div class="'+options.arrowClass+'Left"></div>');
			$scroll.append('<div class="'+options.arrowClass+'Right"></div>');
			$arrowL = $me.find('div.'+options.arrowClass+'Left:first');
			$arrowR = $me.find('div.'+options.arrowClass+'Right:first');
			var arrowLw = $arrowL.outerWidth();
			var arrowRw = $arrowR.outerWidth();
			$scroll.css('left',arrowLw+'px');
			$scroll.css('width',($scroll.outerWidth() - arrowLw - arrowRw)+'px');
			$arrowL.css({
				'top': 0,
				'left': '-'+arrowLw+'px',
				'height': $scroll.outerHeight()+'px',
				'position': 'absolute',
				'cursor': 'pointer'
			});
			$arrowR.css({
				'top': 0,
				'right': '-'+arrowRw+'px',
				'height': $scroll.outerHeight()+'px',
				'position': 'absolute',
				'cursor': 'pointer'
			});
		}
		
		var scrollWidth = $scroll.outerWidth() - $handle.outerWidth();
		var scrollOffset = $scroll.offset();
		scrollOffset = scrollOffset['left'];
		var handleOffset = -1;
		
		function moveScroll(x) {
			if(x > scrollWidth) x = scrollWidth;
			if(x < 0) x = 0;
			$handle.css('left',x+'px');
			var offset = parseFloat(x / scrollWidth);
			offset = offset * listDiff;
			$list.css('marginLeft','-'+offset+'px');
		}
		
		function debug(txt) {
			$('div#image').append(txt+' '+'<br />');
		}
		
		var arrowMouseDown = function(e) {
			var x = $handle.position();
			if(e.target.className.indexOf('Left') >= 0) {
				moveScroll(x['left']-options.arrowStep);
			} else if(e.target.className.indexOf('Right') >= 0) {
				moveScroll(x['left']+options.arrowStep);
			}
		}
		
		if(options.arrowClass) {
			$arrowL.click(arrowMouseDown);
			$arrowR.click(arrowMouseDown);
		}
		
		$handle.mousedown(function(e) {
			handleOffset = e.originalEvent.offsetX || e.originalEvent.layerX;
			return false;
		});
		
		if(options.scrollClickable) {
			$scroll.click(function(e) {
				if(e.target.className == options.scrollBarClass) {
					var x = e.originalEvent.offsetX || e.originalEvent.layerX;
					x -= parseInt($handle.outerWidth()/2);
					moveScroll(x);
				}
				return false;
			});
		}
		
		$(document).mouseup(function() {
			handleOffset = -1;
			return false;
		});
		
		$(document).mousemove(function(e) {
			if(handleOffset >= 0) {
				var x = e.pageX - (scrollOffset + handleOffset);
				moveScroll(x);
			}
			return false;
		});
		
		$(document).mouseout(function(e) {
			if((e.target.tagName.toLowerCase() == 'html') || (e.target.tagName.toLowerCase() == 'body')) {
				handleOffset = -1;
				return false;
			}
		});
		
	});
}
