var feature_slideshow;
var news_slideshow;
var event_slideshow;

window.addEvent('domready', function() {
	$('feature-wrapper').setStyle('display', 'block');
	$('news-container').setStyle('display', 'block');
	$('event-container').setStyle('display', 'block');
	// Hide noscript elements
	//$('news').setStyle('display', 'none');
	//$('calendar-block').setStyle('display', 'none');
	//$('calendar').setStyle('display', 'none');

	// cache the navigation elements
	var navs = $('feature-slideshow').getElements('ul li a');

	// create a basic slideshow
	feature_slideshow = new SlideShow('feature-slideshow', {
		selector: '.feature_content',
		duration: '1100', 
		delay: '4000', // Based from settings from homepage.js:r8071
		onShow: function(data){
			// update navigation elements' class depending upon the current slide
			navs[data.previous.index].removeClass('current');
			navs[data.next.index].addClass('current');
		}
	});

	navs.each(function(item, index) {
		// click a nav item ...
		item.addEvent('click', function(event) {
			feature_slideshow.transitioning = false; // hax
			event.stop();
			feature_slideshow.pause();
			// pushLeft or pushRight, depending upon where
			// the slideshow already is, and where it's going
			var transition = (feature_slideshow.index < index) ? 'pushLeft' : 'pushRight';
			// call show method, index of the navigation element matches the slide index
			// on-the-fly transition option
			feature_slideshow.show(index, {transition: transition, duration: '500'});
		});
	});

	feature_slideshow.play();

	$('feature_prev_arrow').addEvent('click', function(event) {
		event.stop();
		//feature_slideshow.transitioning = false; // hax, makes slide disappear for some reason
		feature_slideshow.pause();
		feature_slideshow.show('previous', {transition: 'pushRight', duration: '500'});
	});

	$('feature_next_arrow').addEvent('click', function(event) {
		event.stop();
		feature_slideshow.pause();
		feature_slideshow.show('next', {transition: 'pushLeft', duration: '500'});
	});

	news_slideshow = new SlideShow('news-ticker', {
		selector: '.news_content',
		transition: 'pushLeft'
	});

	$('news_prev_arrow').addEvent('click', function() {
		news_slideshow.show('previous', {transition: 'pushRight'});
	});

	$('news_next_arrow').addEvent('click', function() {
		news_slideshow.show('next', {transition: 'pushLeft'});
	});

	event_slideshow = new SlideShow('event-ticker', {
		selector: '.event_content',
		transition: 'pushLeft'
	});

	$('event_prev_arrow').addEvent('click', function() {
		event_slideshow.show('previous', {transition: 'pushRight'});
	});

	$('event_next_arrow').addEvent('click', function() {
		event_slideshow.show('next', {transition: 'pushLeft'});
	});


	////var thumbnails = $$('img[class~=feature-thumbnail]');
	////var thumbnailMask = $('feature-thumbnail-mask');
	////var thumbnailPanel = $('feature-thumbnail-panel');
	
	////var maskWidth = getMaskWidth();
	////var thumbnailWidth = getThumbnailWidth();
	////var leftPosOfCenteredThumbnail = (maskWidth * 0.5) - (thumbnailWidth * 0.5);
	
	////var features = $$('div[class~=feature]');	
	
	// Highlight and shift the thumbnail plane so the selected
	// item is centered.
	function selectThumbnail(thumbnail) {
		var originalThumbnail = getSelectedThumbnail();
		if(thumbnail !== originalThumbnail) {
			var delta = getCenterDelta(thumbnail);
			thumbnailPanel.tween('margin-left', delta);
			thumbnails.each(function(t) {
				t.removeClass('feature-thumbnail-selected');
			});
			thumbnail.addClass('feature-thumbnail-selected');
			deselectFeature(originalThumbnail);
			selectFeature(thumbnail);
		}
	}

	function initSelectedThumbnail() {
		var currentThumbnail = getSelectedThumbnail();
		
		// If no thumbnail has class 'feature-thumbnail-selected', then
		// select the first thumbnail.
		if(!$chk(currentThumbnail)) {
			currentThumbnail = thumbnails[0];
			currentThumbnail.addClass('feature-thumbnail-selected');
		}
		thumbnailPanel.setStyle('margin-left', getCenterDelta(currentThumbnail));
		selectFeature(currentThumbnail);
	}
	
	// Given a thumbnail, select the corresponding feature.
	function selectFeature(thumbnail) {
		index = thumbnails.indexOf(thumbnail);
		features[index].fade('in');
	}
	
	// Given a thumbnail, deselect the corresponding feature.
	function deselectFeature(thumbnail) {
		index = thumbnails.indexOf(thumbnail);
		features[index].fade('out');
	}
	
	function getMaskWidth() {
		return thumbnailMask.getStyle('width').toInt();
	}
	
	function getThumbnailWidth() {
		return thumbnails[0].getStyle('width').toInt();
	}
	
	function getSelectedThumbnail() {
		return thumbnailPanel.getElement('.feature-thumbnail-selected');
	}
	
	function getSelectedFeature() {
		return features[thumbnails.indexOf(getSelectedThumbnail())];
	}
	
	function getCenterDelta(thumbnail) {
		var thumbnailRelativeCoordinates = thumbnail.getCoordinates(thumbnailMask);
		var distance = leftPosOfCenteredThumbnail - thumbnailRelativeCoordinates.left;
		var left = thumbnailPanel.getStyle('margin-left').toInt();
		return(left + distance);
	}

	function selectNextThumbnail() {
		var currentThumbnail = getSelectedThumbnail();
		if(currentThumbnail !== null) {
			var nextThumbnail = currentThumbnail.getNext();
			if(nextThumbnail !== null) {
				selectThumbnail(nextThumbnail);
			}
		}
	}
	
	function selectPreviousThumbnail() {
		var currentThumbnail = getSelectedThumbnail();
		if(currentThumbnail !== null) {
			var nextThumbnail = currentThumbnail.getPrevious();
			if(nextThumbnail !== null) {
				selectThumbnail(nextThumbnail);
			}
		}
	}
	
	function initFeaturePositions() {
		features.each(function(feature) {
			feature.setStyle('position','absolute');
			feature.setStyle('left',0);
			feature.setStyle('top',0);
			feature.fade('hide');
		});
		features[thumbnails.indexOf(getSelectedThumbnail())].fade('show');
	}
	
	////thumbnails.each(function(thumbnail, index) {
	////	thumbnail.addEvent('click', function(event){
	////		event.preventDefault();
	////		selectThumbnail(thumbnail);
	////	});
	////});
	
	////$('feature-next').addEvent('click', function(event) {
	////	event.preventDefault();
	////	selectNextThumbnail();
	////});
	
	////$('feature-previous').addEvent('click', function(event) {
	////	event.preventDefault();
	////	selectPreviousThumbnail();
	////});
	
	////initSelectedThumbnail();
	////initFeaturePositions();
});