// JavaScript Document


// define global variable siteRoot
var siteRoot = '';



// ================= INITIALIZATION FUNCTION ================== // 
// as soon as the document is ready, fire the necessary functions
$(document).ready(function() {
	// call all necessary functions
	tabs();
	jwEmbed();
	getBaseHref();
	emailLinks();
	popupLinks();
	toggleVisible();
	clearTextFields();
	buildModal();
});






// ==================================================
// getBaseHref()
// ==================================================
function getBaseHref() {
	var obj = $('base');
	var href = obj.attr('href');
	siteRoot = href;
}





// ==================================================
// emailLinks()
// ==================================================
function emailLinks() {
	var s = $('span.emailLink');
	s.each(function() {
		var email = $(this).text();
		email = email.replace(' [at] ','@');
		email = email.replace(' [dot] ','.');
		$(this).text(email);		
		$(this).wrap('<a href="mailto:'+email+'"></a>');
	});
}





// ==================================================
// popupLinks()
// ==================================================
function popupLinks() {
	var a = $('a.popup');
	a.each(function() {
		if(!$(this).hasClass('noicon')) {
			this.style.backgroundImage = "url(images/popup.png)";
			this.style.backgroundPosition = "top right";
			this.style.backgroundRepeat = "no-repeat";
			this.style.paddingRight = "14px";
			this.style.marginRight = "3px";
		}
		
		// find any images and add alt text to them
		$(this).find('img').attr('alt','Link opens in a new window');
		
		var href = $(this).attr('href');
		$(this).attr('href',"javascript:popup('" + href + "','newWin','')");
		var title = $(this).attr('title');
		$(this).attr('title',title + ' [Opens in New Window]');
	
	});
}




// ==================================================
// popup()
// ==================================================
function popup(url,name,opt) {
	window.open(url,name,opt);
}




// ==================================================
// toggleVisible()
// ==================================================
function toggleVisible() {
	// find all toggle elements
	var o = $('._TOG');
	// hide the elements
	o.toggle();
	// add events to the controllers to toggle visibility
	o.each(function() {
		// store the target element
		var thisObj = $(this);
		// build the controller id and retrieve the controller object
		var controllerID = '_TOG-' + $(this).attr('id');
		var c = $('#'+controllerID);
		c.bind('click',function(e) {
			thisObj.slideToggle('normal');
			// if the controller is a link
			if(c.is('a')) {
				e.preventDefault();
				var imgTag = c.find('img');
				if(imgTag.hasClass('downIcon')) {
					imgTag.removeClass('downIcon');
					imgTag.addClass('upIcon');
				} else {
					imgTag.removeClass('upIcon');
					imgTag.addClass('downIcon');
				}
			}
		});
	});
}





// ==================================================
// pushOffScreen()
// ==================================================
function pushOffScreen(o) {
	o.css('position','absolute');
	o.css('left','-9999px');
}



// ==================================================
// pullOnScreen()
// ==================================================
function pullOnScreen(o) {
	o.css('position','relative');
	o.css('left','0px');
}




// ==================================================
// tabs()
// ==================================================
function tabs() {
	// find and hide all tab content containers (children of ._TABCONTAINER
	var o = $('._TABCONTAINER').children();
	pushOffScreen(o);
	// show first
	pullOnScreen($(o[0]));
	// find all tabs
	var t = $('._TABS').children();
	// activate first tab
	$(t[0]).addClass('tabSelected');
	// add a negative margin to all anchors at the beginnings of each content section to prevent them from jumping visually
	$('._TABANCHOR').css('position','relative');
	$('._TABANCHOR').css('top','-9999px');
	
	// add event handler to tabs
	t.bind('click',function(z) {
		// remove the selected class from all tabs											  
		t.removeClass('tabSelected');
		// add the selected class to the clicked tab
		$(this).addClass('tabSelected');
		// hide all content
		pushOffScreen(o);
		// find the index of the selected tab
		var i = 0;
		t.each(function() {
			if($(this).hasClass('tabSelected')) {
				pullOnScreen($(o[i]));
			}
			i++;
		});
		// now load the appropriate video
		jwLoad();
		// prevent the link from firing
		z.preventDefault();
	});
	
}







// ==================================================
// buildModal()
// ==================================================
function buildModal() {
	// if there is a dialog to be shown
	$('#dialogContainer').each(function() {
		// add the overlay
		$('body').prepend('<div id="dialogOverlay"></div>');
		$('#dialogOverlay').css({ 'opacity':'0.9' , 'height':'100%' });
		// append a link to close the window
		$('#dialogContainer').append('<div id="dialogClose"><a href=""><img src="' + siteRoot + '/images/dialogClose.png" alt="Close Dialog Box" /></a></div>');
		// position the message
		$('#dialogContainer').css({ 'width':'50%' , 'height':'50%' , 'position':'absolute' , 'left':'25%' , 'top':'25%' , 'z-index':'20' , 'opacity':'0' }).fadeTo(1000, 1);
		// set focus
		$('#dialogContainer').focus();
		// add the link behavior
		$('#dialogClose').bind('click', function(e) {
			$('#dialogContainer').fadeTo(500, 0.0, function() { $(this).remove(); });
			$('#dialogOverlay').fadeTo(500, 0.0, function() { $(this).remove(); });
			$('body').attr('tabindex','-1').focus();
			e.preventDefault();
		});
		
	});
}








// ==================================================
// clearTextFields()
// ==================================================
function clearTextFields() {
	var i = $('input[type="text"].clearOnFocus, textarea.clearOnFocus');
	
	i.each(function() {
		var val = $(this).attr('value');
		if(val != '') {
			$(this).bind('focus',function() {
				$(this).attr('value','');						
			});
			
			$(this).bind('blur',function() {
				if($(this).attr(	'value') == '') {
					$(this).attr('value',val);
				}
			});
		}
		
	});
}





// ==================================================
// jwEmbed()
// ==================================================
function jwEmbed() {
	// set vars for flash player
	var flashvars = {};
	var params = {};
	var attributes = {};
	attributes.id = 'JW_player';
	attributes.name = 'JW_player';


	// embed the player
	swfobject.embedSWF(siteRoot + 'assets/jwplayer.swf', 'JW_embed', '220', '180', '9.0.0', 'expressInstall.swf', flashvars, params, attributes);

	// add the links for DRAGON 
	$('#JW_player').after(
			"\n\n" + '<h3>Text Links for Video Control</h3>' +
			"\n\t" + '<div><a href="" id="JW_play">Play Video</a></div>' + 
			"\n\t" + '<div><a href="" id="JW_pause">Pause Video</a></div>' +
			"\n\t" + '<div><a href="" id="JW_volume100">Volume 100</a></div>' +
			"\n\t" + '<div><a href="" id="JW_volume50">Volume 50</a></div>' +
			"\n\t" + '<div><a href="" id="JW_volume0">Volume 0</a></div>'
			);
	
	// play link
	$('#JW_play').bind('click', function(a) {
		jwPlayerReady.sendEvent('PLAY',true);
		a.preventDefault();
	});
	
	// pause link
	$('#JW_pause').bind('click', function(b) {
		jwPlayerReady.sendEvent('PLAY',false);
		b.preventDefault();
	});
	
	// 100% volume link
	$('#JW_volume100').bind('click', function(d) {
		jwPlayerReady.sendEvent('VOLUME',100);
		d.preventDefault();
	});
	
	// 50% volume link
	$('#JW_volume50').bind('click', function(c) {
		jwPlayerReady.sendEvent('VOLUME',50);
		c.preventDefault();
	});
	
	// 0% volume link
	$('#JW_volume0').bind('click', function(e) {
		jwPlayerReady.sendEvent('VOLUME',0);
		e.preventDefault();
	});
}



// ==================================================
// playerReady()
// ==================================================
function playerReady(obj) {
	jwPlayerReady = document.getElementById(obj['id']);
	setTimeout('jwLoad()', 1000);
};



// ==================================================
// jwLoad()
// ==================================================
function jwLoad() {
	// get the tutorial number
	var tutNum = $('ul.tabs').attr('id');
	var tutVid = $('li.tabSelected').attr('id');
	// load the correct video
	var loadVidStr = siteRoot + 'tr/tutorials/tut_' + tutNum + '/' + tutVid + '.mp4';
	// load the appropriate clip
	jwPlayerReady.sendEvent('LOAD', loadVidStr);
}