function createSLObjects(param)
{
  var	player = new StartPlayer_0(param);
}

var wasFullScreen = false; 	// we are not in full screen mode

var playingDemo = false;

var main; 					// standard SL stuff
var plugin; 					// standard SL stuff

var stage_width = 735; 		// this is set globally for other globals to find before any function loads

var selectedDemo = "none";
function mainCanvasLoaded(s)
{
	// get reference to main canvas, sets it globally for other functions to use
	main = s.findName("mainCanvas");
	main.findName("VideoWindow").setValue("Source", introVideo);
	dcsMultiTrack("DCS.dcssip", "www.microsoft.com", "DCS.dcsuri", "/dynamics/extendingthereach", 'WT.ti', 'Video: Intro Video');
	// get reference to XAML object, sets it globally for other functions to use
	plugin = s.getHost();
}

// this determines the layout and mouseover events based on the length of the video array.
// these vars are needed to build the dynamic video menu.
// even numbered layouts such as 2,4,6 will not trigger the incremental scaling of the buttons display.
// this is currently set to handle up to 10 videos. Additional layouts can be added.
var incScale = 0.0;
var shift_right = 0;
var tweakLeft = 100;
var tweakRight = 70;
var imagesHolder_width = 0;
var tile_scale = 1;
var tile_scale_up_to = 1.1;
var tile_img_width = (stage_width / (videoArr.length + (videoArr.length * 0.3)));
var additional_space = tile_img_width * 0.32;
var menuHolderTop = 430;


// the tile height is set to three quarters of the width
var tile_img_height = 105;

// static vars for the menu build
var tile_top = 0;
var tile_z = 0;
var tileObjsArr = new Array();
var videoTilePropsArr = new Array();


// this loops through each name in the video array and creates x number of objects with basic properties
for (i = 0; i < videoArr.length; i++)
{

	tileObjsArr[i] = new Object();

	tileObjsArr[i].x = i * shift_right;
	tileObjsArr[i].x = shift_right;
	tileObjsArr[i].y = tile_top;
	tileObjsArr[i].z = tile_z;

	tileObjsArr[i].width = tile_img_width;
	tileObjsArr[i].height = tile_img_height;

	tileObjsArr[i].scale = tile_scale;
	tileObjsArr[i].center_x = tile_img_width / 2;
	tileObjsArr[i].center_y = tile_img_height / 2;


	// this sets the tapering effect for odd number of videos and the spacing between each tile
	// the scale increment is set to zero for even numbered arrays.

	if (i < Math.floor(videoArr.length / 2))
	{
		if (i == ((videoArr.length - 1) / 2))
		{
			tile_z = videoArr.length - 1;
		}
		else
		{
			tile_z += 1;
		}
		nextspot = shift_right + (tile_img_width * tile_scale) + additional_space;
		tile_scale += incScale;
		shift_right = nextspot;
	}
	else
	{
		tile_z -= 1;
		tile_scale -= incScale;
		nextspot = shift_right + tile_img_width * tile_scale + additional_space;
		shift_right = nextspot;
	}
}

// the width of the entire menu
tileHolder_width = tileObjsArr[videoArr.length - 1].x + tileObjsArr[videoArr.length - 1].width;

// now that we have a bunch of objects with parameter values
// lets put those values into XAML properties and append the XAML to our silverlight
function buildImages(sender)
{
	// Lets start building a long string of XAML code 
	// first open and position the enclosing menu canvas
	// here we are adding the mouse enter and move events to the main menu holder

	//MouseMove="whenMouseMoves"
	var tileHolder_str = '<Canvas Name="tilesHolder" Canvas.Left="' + ((stage_width - tileHolder_width) / 2) + '" Canvas.Top="' + menuHolderTop + '">';

	// now cycle through for each name in the video arrray 
	for (i = 0; i < videoArr.length; i++)
	{
		// assign some positioning values for each button in the video menu
		tileHolder_left = tileObjsArr[i].x;
		tileHolder_top = tileObjsArr[i].y;
		tile_z = tileObjsArr[i].z;

		tileHolderReflection_top = (tileObjsArr[i].height + 10);

		tile_img_width = tileObjsArr[i].width;
		tile_img_height = tileObjsArr[i].height;

		scale_x = scale_y = tileObjsArr[i].scale;
		center_x = tileObjsArr[i].center_x;
		center_y = tileObjsArr[i].center_y;

		// start building the XAML string
		// the source jpeg is set by combining the image directory with the name and the format.
		// the same jpeg is also flipped and faded out to create a reflection effect

		tileHolder_str += '<Canvas xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Name="tileHolder_' + i + '" Cursor="Hand" MouseLeftButtonUp="tilePress"  Canvas.Left="' + tileHolder_left + '" Canvas.Top="' + tileHolder_top + '" Canvas.ZIndex="10">';

		tileHolder_str += '	<Canvas Name="demoTitleHolder_' + i + '" Canvas.Top="' + tileHolderReflection_top + '">';
		tileHolder_str += '   <TextBlock FontSize="12" FontWeight="Bold" FontFamily="Arial" Foreground="#FF838383" Name="demoTitle_' + i + '" Width="' + tile_img_width + '" Text="' + window['xTitle_' + videoArr[i]] + '" />';
		tileHolder_str += '	</Canvas>';
		tileHolder_str += ' <Canvas Name="demoBlurbHolder_' + i + '" Canvas.Top="' + (tileHolderReflection_top + 16) + '">';
		tileHolder_str += '   <TextBlock FontSize="10" TextWrapping="Wrap" FontWeight="Normal" FontFamily="Arial" Foreground="#FF838383" Name="demoBlurb_' + i + '" Width="' + tile_img_width + '" Text="' + window['xBlurb_' + videoArr[i]] + '" />';
		tileHolder_str += ' </Canvas>';
		// here we are adding the mouseenter, mouseleave and mousedown events to each button tile
		tileHolder_str += '	<Canvas Name="imgHolder_' + i + '" Canvas.Left="-13" MouseEnter="tileEnter" MouseLeave="tileLeave"  >';
		tileHolder_str += '   <Canvas.Resources>';
		tileHolder_str += '    <Storyboard x:Name="ThumbMouseEnter_' + i + '">';
		tileHolder_str += '  		<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="imgHolder_' + i + '" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">';
		tileHolder_str += ' 			<SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1.1"/>';
		tileHolder_str += ' 		</DoubleAnimationUsingKeyFrames>';
		tileHolder_str += ' 		<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="imgHolder_' + i + '" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">';
		tileHolder_str += ' 			<SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1.1"/>';
		tileHolder_str += ' 		</DoubleAnimationUsingKeyFrames>';
		tileHolder_str += '	   </Storyboard>';
		tileHolder_str += '    <Storyboard x:Name="ThumbMouseLeave_' + i + '">';
		tileHolder_str += '  		<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="imgHolder_' + i + '" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">';
		tileHolder_str += ' 			<SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1"/>';
		tileHolder_str += ' 		</DoubleAnimationUsingKeyFrames>';
		tileHolder_str += '		  <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="imgHolder_' + i + '" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">';
		tileHolder_str += ' 			<SplineDoubleKeyFrame KeyTime="00:00:00.1000000" Value="1"/>';
		tileHolder_str += ' 		</DoubleAnimationUsingKeyFrames>';
		tileHolder_str += '	   </Storyboard>';
		tileHolder_str += '	 </Canvas.Resources>';
		tileHolder_str += '		<Image Name="img_' + i + '" Stretch="Fill" Source="images/silverlight/thumbs/' + videoArr[i] + '.jpg" />';
		tileHolder_str += '	 <Canvas.RenderTransform><TransformGroup><ScaleTransform Name="st_' + i + '" ScaleX="' + scale_x + '" ScaleY="' + scale_y + '" CenterX="' + center_x + '" CenterY="' + center_y + '"/></TransformGroup></Canvas.RenderTransform>';
		tileHolder_str += '	</Canvas>';
		tileHolder_str += '</Canvas>';

		tileObjsArr[i].parent = "tileHolder_" + i;
		tileObjsArr[i].scaleTransform = "st_" + i;
	}
	// long menu button string of XAML code is built
	// sandwich the menu buttons between the holder canvas and close it
	tileHolder_str += '</Canvas>';
	// alert(tileHolder_str) to see the XAML chunk

	// use createFromXAML to turn the string into real working XAML canvas object
	var xamFrag = plugin.content.createFromXaml(tileHolder_str);
	// using the global reference to teh main canvas
	// add our new XAML frgment as a child of the main canvas
	main.children.add(xamFrag);


	for (i = 0; i < videoArr.length; i++)
	{
		var holder = main.findname('tileHolder_' + i);
		var blurb = main.findName('demoBlurb_' + i);

		var linkString = '<Canvas Name="demoLinkHolder_' + i + '" Canvas.Top="' + (tileHolderReflection_top + 16 + blurb.ActualHeight + 5) + '">';
		linkString += '<TextBlock FontSize="12" TextDecorations="Underline" FontWeight="Bold" FontFamily="Arial" Foreground="#FF838383" Name="demoLink_' + i + tile_img_width + '" Width="' + tile_img_width + '" Text="View now >>" />';
		linkString += '</Canvas>';

		var xaml = plugin.content.createFromXaml(linkString);
		holder.children.add(xaml);
	}
}

// a video just ended, lets display and end screen
function theMovieEnded(s)
{
	var vid = s.findName("VideoWindow");
	vid.Stop();

	main.findName("placeFadein0").Begin();
	
	main.findName("intermScreens").Visibility = "Visible";
	main.findName("PlayerControls").Visibility = "Collapsed";
	main.findName("skipIntroBtn").Visibility = "Collapsed";
	vid.Visibility = "Collapsed";
}

function replayIntro(sender)
{
	sender.findName("replayIntroAnim").Begin();
	var vid = sender.findName("VideoWindow");
	vid.Position = "00:00:00";
}

function replayIntroAnimCompleted(sender)
{
	sender.findName("intermScreens").Visibility = "Collapsed";
	sender.findName("PlayerControls").Visibility = "Visible";
	
	if(playingDemo !== true)
	{
	  main.findName("skipIntroBtn").Visibility = "Visible";
	}
	var vid = sender.findname("VideoWindow");
	
	vid.Visibility = "Visible";
	vid.Play();	
}

function getTheVideo(thevideo)
{
	vid = main.findName("VideoWindow");
	vid.Visibility = "Visible";
	vid.source = thevideo;
	
	// set screen up to false since we just faded it out
	main.findName("PlayerControls").Visibility = "Visible";
	main.findName("intermScreens").Visibility = "Collapsed";
}

var orgMediaHeight; // global var
var orgMediaWidth; // global var

// this exicutes when the uses leaves full screen
function leavingFullScreen(sender, orgH, orgW)
{
	// get reference to the media Element
	var mediaElement = sender.findName("VideoWindow");

	// size it back to it's original settings based on the passed values
	mediaElement.height = orgH;
	mediaElement.width = orgW;


	if (playingDemo == true)
	{
		mediaElement.setValue("Canvas.Left", 10);
	}
	else
	{
		mediaElement.setValue("Canvas.Left", 0);
	}
	mediaElement.setValue("Canvas.Top", 0);

	// Since the Silverlight control is not in fullscreen mode, make the video buttons visible.
	sender.findName("PlayerControls").visibility = "Visible";
	sender.findName("tilesHolder").visibility = "Visible";

	if (playingDemo !== true)
	{
		sender.findName("skipIntroBtn").visibility = "Visible";
	}
}

// this handles what happends when the user double clicks the video, entering SL full-screen mode
function onFullScreenChanged(sender, args)
{
	// Get a reference to the Silverlight control that is hosted in the HTML page.
	var silverlightControl = sender.getHost();


	// Get a reference to the media player.
	var mediaElement = sender.findName("VideoWindow");
	var canvasMain = sender.findName("mainCanvas");


	if (wasFullScreen !== true)
	{
		// if we just entered full screen, was full screen was false
		// first lets store the original size of the video player in a global
		orgMediaHeight = mediaElement.height;
		orgMediaWidth = mediaElement.width;

		mediaElement.height = silverlightControl.Content.actualHeight;
		mediaElement.width = silverlightControl.Content.actualWidth;

		if (playingDemo === true)
		{
			mediaElement.setValue("Canvas.Left", 0);
		}
		
		// Since the Silverlight control is in fullscreen mode, make the video buttons invisible.
		sender.findName("PlayerControls").visibility = "Collapsed";
		sender.findName("tilesHolder").visibility = "Collapsed";
		sender.findName("skipIntroBtn").visibility = "Collapsed";

		// set wasFullScreen to true, so the correct statement execute when the user leaves full screen
		wasFullScreen = true;
	}
	else
	{
		// if we were already in full screen, now we are leaving
		// first pass leaving FullScreen the original height and width values
		leavingFullScreen(sender, orgMediaHeight, orgMediaWidth);

		// now set wasFullScreen to false, so the correct statement executes when the user enters full screen	
		wasFullScreen = false;
	}
}


// this handles the mouse over effects for the dynamiclly added video menu button tiles
function tileEnter(sender)
{
	var index = sender.Name.split("_")[1];
	sender.findName("ThumbMouseEnter_" + index).Begin();		
}

function tileLeave(sender)
{
	var index = sender.Name.split("_")[1];
	var selectedDemoIndex = selectedDemo.split("_")[1];
	
	if (selectedDemoIndex != index)
	{
		sender.findName("ThumbMouseLeave_" + index).Begin();
	}
}

function tilePress(s, e)
{
	vid = main.findName("VideoWindow");
	vid.Stop();
	
	var ind = s.name.split("_")[1];
	var video = eval("xVideo_" + videoArr[ind]);
	getTheVideo(video);

	// WebTrends tracking
	dcsMultiTrack("DCS.dcssip", "www.microsoft.com", "DCS.dcsuri", "/dynamics/extendingthereach", 'WT.ti', 'Video: ' + videoArr[ind]);

	vid.setValue("Canvas.Left", 10);
	vid.setValue("Width", 715);

	main.findName("skipIntroBtn").Visibility = "Collapsed";
	selectedDemo = s.Name;
	playingDemo = true;

	for (var i = 0; i < videoArr.length; i++)
	{
		tileLeave(s.findName("imgHolder_" + i));
	}
}


function introLinkClicked(sender)
{
	switch (sender.Name)
	{
		case "DiscoverMoreLink": window.location = "Discover.aspx";
			break;
		case "TestDriveNowLink": window.location = "Experience.aspx";
			break;
		case "LearnMoreNowLink": window.location = "Validate.aspx";
			break;
		case "ContactUsNowLink": window.location = "ContactUs.aspx";
			break;
	}
}