/* HOW TO USE 

*** JS part ***

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
<script src="twitter_plugin.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$("#list").cycleTwitter({
		interval: 2000, 
		transition_time: 500
	});	
});

</script>



*** HTML part ***

<div style="position: relative; width: 100px; height: 20px; top: 100px; overflow: hidden; border: 1px solid #eeeeee;">
	<ul id="list" style="position: absolute; top: 0px; margin: 0;">
		<li>1</li>
		<li>2</li>
		<li>3</li>
		<li>4</li>
	</ul>
</div>


*** ANY PROBLEMS? SPEAK TO BART (bart@propcom.co.uk). ***

*/

(function(jQuery) {

	$.fn.cycleTwitter = function(options) {
		var defaults = {
			interval: 2000,
			transition_time: 500
		}
		var opts = $.extend(defaults, options);
		var obj = this;
		
		setInterval(function() {rot(obj, opts.transition_time);}, opts.interval);	
		
	}
	
	function rot(obj, transition_time) {
		var msg_height = parseInt(obj.find("li").css("height").replace("px", ""))+ 
			parseInt(obj.find("li").css("padding-top").replace("px", "")) + 
			parseInt(obj.find("li").css("padding-bottom").replace("px", ""));
			
		var msg_count = obj.children("li").size();
		var cur_pos = obj.css("top").replace("px", "");
		var new_pos = cur_pos - msg_height;
		obj.animate({top: new_pos}, transition_time, function() {
			if (obj.css("top").replace("px", "") <= -(msg_height * (msg_count-1))) {
				new_pos = 0;
				var el = obj.children("li").last();
				obj.prepend(el);
				obj.css("top", new_pos);
			} 
		});	
	}
	
})(jQuery);