window.addEvent('domready', function() {
	//Create a new newspane from the first UL in the right column, and set it to scroll every 6000ms.
	var list = $('index_right').getElement('ul');
	var newspane = new Newspane(list, $('index_right'), 6000);
});

var Newspane = new Class({

	initialize: function(npList, npContainer, npSpeed){
		
		this.npContainer = npContainer;
		this.npList = npList;
		this.listItems = npList.getElements('li');
		this.listLength = this.listItems.length;
		this.currentItem = 0;
		this.playing = false;
		this.speed = npSpeed;

		this.npBox = new Element('div', {
			'class': 'npBox'
		});
		this.npControls = new Element('div', {
			'class': 'npControls'
		});
		this.npPrev = new Element('a', {
			'href': 'javascript:void(0)',
			'class': 'npPrev',
			'html': 'Previous',
			'events': {
				'click': function(){
					this.previous();
					this.pause();
				}.bind(this)
			}
		});
		this.npPlay = new Element('a', {
			'href': 'javascript:void(0)',
			'class': 'npPause',
			'html': 'Pause',
			'events': {
				'click': function(){
					this.playPause();
				}.bind(this)
			}
		});
		this.npNext = new Element('a', {
			'href': 'javascript:void(0)',
			'class': 'npNext',
			'html': 'Next',
			'events': {
				'click': function(){
					this.next();
					this.pause();
				}.bind(this)
			}
		});
		
		//Insert a marker div above the list.
		this.npTop = new Element('div');
		this.npTop.inject(this.npList, 'before');

		//INSERT THE NEWSPANE CONTROLS WHERE THE OLD HTML WAS.
		this.npPrev.inject(this.npControls);
		this.npPlay.inject(this.npControls);
		this.npNext.inject(this.npControls);
		this.npList.inject(this.npBox);
		this.npControls.inject(this.npBox);


		this.npBox.inject(this.npTop, 'after');

		//get rid of the marker div.
		this.npTop.dispose();
		
		//ADJUST LIST ITEM DIMENSIONS AND HIDE LATER ITEMS.
		var itemWidth = this.npList.getScrollSize().x;
		var maxHeight = 0;
		for(var i = 0; i < this.listLength; i++)
		{
			this.listItems[i].setStyle('width', itemWidth);
			
			var itemHeight = this.listItems[i].getSize().y;
			
			if(itemHeight > maxHeight)
				maxHeight = itemHeight;
			
			if(i != 0)
				this.listItems[i].setStyle('opacity', '0');
		}
		this.npList.setStyle('height', maxHeight);


		//START PLAYING.
		this.play();
	},
	
	previous: function(){
		this.listItems[this.currentItem].fade(0);
		
		if(this.currentItem == 0)
			this.currentItem = this.listLength - 1;
		else
			this.currentItem -= 1;
		
		this.listItems[this.currentItem].fade(1);
	},
	
	next: function(){
		this.listItems[this.currentItem].fade(0);
		
		if(this.currentItem == (this.listLength - 1) )
			this.currentItem = 0;
		else
			this.currentItem += 1;
		
		this.listItems[this.currentItem].fade(1);
	},

	playPause: function(){
		if(this.playing == true)
			this.pause();
		else
		{
			this.next();
			this.play();
		}
	},

	play: function(){
		if(this.playing == true)
			return;

		this.npPlay.set('class', 'npPause');
		this.npPlay.set('html', 'Pause');
		this.trigger = ( function(){
			this.next()
		}.bind(this) ).periodical(this.speed);
		this.playing = true;
	},

	pause: function(){
		if(this.playing == false)
			return;
		
		this.npPlay.set('class', 'npPlay');
		this.npPlay.set('html', 'Play');
		this.playing = false;
		$clear(this.trigger);
	}


});	//end Newspane class