// A Scrollable Message Plugin
// Dominion Digital (c) 2009

jQuery.fn.scrollableMessage = function(options) {
 
	var defaults = { 
		viewableHeight: 'auto',
		interruptDelay: 5000,
		autoplayDelay: 5000,
		fadeInDelay: 250,
		fadeOutDelay: 250		
	};
	
	var settings = $.extend({}, defaults, options);
 
	return this.each(function(){
						   
		var scrollableContainer = $(this);
		var messageList = scrollableContainer.find('#content ul');
	
		if (messageList != null) {
		  var numberOfMessages = messageList.find('li').size();
	
		  if (numberOfMessages > 1) {
	
			if (settings.viewableHeight == 'auto') {
				messageHeight = parseInt(messageList.find('li').height());
				alert(parseInt(messageList.find('li').height()))
			} else {
				messageHeight = settings.viewableHeight;
			}

			var counter = 1;
			
	
			if (numberOfMessages >= 2) {
				// build navigation
				scrollableContainer.prepend("<div id='scrollableNav'><ul></ul></div>");
				
				temp = $("#scrollableNav ul")
				
				for(i=1;i<=numberOfMessages;i++) {
					temp.append("<li id='item" + i + "'><a href='#'>" + i + "</a></li>");
				}
				
				temp.prepend("<li id='scrollPrevious'><a href='#'>&laquo;</a></li>")
				temp.append("<li id='scrollNext'><a href='#'>&raquo;</a></li>")
				
				$("#item1").toggleClass("selected")
				
				$("#scrollableNav ul li").each( function() {
					$(this).click(function() {
							manageTimer();
							moveToMessage($(this).attr('id'))
					}); 
				})
				
				
				pauseDelay = null
				
				delayTimer()
			}
		  }
		}
		
		function manageTimer() {
			if (pauseDelay != null) {
				clearTimeout(pauseDelay)
				pauseDelay = null
			}
			clearInterval(autoPlay);
			autoPlay = null
			pauseDelay = setTimeout(delayTimer, settings.interruptDelay);
		}
		
		function delayTimer() {
			autoPlay = setInterval(moveMessages, settings.autoplayDelay);
		}
		
		function moveMessages() {
			$("#item" + counter).toggleClass("selected");
			
			if (counter == numberOfMessages) {
				moveWhere = 0
				counter = 0;
			} else {
				moveWhere = parseInt(messageList.css("top")) - messageHeight;
			}
			
			fadeOutMessage()
			
			counter++;
			
			$("#item" + counter).toggleClass("selected");
		}
		
		function moveToMessage(whatAction) {
			$("#item" + counter).toggleClass("selected");
			if (whatAction == "scrollPrevious") {
				if (counter == 1) {
					counter = numberOfMessages
				} else {
					counter--
				}
			} else if (whatAction == "scrollNext") {
				if (counter == numberOfMessages) {
					counter = 1
				} else {
					counter++
				}
			} else if (whatAction.indexOf("item") == 0) {
				var whichMessage = parseInt(whatAction.substr(4, whatAction.length ))
				counter = whichMessage
			}
			
			moveWhere = (messageHeight * -counter) + messageHeight;

			fadeOutMessage()
			
			$("#item" + counter).toggleClass("selected");
		}
		
		function fadeOutMessage() {
			messageList.fadeOut(settings.fadeOutDelay, fadeInMessage);
		}
		function fadeInMessage() {
			messageList.css("top",moveWhere);
			messageList.fadeIn(settings.fadeInDelay);
		}
		
	});
	
};

