//This script controls our spotlight control.  
/* It expects a specific markup structure for both the spotlight and the
thing to be spotlit:

<!-- main area -->
<div class="spotlight_this" title="How do my minutes work?">
    <!-- link the user should click -->
	<div class="spotlight_display_object">
		<a href="javascript:void(0)">How do my minutes work?</a>
	</div>
	<!-- content for the actual spotlight -->
	<div class="spotlight_content" style="display:none;">
		Minutes you buy are added to your account.  When you have a session with a tutor, the minutes you use working with your tutor are deducted from your Time Bank. So if you start with 50 minutes and use 10 on Tuesday for algebra homework and 22 on Sunday for a chemistry exam, you'll have 18 minutes left to use whenever you want.
		[Creative note: show this like a math equation instead of the piggy bank, i.e.:]
	</div>
</div>
*/
//Global vars

var OLD_SPOTLIGHT_CONTENT_LOCATION;

//Get spotlight control
var SpotlightControl;

//useful dimensions that other functions might want to manipulate
var SpotlightContentHeight = 450;
var SpotlightContainerHeight = 450;
var SpotlightContainerWidth = 530;

function TurnSpotlightOn(event)
{
	//First get the 'thing' that was clicked.
	var linkHandle = Event.element(event);
	
	//Remember the parent of the thing that was clicked
	OLD_SPOTLIGHT_CONTENT_LOCATION = linkHandle.up(".spotlight_this");
	
	SpotlightElement(linkHandle.up(".spotlight_this").title);
}

//this function assumes that OLD_SPOTLIGHT_CONTENT_LOCATION has already been set
function SpotlightElement(title, moviePath) {

	SpotlightControl = $('SpotlightControl');

	//If it's a movie, just load the movie string. Else, grab the content that hidden on the page.
    //Also, If you've openned the movie, then you should be cookied!
    //FYI on the vars: getMovieAsHTMLString(video_path, video_width, video_height, container_width, container_height, content_height) 

	if (typeof moviePath != 'undefined') {
		SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString(moviePath, 510, 355, null, null, 400);
	}
	else
	{
	    //this function assumes that OLD_SPOTLIGHT_CONTENT_LOCATION has already been set
	    if (OLD_SPOTLIGHT_CONTENT_LOCATION == null)
	        return;

	    //Get the content to be spotlit
	    var spotlightContent = OLD_SPOTLIGHT_CONTENT_LOCATION.down(".spotlight_content");
	

		if (spotlightContent.hasClassName("run_demo_movie")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/tutorcom-overview.swf?spak=sv', 510, 355, null, null, 400);
		}
		else if (spotlightContent.hasClassName("run_cmt_movie")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/tutorcom-overview-cmt.swf?spak=sv', 510, 355, null, null, 400);
		}
		else if (spotlightContent.hasClassName("run_new_video")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/new-video.swf?spak=sv', 510, 340, null, null, 510);
		}
		else if (spotlightContent.hasClassName("run_slideshow")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/slideshow.swf?spak=sv', 510, 355, null, null);
		}
		else if (spotlightContent.hasClassName("run_resume_video")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/media/resume-workshop.swf?spak=sv', 740, 518, 760, 700, 643);
		}
		else if (spotlightContent.hasClassName("run_library_video")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/lhhv4-sales-tour.swf', 740, 600, 760, 700, 643);
		}
		else if (spotlightContent.hasClassName("run_career_center_video")) {
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString('/CareerCenterOffer/career-center-video.swf', 740, 518, 760, 700, 643);
		}
		else if (spotlightContent.hasClassName("run_custom_video")) {
			//pull values from hidden values in the markup
			var custom_height = spotlightContent.down(".spotlight_height").getValue();
			var custom_width = spotlightContent.down(".spotlight_width").getValue();
			var custom_video = spotlightContent.down(".spotlight_video").getValue();
			var custom_content_height = spotlightContent.down(".spotlight_content_height").getValue();
		
			//You must multiply the value of custom height in order to ensure you're getting back an int.
			SpotlightControl.down('div.spotlight_body').innerHTML = getMovieAsHTMLString(custom_video, custom_width, custom_height, custom_width * 1 + 20, custom_height * 1+35, custom_content_height);
		}
		else {
			//Inject the content into the spotlight
			SpotlightContentHeight = 550;
			SpotlightControl.down('div.spotlight_body').appendChild(spotlightContent);
		}
	}
	
	//Set the spotlight title
	$('SpotlightTitle').innerHTML = title;

	//set container dimensions
	setSpotlightContainerDimensions();
	
	//Now that everything is set, turn the light on
	SpotlightControl.down(".spotlight_background").toggle();
	SpotlightControl.down(".spotlight_outer_container").show();
	
	//Make the thing we're spotlighting visible
	$('SpotlightBody').down().show();
	
	//Also, remove owser's ability to scroll.
	$('MasterBody').setStyle({overflow:'hidden'});
		
	//Finally, we also need to turn the visibility of the other flash elements on the page off on the homepage.
	if (window.location.pathname == "/" || window.location.pathname == "/default.aspx")
	{
	    $('FlashOdometer').hide();
	    $('CarouselMovie').hide();
	}
	
	//The menu elements can bleed through when the spotlight is on.  It's easiest to simply hide the nav.
	if ($('NavigationMain') != null)
	{
		$('NavigationMain').hide();
	}
}

function setSpotlightContainerDimensions() 
{
	//Window dimensions
	var dims = Position.GetWindowSize();
	
	//set the 'top' so we're in the middle of the displayed area
	if (SpotlightContentHeight != 0) {
		var scrolltop = document.viewport.getScrollOffsets().top;
		var offsettop = ((dims[1] - SpotlightContentHeight) / 2) + scrolltop;
		SpotlightControl.down(".spotlight_outer_container").setStyle({ top: offsettop + "px" });
	}

	//Set the width of the spotlight window and center it
	if (SpotlightContainerWidth != 0 && SpotlightContainerHeight != 0) {
		SpotlightControl.down(".spotlight_outer_container").setStyle({ width: SpotlightContainerWidth + "px" });
		SpotlightControl.down(".spotlight_inner_container").setStyle({ maxHeight: SpotlightContainerHeight + "px" });
		SpotlightControl.down(".spotlight_outer_container").setStyle({ left: ((dims[0] - SpotlightContainerWidth) / 2) + "px" });
	}
}

function getMovieAsHTMLString(video_path, video_width, video_height, container_width, container_height, content_height) 
{
	var movieAsString =

	'<object type="application/x-shockwave-flash" data="' + video_path + '" width="' + video_width + '" height="' + video_height + '">' +
	 '<param name="movie" value="' + video_path + '">' +
	 '<param name="bgcolor" value="#FFFFFF">' +
	 '<param name="menu" value="false">' +
	 '<param name="quality" value="high">' +
	  '<h3>No flash</h3>' +
	  '<br>Please install <a href="http://www.macromedia.com/go/getflashplayer" target="_blank">FLASH plugin</a>.' +
	'</object>';

	SpotlightContentHeight = content_height;
	
	if (container_width != null && container_height != null) {
		SpotlightContainerHeight = container_height;
		SpotlightContainerWidth = container_width;
	}

	//We may or may not still need this.  Either way, it's better to simply set the value ONCE here.
	document.cookie = 'demoviewer=true; expires=Sun, 1 Jan 2012 01:00:00 UTC; path=/';

	return movieAsString;
}

function TurnSpotlightOff(event)
{
	//Turn the spotlight off
	var SpotlightControl = $('SpotlightControl');
	SpotlightControl.down(".spotlight_background").toggle();
	SpotlightControl.down(".spotlight_outer_container").toggle();
	
	//Hide the thing had spotlit
	$('SpotlightBody').down().hide();
	
	//If we had the video in the spotlight, we need to flush the inner html
	//Otherwise, we simply return the item to it's original location, hidden on the page.
	if ($('SpotlightBody').down("object"))
	{
		$('SpotlightBody').innerHTML = "";
	}
	else
	{
	    OLD_SPOTLIGHT_CONTENT_LOCATION.appendChild($('SpotlightBody').down());
	}
	OLD_SPOTLIGHT_CONTENT_LOCATION = null;
	
	//Return the ability to scroll
	$('MasterBody').setStyle({overflow:'auto'})
	
	//We also need to turn the visibility of the other flash elements back on for the homepage.
	if (window.location.pathname == "/" || window.location.pathname == "/default.aspx")
	{
	    $('FlashOdometer').show();
	    $('CarouselMovie').show();

	    getRecentSessions();
	}
	
	//Turn the navigation back on.
	if ($('NavigationMain') != null)
	{
		$('NavigationMain').show();
	}
}

var SPOTLIGHT_LOADED = false; //global var to track spotlight loaded status
Event.observe(window, 'load', function(){

	var spotlights_on = $$('div.spotlight_display_object');
	//if there are no on switches, then there's no point in doing anything else
	
	if (spotlights_on.length > 0)
	{
		for (var index = 0; index < spotlights_on.length; index++)
		{
			Event.observe(spotlights_on[index], 'click', TurnSpotlightOn);
			Event.observe(spotlights_on[index], 'spotlight:show', TurnSpotlightOn);			
			
			//There's 2 types of additional
			//calls we want to make depending on if a homepage video or a secondary video was clicked.
			if (spotlights_on[index].up("#DemoVideo.homepage"))
			{
				Event.observe(spotlights_on[index], 'click', function(){
					Analytics_TrackPage("session-demo.html?event=HomepageVideo-Clicked", '/session-demo.html?event=HomepageVideo-Clicked');
				});
			}
			else
			{
				Event.observe(spotlights_on[index], 'click', function(){
					Analytics_TrackPage("session-demo.html?event=SecondaryPageVideo-Clicked", '/session-demo.html?event=SecondaryPageVideo-Clicked');
				});
			}
			
		}
	}
});
SPOTLIGHT_LOADED = true;