(function($){
	jQuery.fn.viewer = function(settings){
		
		settings = jQuery.extend({
			prevButtonSelector: '.viewer_prev',	// previous button selector
			nextButtonSelector: '.viewer_next',	// next button selector
			navButtonsSelector: '.viewer_nav', // circle buttons
			itemsSelector: '.viewer_items li', // the items for the viewer
			viewerMask: '.viewer_mask', // mask element selector,
			activeNavButtonClass: 'active', // active class for the nav items
			navButtonClass: 'nav_button', // active class for the nav items
			displayNum: 3, // number of items to display in the viewer area
			disableFadeTo: .2,
			showNumbers: true,
			createButtons: true
		}, settings);
		
		this.each(function(){
			var $viewerPrev = $(settings.prevButtonSelector, this);
			var $viewerNext = $(settings.nextButtonSelector, this);
			var $viewerNav = $(settings.navButtonsSelector, this);
			var $viewerItems = $(settings.itemsSelector, this);
			var itemsWidth = 0;
			var itemWidth = $(settings.itemsSelector + ':first', this).outerWidth(true);
			var displayNum = settings.displayNum;
			var maxNav = Math.ceil($viewerItems.size() / displayNum);
			var viewerWidth = $(settings.viewerMask, this).outerWidth();

			var currentNav = 0;
			var activeNav = null;
			var activeNavClass = settings.activeNavButtonClass;
			var activeMover = null;
			var maxNum = maxNav - 1;
			var minNum = 0;
	
			$viewerItems.each(function(i){
				itemsWidth += $(this).outerWidth(true);
			});
	
			$viewerItems.parent().width(itemsWidth);
	
			$viewerNav.children('.' + settings.navButtonClass).remove();
			if (maxNav > 1) {
				if (settings.createButtons){
					for (var i = 0; i < maxNav; i++){
						var html = '<li class="' + settings.navButtonClass + '"><a href="#">';
						if (settings.showNumbers) html += (i + 1);
						html += '</a>';
						$viewerNav.append(html);
					}

					$(settings.navButtonsSelector + ' .' + settings.navButtonClass, this).each(function(i){
						$(this).click(function(e){
							changeItems(i);
							return false;
						});
					});
				}
			} else {
				$viewerPrev.hide();
				$viewerNext.hide();
			}
	
			$viewerPrev.click(function(){
				currentNav = currentNav - 1
		
				if (currentNav >= minNum){
					changeItems(currentNav);
				}
				return false;
			});

			$viewerNext.click(function(){
				currentNav = currentNav + 1;
				if (currentNav <= maxNum){
					changeItems(currentNav);
				}
				return false;
			});
	
			var disableMover = function($this){
				if (activeMover != $this){
					if ($this) $this.fadeTo('fast', settings.disableFadeTo).css('cursor', 'default');
					if (activeMover) activeMover.fadeTo('fast', 1).css('cursor', 'pointer');
				}
				activeMover = $this;
			}
			
			var changeItems = function(i){
				currentNav = i;
				var newX = currentNav * (itemWidth * displayNum);
				$viewerItems.parent().animate(
					{left: -newX}
				);

				if (settings.createButtons){
					var nav = $viewerNav.children('.' + settings.navButtonClass).eq(i);
					nav.addClass(activeNavClass);
					if (activeNav != null && activeNav != i) $viewerNav.children('.' + settings.navButtonClass).eq(activeNav).removeClass(activeNavClass);
					activeNav = i;
				}
				
				if (maxNav > 1){
					if (currentNav == minNum) {
						disableMover($viewerPrev);
					} else if (currentNav == maxNum) {
						disableMover($viewerNext);
					} else if (activeMover){
						disableMover(null);
					}
				}
			}
			changeItems(0);
		});
	}
})(jQuery);