/*	-----------------------------------------------------------------
	
	PREFLIGHT
	take care of the following before putting this player live:
	
	-	host mediaplayer.swf on media.premier.org.uk and link to it (function changestage())
	-	create new nns_content directory on the live server and change all paths to point to /global/.../nns_content/etc
	>>	optionally write short documentation for webteam
	
	STAGE TWO
	for permanent use on the site
	
	-	find a way to feed data to the javascript from sitecore
	
	-----------------------------------------------------------------	*/
/*	-----------------------------------------------------------------
	
	INIT
	set up all variables
	
	-----------------------------------------------------------------	*/

var pageTracker = null;
var activefeature = 0;	// picks the first feature by default. change this to change the default feature. must be a valid integer index.
var activeteaser = activefeature;

var nns_debug = false;

var nns_container = document.getElementById('nns_container');
var nns_thumbs = document.getElementById('nns_thumbs');
var nns_stage = document.getElementById('nns_stage');
var nns_teaser = document.getElementById('nns_teaser');
var nns_image_interval = []; // stores the intervals for images that refresh so we can stop them

// a shortcut
var nns = {
	0 : nns_container,
	1 : nns_thumbs,
	2 : nns_stage,
	3 : nns_teaser
};


/*	-----------------------------------------------------------------
	
	DECLARE MAIN FUNCTIONS
	
	-----------------------------------------------------------------	*/

function dbg(msg) {
	if (nns_debug) {
		document.getElementById('dbg').innerHTML = msg + '<br />' 
			+ document.getElementById('dbg').innerHTML;
	}
	
	return null;
}

function dump() {
	return null;
}


dbg('<br />dumping array content');
dbg(dump(nns_content));




function changeteaser(teaser, islink) {
	dbg('CT:');
	dbg('islink? ' + islink);
	dbg('requesting teaser ' + teaser);
	dbg('- - -');
	
	if (islink == 'link') {
		nns[3].innerHTML = '<strong>' + nns_content[activefeature]['title'] 
			+ '</strong><p>' + nns_content[activefeature]['main_copy'] + '</p>';
	} else {
		nns[3].innerHTML = '<strong>' + nns_content[teaser]['title']
			+ '</strong><p>' + nns_content[teaser]['main_copy'] + '</p>';
	}
}

function fadethumb(direction, i) {

	thumb = nns_content[i];
	
	var fadeeffect = new Fx.Style('thumbspan_' + thumb['codename'], 'opacity', 
			{duration: 400, wait: false, onComplete: function() {
				// meh.
			}
		});
	
	if (direction == 'in') {
		fadeeffect.start(0.01, 0.8);
	} else if (direction == 'out') {
		fadeeffect.start(0.8, 0.01);
	}

}

function changeindicator(active, wantclear) {
	
	if (wantclear == 'yes') {
		for (var contentIndex = 0; contentIndex < nns_content.length; ++contentIndex) {
			var targetContent = nns_content[contentIndex];
			
			var movebgout = new Fx.Style('thumb_' + targetContent['codename'], 'background-position', {duration: 400});
			
			var anybgy = (targetContent['thumb_height'] / 2) - 4;
			movebgout.start('3px ' + anybgy + 'px', '20px ' + anybgy + 'px');
		
		}
	}
	
	var movebgin = new Fx.Style('thumb_' + nns_content[active]['codename'], 'background-position', {duration: 400, onComplete: function() {
		changeteaser(activeteaser);
		dbg('<strong>!</strong> changestage finished, to activeteaser');
	}});
	var activebgy = (nns_content[active]['thumb_height'] / 2) - 4;
	movebgin.start('20px ' + activebgy + 'px', '3px ' + activebgy + 'px');

}

function fadestage(direction) {
	var stagefade = new Fx.Style('nns_stage', 'opacity', {duration: 1000});
	
	if (direction == 'out') {
		stagefade.start(1, 0.01);
	} else if (direction == 'in') {
		stagefade.start(0.01, 1);
	}

}

var nns_tracked = [], nns_track_click = 1, nns_track_done = 2; // Only log clicks once
var nns_track_timeout = null;

function nns_track()
{
	// This can be called before page tracker is available but it will ho
	if (pageTracker == null) {
		nns_track_timeout = setTimeout(nns_track, 100);
		return;
	}
	if (nns_track_timeout != null) {
		clearTimeout(nns_track_timeout);
		nns_track_timeout = null;
	}

	// Track recent clicks
	for (var trackIndex = 0; trackIndex < nns_tracked.length; ++trackIndex) {
		if (nns_tracked[trackIndex] == nns_track_click) {
			pageTracker._trackPageview('/nns/' + nns_content[trackIndex]['codename']);
			nns_tracked[trackIndex] = nns_track_done;
		}
	}
}

	
function changestage(i) {
	activefeature = activeteaser = i;
	
	var data = nns_content[i];
	
	dbg('activefeature set to ' + data['codename']);

	if (!nns_tracked[i]) {
		nns_tracked[i] = nns_track_click;
		nns_track();
	}

	// changeteaser(activefeature);

	dbg('stage content is ' + data['title'] + ' (' + data['codename'] + ')');
	
	// find stage size for positioning (first method)
	
	var stageheight = -10;
	for (var contentIndex = 0; contentIndex < nns_content.length; ++contentIndex) {
		var targetContent = nns_content[contentIndex];
		stageheight = stageheight + targetContent['thumb_height'] + 10;
	}
	dbg('STAGEHEIGHT IS ' + stageheight);
	
	var uniqueId = 'nns_elem_' + i;
	// if type == IMAGE
	
	if (data['content_type'] == 'image' && data['image_uri'] != undefined && data['image_uri'] != '') {
		if (data['image_refresh'] != undefined) {
			var refreshInterval = parseInt(data['image_refresh']);
			if (!isNaN(refreshInterval)) {
				if (nns_image_interval[i] != undefined && nns_image_interval[i] != null) {
					clearInterval(nns_image_interval[i]);
					nns_image_interval[i] = null;
				}
				
				nns_image_interval[i] = setInterval('var currentTime = new Date(); document.getElementById(\'' + 
					uniqueId + '\').src = \'' + data['image_uri'] + 
					'?date=\' + currentTime.getTime();',
					refreshInterval < 10 ? 10 : refreshInterval);
			}
		}
		
		linkTagStart = data['image_link'] ? '<a href="' + data['image_link'] + '" target="' + data['image_linktarget'] + '">' : '';
		linkTagEnd = data['image_link'] ? '</a>' : '';
		
		nns[2].innerHTML = '<div id="nns_stage_image">' + linkTagStart + '<img id="' + uniqueId + '" src="' + data['image_uri'] + '" />' + linkTagEnd + '</div>';
			
		nns[2].className = 'image';

		if (stageheight > data['image_height']) {
		
			var moveimage = new Fx.Style('nns_stage_image', 'padding-top', {duration: 400});
			imagemargin = ((stageheight - data['image_height']) / 2) + 3;
			
			moveimage.set(imagemargin);
		
		}
	
	// if type == VIDEO
	
	} else if (data['content_type'] == 'video') {
		nns[2].innerHTML = '<div id="nns_stage_video"></div>';
		
		var so = new SWFObject('http://media.premier.org.uk/miscvideo/mediaplayer.swf', 'mpl', data['video_width'], data['video_height'], '8');
		so.addParam('allowscriptaccess','always');
		so.addParam('allowfullscreen','true');
		so.addParam('wmode','transparent');
		so.addVariable('height', data['video_height']);
		so.addVariable('width', data['video_width']);
		so.addVariable('file', data['video_uri']);

		so.addVariable('backcolor','0x000000');
		so.addVariable('frontcolor','0xEEEEEE');
		so.addVariable('lightcolor','0x000000');
		so.addVariable('screencolor','0x000000');

		so.addVariable('image', data['video_img']);
		so.addVariable('displayheight', data['video_height']);
		so.addVariable('showstop','true');
		so.addVariable('usefullscreen','true');
		so.write('nns_stage_video');

		nns[2].className = 'video';

		if (stageheight > data['video_height']) {
		
			var movevideo = new Fx.Style('nns_stage_video', 'padding-top', {duration: 400});
			videomargin = ((stageheight - data['video_height']) / 2) + 3;
			
			movevideo.set(videomargin);
		
		}
		
	} else if (data['content_type'] == 'text') {
	
		nns[2].innerHTML = 
			'<strong>' + data['long_title'] + '</strong>' 
			+ data['long_text'];
			
		nns[2].className = 'text';
		
	} else if (data['content_type'] == 'audio') {
		
		nns[2].innerHTML = '<div id="nns_stage_audio"><img src="' 
			+ data['image_uri'] + '" height="' + data['image_height'] + '" width="' 
			+ data['image_width'] + '" /><div id="nns_stage_audio_player"></div></div>';
		
		var so = new SWFObject('http://media.premier.org.uk/miscvideo/mediaplayer.swf', 'mpl', '324', '20', '8');
		so.addParam('allowscriptaccess','always');
		so.addParam('allowfullscreen','false');
		so.addVariable('height','20');
		so.addVariable('width','324');
		so.addVariable('file', data['audio_uri']);
		
		if (nns_style == 'white') {
			so.addVariable('backcolor','0xFFFFFF');
			so.addVariable('frontcolor','0x000000');
			so.addVariable('lightcolor','0xFFFFFF');
		} else {
			so.addVariable('backcolor','0x000000');
			so.addVariable('frontcolor','0xEEEEEE');
			so.addVariable('lightcolor','0x000000');
			so.addVariable('screencolor','0x000000');
		}
		
		if (data['audio_volume']) {
			so.addVariable('volume', data['audio_volume']);
		} else {
			so.addVariable('volume', '100');
		}
		
		so.addVariable('showstop','true');
		so.write('nns_stage_audio_player');
		
		if (data['image_height']) {
			audioheight = 20 + data['image_height'] + 1;
		} else {
			audioheight = 20;
		}
		
		if (stageheight > audioheight) {
			var moveaudio = new Fx.Style('nns_stage_audio', 'padding-top', {duration: 400});
			audiomargin = ((stageheight - audioheight) / 2) + 3;
			moveaudio.set(audiomargin);
		}
		
	} // end if content_type == smth
	
	changeindicator(activefeature, 'yes');
	// changeteaser(activefeature); // once more, just in case
} // changestage

function resizeelements() {
	for (var contentIndex = 0; contentIndex < nns_content.length; ++contentIndex) {
		var targetContent = nns_content[contentIndex];
		var linkw = new Fx.Style('thumblink_' + targetContent['codename'], 'width', {duration: 400});
		linkw.set(targetContent['thumb_width']);
		dbg(targetContent['codename'] + ' resized');
	}
}

function init(i) {
	dbg('init()');
	changestage(i);		// change this to change the default feature
	resizeelements();
}





/*	-----------------------------------------------------------------
	
	POPULATE ELEMENTS
	
	-----------------------------------------------------------------	*/

for (var contentIndex = 0; contentIndex < nns_content.length; ++contentIndex) {
	var targetContent = nns_content[contentIndex];
	
	nns[1].innerHTML += 
		'<div class="thumb" id="thumb_' + targetContent['codename'] + '">'
		+ '<a id="thumblink_' + targetContent['codename'] + '" href="#" onclick="changestage(' 
		+ contentIndex + '); this.blur(); return false;" ' 
		+ 'onmouseover="changeteaser(\'' + contentIndex + '\'); return false;" '
		+ 'onmouseout="changeteaser(\'' + activefeature + '\', \'link\'); return false;">'
		+ '<img src="/global/inc/nns_content/' + targetContent['codename'] + '/' 
		+ targetContent['thumb_img'] + '" height="' + targetContent['thumb_height'] + '" />'
		+ '<span onclick="this.blur();" id="thumbspan_' + targetContent['codename']
		+ '" style="line-height: ' + targetContent['thumb_height'] + 'px; height: '
		+ targetContent['thumb_height'] + 'px; width: ' + targetContent['thumb_width']
		+ 'px;" onmouseover="fadethumb(\'in\', ' + contentIndex + 
		');" onmouseout="fadethumb(\'out\', ' + contentIndex + ');">' + 
		targetContent['thumb_copy'] + '</span></a></div>';
}

init(activefeature);



var initialFadeIn = function()
{
	for (var contentIndex = 0; contentIndex < nns_content.length; ++contentIndex) {
		var targetContent = nns_content[contentIndex];

		var hidespans = new Fx.Style('thumbspan_' + targetContent['codename'], 'opacity', {duration: 400});
		hidespans.start(0.8, 0.01);
		
		dbg('hidden ' + targetContent['codename']);
	}
	
	dbg('- - -');
	dbg('ONLOAD FINISHED');
	dbg('activefeature is ' + activefeature);
	dbg('- - -')
}
setTimeout(initialFadeIn, 2000);