(function ($) {
	$.fn.tweeningStrip = function(options) {
	
		// set default options
		var defaults = {
			
			thumbsContainerClass	: 'tweeningstrip-thumbs-container',
			thumbsClass				: 'tweeningstrip-thumbs',
			thumbsNavClass			: 'tweeningstrip-thumbs-nav',
			thumbsNavLeftClass		: 'tweeningstrip-thumbs-nav-left',
			thumbsNavRightClass		: 'tweeningstrip-thumbs-nav-right',
			photosContainerId		: 'photosContainer',
			maxSpeed				: 8,
			acceleration			: 0.3,
			scrollStep				: 3
		};
		
	
		// extend the options
		var o = $.extend(defaults, options);
		
		var $this = $(this);
		
		var thumbs = $this;
		thumbs.addClass(o.thumbsClass);
		
		// wrap it into div with overflow: hidden and certain dimentions
		var thumbsContainer = $('<div>').addClass(o.thumbsContainerClass);
		$this.wrap(thumbsContainer);
		thumbsContainer = $this.parent(); // without this we can't append to thumbsContainer later
		
		var thumbsLeftNav  = $('<div>').addClass(o.thumbsNavClass).addClass(o.thumbsNavLeftClass);
		var thumbsRightNav = $('<div>').addClass(o.thumbsNavClass).addClass(o.thumbsNavRightClass);
		
		thumbsContainer.append(thumbsLeftNav).append(thumbsRightNav);
		
		var photosContainer = $('#'+o.photosContainerId);
		
		var timer;
		var isOver = false;
		var currSpeed = 0;
		var tar = [];
		var thumbsArr = $this.children();
 		var thumbsLength = thumbsArr.length;
 		var currPhoto;
// 		debug(thumbsLength);		
		
		
		mouseEnterHandler = function(e) {
			isOver = true;
			scrl((e.target == thumbsLeftNav[0]) ? 1 : -1);
		}
		
		mouseLeaveHandler = function(e) {
			isOver = false;
		}
		
		item_clickHandler = function(e) {
			openItem($(e.target).parent());
		}


		
		scrl = function(d) {

			clearInterval(timer);
			var lastThumb = thumbsArr[thumbsLength-1];
//			debug(lastThumb.offsetLeft);
// 			debug(thumbsContainer.attr('offsetWidth') - lastThumb.offsetWidth)
 			var l = (d == 1) ? 0 : (lastThumb.offsetLeft - (thumbsContainer.parent().attr('offsetWidth') - lastThumb.offsetWidth));
			
			if (l > 0) l = l * -1;
			timer = setInterval(function(){move(d, l)}, 20);
		}
		
		
		move = function(d, l) {
			// debug("move");
			var left = thumbs.css('left');
			if (!left || left.indexOf("px") == -1)
				left = '0px';
			
			left = Number(left.replace('px', ''));
			// debug(left);
			if (isOver)
			{
				currSpeed += o.acceleration * d;
				if (Math.abs(currSpeed) > o.maxSpeed)
					currSpeed = o.maxSpeed * d;
			}
			else
			{
				currSpeed -= o.acceleration * d;
				if (d * currSpeed < o.acceleration)
				{
					cncl();
					currSpeed = 0;
					debug('stop');
					return;
				}
			}
			// debug('currSpeed: '+currSpeed);
			
			
			if (d == -1) {
				// currSpeed < 0, strip moves left (forward)
				if (Math.abs(l - left) <= Math.abs(currSpeed)) {
					// debug(l);
					cncl();
					currSpeed = 0;
					thumbs.css('left', '-'+l+'px');
				} else {
					thumbs.css('left', (left+currSpeed)+'px');
				}
			} else {
				// ss > 0, strip moves right (back)
				if (Math.abs(left) - l <= Math.abs(currSpeed)) {
					cncl();
					currSpeed = 0;
					thumbs.css('left', l+'px');
				} else {
					thumbs.css('left', (left+currSpeed)+'px');	
				}
			}
		}
		
		cncl = function() { clearTimeout(timer); }
		
		openItem = function(thumb) {
			// debug(thumb);
// 			thumb = $(thumb)
			// thumb.fadeTo('slow', 0.2);
			
			// debug(photosContainer);
			if (currPhoto)
				currPhoto.fadeOut();
			
			var photoSrc = thumb.children().attr('alt');
			// debug(photoSrc);
			var photo = $("#photosContainer img[src='"+photoSrc+"']");
// 			debug(photo);
			if (photo.length > 0)
			{
				photo = $(photo);
				photo.fadeIn();
			}
			else
			{
				photo = $('<img src="'+photoSrc+'" alt="" />');
				photo = $(photo);
				photo
					.load(function() {
						photosContainer.append(this);
						$(this).css('left', (photosContainer.width() - $(this).width())/2);
						$(this).hide();
						$(this).fadeIn();
					})
					.error(function() {
						debug('error loading photo');
					})
					.attr('src', photoSrc);
			}
			
			currPhoto = photo;
		}
		
		checkWidth = function(){
			var lastThumb = thumbsArr[thumbsLength-1];
			debug(lastThumb.offsetLeft);
			debug(thumbsContainer.parent().attr('offsetWidth'));
			debug(lastThumb.offsetWidth);
			debug(lastThumb.offsetLeft - (thumbsContainer.parent().attr('offsetWidth') - lastThumb.offsetWidth));
			if (lastThumb.offsetLeft + lastThumb.offsetWidth > thumbsContainer.parent().attr('offsetWidth'))
			{
				clearInterval(checkWidthTimer);
				$('.'+o.thumbsNavClass).bind('mouseenter', mouseEnterHandler);
				$('.'+o.thumbsNavClass).bind('mouseleave', mouseLeaveHandler);
				$('.'+o.thumbsNavClass).css('display', 'block');
			}
		}
		
		$('.'+o.thumbsNavClass).css('display', 'none');
		
		var checkWidthTimer = setInterval(checkWidth, 1000);
		
		
		thumbsArr.each(function(i) {
 			$(this).bind("click", item_clickHandler);
 			if (i == 0)
 				openItem($(this));
// 			$(this).fadeTo("slow", 0.6);
		});
	};
	
	
	//
	// private function for debugging
	//
	function debug(o) {
		if (window.console && window.console.log)
			window.console.log(o);
	}
})(jQuery);