/*
This script looks for the first div classed portletNews (if any) and turns 
it into a ticker
TODO: We're changing inline styles, any way this could be print styles only? 
How can these not apply to print as they mess it up? Important print styles?
*/

/**
 * Namespace
*/
openc.ticker = {};

/**
 * Constants
*/

openc.ticker.DELTA_X = 3;
openc.TICKER_ELEMENT_PADDING_RIGHT = 20;
openc.TICKER_PAUSE = 1000;
openc.TICKER_FRAMERATE = 40;
openc.TICKER_START_FADE = 1000;

/**
 * Initialise the list and kick of the first itteration
*/
openc.ticker.init = function() {


	// Get a reference to the portlet, the ul and lis
	var div = jq("div.openc_portletNews:first");
	
	/**
	 * Safari exaggerates the width of the ticker at first, causing problems. 
	 * Wait until it settles down. TODO - find a non arbitrary property.
	*/
	if(div.width() > 1000) {
		setTimeout(openc.ticker.init, 1);
		return;
	}
	
	
	// Get a reference to the other elements
	var h2 = div.find("h2");
	var ul = div.find("ul.news-list");
	var lis = ul.find("li");
	
	
	// If elements do not exist
	if(div.length + ul.length + lis.length == 0) {
		// Do nothing
		return;
	}
	
	// Add an RSS button. Try to find one in site actions
	var rss = jq("li#siteaction-news-rss a");
	if(rss.length == 1) {
		div.prepend('<a class="rss" href="' + rss.attr('href') + '">RSS</a>');
	}
	
	// Add an id to the DIV so it will pick up ticker CSS
	div.attr('id', 'pe-latest-news');
	// Remove old class to cancel non p/e styling
	div.removeClass('openc_portletNews');
	
	// Fade the ticker to nothing - ready to reveal when ready
	lis.css("opacity",0);
	
	
	// Remove boxout class to remove styling from ul and h2
	ul.removeClass("Boxout");
	

	// Set the ul to be a borderless window, fixed at the width of the outer div
	// this will be set on each itteration to handle changes in size.
	
	ul.css({
		overflow: "hidden",
		padding: "0",
		margin: "0",
		listStyle: "none",
		position: "relative",
		zIndex:10,
		height: "1.4em"
	});
	
	
	
	// If this is Internet Explorer
	if(jQuery.browser.msie) {
		// Fix the size of the UL so that it isn't stretched by it's children
		ul.width(div.width());
	}
	

	// The state of the ticker wrapped in an object to pass-by-reference
	var state = {
		over : false, 
		leftMostIndex : -1, 
		div : div,
		h2 : h2, 
		ul : ul, 
		lis : lis, 
		counter: 0
	};
	
	// For each li
	lis.each(function(i) {
	
		jq(this)
	
		// Move the li out of view, but keep it measurable. Ensure block display.
		.css({
			position: "absolute",
			display: "block",
			padding:0
		})
		// Stretch very long to get rid of text wrapping
		.width(9999)
		// Mouse events
		.mouseover(function() {
				state.over = true;
				jq(this).addClass('over');
			}
		)
		.mouseout(function() {
				state.over = false;
				jq(this).removeClass('over');
			}
		)
		// White space for anchors
		.find('a').css('white-space', 'nowrap')
	});
	
	
	// Set first iteration for ticker
	openc.ticker.nextItteration(state);
	
	lis.animate({opacity:0},openc.TICKER_PAUSE - openc.TICKER_START_FADE)
		.animate({opacity:0.99},openc.TICKER_START_FADE,"swing")
}



/**
 * Get a reference to ticker iteration function and delay call
*/
openc.ticker.nextItteration = function(state) {
	
	
	// Create a closure around the itterator
	var tickerIterator = openc.ticker.closeItteration(state);
	
	// Increment the counter
	state.counter += 1;
	
	// Set the timeout for the next itteration, there's a pause at the start
	setTimeout(tickerIterator, state.counter == 2 ? openc.TICKER_PAUSE : openc.TICKER_FRAMERATE);
}


/**
 * Return a function closing state
*/
openc.ticker.closeItteration = function(state) {

	return function() {

		// If not over
		if(!state.over) {

			// for each li
			state.lis.each(function(i) {

				// Get a wrapped li
				var li = jq(state.lis[i]);
				
				// Shrink wrap around its anchor
				li.width(li.find('a').width() + openc.TICKER_ELEMENT_PADDING_RIGHT);
				
				// If nothing has been positioned yet
				if(state.leftMostIndex == -1) {
					
					// Position the very first li
					li.css("left", 10);
					
					// So that this block doesn't repeat, set the first li to 
					// be the leftmost for the next itteration
					state.leftMostIndex = 0;
					
				// The left-most moves and the others follow:
				// if left-most and in view
				} if(
					i == state.leftMostIndex &&
					(this.offsetLeft + this.offsetWidth) > 0) {
					
					// Move left one step
					li.css("left", this.offsetLeft - openc.ticker.DELTA_X);
				
				// If not the leftmost and in view
				} else {

					// move to the right of previous-in-roll
					var lastIndex = state.lis.length - 1;
					var previousInRoll = (i == 0) ? jq(state.lis[lastIndex]) : jq(state.lis[i - 1]);
					
					var newLeft = parseInt(previousInRoll.css("left")) + previousInRoll.width();
					this.style.left = newLeft + "px";
					
					// If was left-most, left-most now next-in-roll
					if(i == state.leftMostIndex) {
						state.leftMostIndex = (i == lastIndex) ? 0 : i + 1;
					}
				}
			})
		}
		// Set next iteration
		openc.ticker.nextItteration(state);	
	}
}
// Call initialise when DOM loaded
jq(function() {
	if(openc.IS_RIA_CLIENT && !openc.IS_EDIT_PAGE && openc.IS_DESKTOP) {
		openc.ticker.init();
	}
});