var channel = 
{
	movingElement : false,
	
	init : function()
	{
		channel.setUpForwardLinks();
		channel.setUpBackLinks();
		channel.setUpFilmLinks();
	},
	
	setUpForwardLinks : function()
	{
		$('channel_links').getElementsBySelector('a.forward').each(function(elm)
		{
			elm.onclick = function() 
			{
				if (channel.movingElement.state === undefined || channel.movingElement.state === 'finished')
				{
					channel.doChannelMove(this, 'forward');
				}
				
				return false;
			}
			
			elm.onfocus = function()
			{
				elm.blur();
				return false;
			}
		});
	},
	
	setUpBackLinks : function()
	{
		$('channel_links').getElementsBySelector('.back a').each(function(elm)
		{
			elm.onclick = function()
			{	
				
				if (channel.movingElement.state === undefined || channel.movingElement.state === 'finished')
				{
					channel.doChannelMove(this, 'back');
				}
				
				return false;
			}
			
			elm.onfocus = function()
			{
				elm.blur();
				return false;
			}
		});
	}, 
	
	doChannelMove : function(elm, direction)
	{
		var parentDiv = elm.up('.channel-holder');
		var domDirection = (direction == 'back') ? 'previous' : 'next';
		var insertionDirection = (direction == 'back') ? 'Before' : 'After';
		var moveDirection = (direction == 'back') ? '' : '-';
		var newDirection = false;
		var siblingDiv = parentDiv[domDirection]('.channel-holder');
			
		if (siblingDiv !== undefined && direction === 'forward')
		{
			// There is a div already there that contains a channel, but is it the one 
			// we want? Check! If not, we need to kill it. Kill it hard.
			var siblingRel = siblingDiv.readAttribute('rel');
			
			if (siblingRel !== elm.rel)
			{
				// The forward div isnt the one we want anymore, so remove it.
				newDirection = true;
				siblingDiv.remove();
			}
			
		}
		
		// Don't bother with the ajax if there is something there we want
		if (newDirection === true || siblingDiv === undefined) 
		{ 
			new Ajax.Request('/ajax/get_tv_channel/' + elm.rel, 
			{
				method: 'get',
				asynchronous: false,
				onSuccess: function(transport) 
				{
					// We're going backwards, but there is nothing there - this is probably a direct 
					// page access. To do this we need to offset the  channel scroller by the width of the channel
					// then place the new div in.
					if (direction === 'back' && siblingDiv === undefined)
					{
						$('channel_scroller').setStyle({width:parentDiv.getWidth()+$('channel_scroller').getWidth()+'px', 
														left:-parentDiv.getWidth()+'px',
														position:'relative'});
					}
						
					new Insertion[insertionDirection](parentDiv.id, transport.responseText);
					
					channel.init();
				}
			});
		}
		
		
		$('channel_scroller').setStyle({width:parentDiv.getWidth()+$('channel_scroller').getWidth()+'px'});	
		channel.movingElement = new Effect.Move ($('channel_scroller'), { x: moveDirection+parentDiv.getWidth(), mode: 'relative', duration:0.3, delay:0.2});
	}, 
	
	setUpFilmLinks : function()
	{
		$$('a.film').each(function(elm)
		{
			elm.onclick = function()
			{
				tv.loadPlayList(this.rel);
				return false;
			}
			
			elm.onfocus = function()
			{
				elm.blur();
				return false;
			}
		});
		
		if ($('watch_channel'))
		{
			// And a special oneoff
			$('watch_channel').onclick = function()
			{
				tv.loadPlayList($('watch_channel').rel);
				return false;
			}
			
			$('watch_channel').onfocus = function()
			{
				$('watch_channel').blur();
				return false;
			}
		}
	}
	
	
}

Event.observe(window, 'load', function() 
{
  channel.init();
});