/**
* TickerTape.js
*
* Copyright:	Eight Media
* Author:		Simon de Haan, simon@eight.nl
*
**/

/**
* TickerTape class, extends the Dean Edwards's Base class for decent
* OO inheritance
**/
var TickerTape = Base.extend({
	
	data_pointer:	0,
	data: 			new Array(),
	stage: 			false,
	container:		false,
	cycleTime:		3000,
	cycleInterval:	false,
	marginTop:		0,
	
	constructor: function(st) {
		
		//  the stage is the main container in which the messages scroll past
		this.stage = st;
		
		// we set the overflow to hidden so scrolled content will be masked
		this.stage.css({
			overflow: "hidden"
		});
	},
	
	/**
	* add
	*
	* Add a text and link to be displayed on the ticker tape
	**/
	add: function(t,l) {
		this.data.push({text:t,link:l});
	},
	
	/**
	* start
	*
	* Start ticking the messages
	**/
	start: function() {
		
		// Add a container to the stage in which we'll be placing the content
		// this container will be scrolled
		this.stage.prepend('<div class="tickertape_container"></div>');
		
		// reference the newly created container
		this.container = $('div.tickertape_container',this.stage);
		
		
		// show the first one
		this.showNext();
	},
	
	/**
	* showNext
	*
	* get the next row from the data array and display it
	**/
	showNext: function() {
		
		// reset the pointer to 0 if its at the end of the data array
		if(this.data_pointer == this.data.length)	this.data_pointer = 0;
		
		// get the current & first up next object data to show
		var current = this.data[this.data_pointer];
		var first = this.data[this.data_pointer+1] ? this.data[this.data_pointer+1] : this.data[0];
		
		// get the container DOM element
		if(this.container != null && this.container.length > 0 && this.container[0] != null) {
			var containerObj = this.container[0];

			// if the childNodes array length is zero, we're starting the for the first time and both need to be added
			if(containerObj.childNodes.length == 0) {

				// create the new A tags to be added to the container
				var a = document.createElement("a");
				a.href = current.link;
				a.title = current.text;
				a.innerHTML = current.text;

				containerObj.appendChild(a);

				var a = document.createElement("a");
				a.href = first.link;
				a.title = first.text;
				a.innerHTML = first.text;

				containerObj.appendChild(a);

			} else {

				// create a new a element with the new data of the next object
				var a = document.createElement("a");
				a.href = first.link;
				a.title = first.text;
				a.innerHTML = first.text;

				// append the child to the container obj
				containerObj.appendChild(a);

				// get the container DOM element
				var containerObj = this.container[0];

				// reset the margin
				this.container.css({
					marginTop: "-1px"  
				});

				// remove the first element which we've just scrolled up
				containerObj.removeChild(containerObj.firstChild);

			}

			// increment the data array pointer
			this.data_pointer++;

			// because the setInterval is eval'd internally the 'this' keyword
			// reference will reference to the window object at runtime instead of being
			// a reference to the instance of TickerTape, to bypass this we use a proxy object
			// called me which will keep its reference because the 'me' variable will still reference the
			// same object during eval()

			// proxy object
			var me = this;

			// start the scroller
			setTimeout(function() { me.scrollUp() }, me.cycleTime);
		}
	},
	
	scrollUp: function() {
		
		// move the container up
		this.marginTop--;
		
		// get the link DOM element which we use to calculate how far we have to scroll
		if(this.container != null && this.container.length > 0 && this.container[0] != null) {
			var linkObj = this.container[0].firstChild;

			// keep scroll till the marginTop is greater than the negative height of the link element
			if( this.marginTop > (-1 * linkObj.offsetHeight-1 ) ) {

				// scroll the container to the top
				this.container.css({
					marginTop: this.marginTop+"px"  
				});

				// keep scrolling
				var me = this;
				setTimeout(function() { me.scrollUp() }, 100);

			} else {

				this.marginTop = 0;

				// show the next ticker element
				this.showNext();

			}
		}
	}
	
});