	var requiredMajorVersion 	= 9;	// Major version of Flash required
	var requiredMinorVersion 	= 0;	// Minor version of Flash required
	var requiredRevision 		= 45;	// Revision of Flash required
	
	var params = HttpUtils.getQueryAsObject(); //gets query string vars
	
	//var dsregEx 				= /ctn\dcma\d.\d\d\d\d/;
	var dsregEx 				= /cnvideosvc2.cartoonnetwork.com/;
	
	
	//var dsreplace				= "redesign.cartoonnetwork.com/cnvideosvc2"
	//var dsreplace				= "staging.cartoonnetwork.com/cnvideosvc2"
	var dsreplace				= "www.cartoonnetwork.com/cnvideosvc2"


	//dataset to load configuation.xml file 
	//var dsconfigPath			= "http://redesign.cartoonnetwork.com/cnvideosvc2/staged/CN2.staging.configuration.xml?r="  + getRandomNumber();
	//var dsconfigPath			= "http://staging.cartoonnetwork.com/cnvideosvc2/staged/CN2.staging.configuration.xml?r="  + getRandomNumber();
	var dsconfigPath			= "http://www.cartoonnetwork.com/video/staged/CN2.configuration.xml?r="  + getRandomNumber();


	var dsConfig 				= new Spry.Data.XMLDataSet(dsconfigPath, "/config");					
	
	var ndsEpisodesByShowPath	= new Spry.Data.NestedXMLDataSet(dsConfig, "services/episodesByShow");		//nested dataset to load episode URL
	var ndsVideoPlayListPath	= new Spry.Data.NestedXMLDataSet(dsConfig, "services/getVideoPlaylist");	//nested dataset to load videoPlaylist URL
	var ndsRatingsPath			= new Spry.Data.NestedXMLDataSet(dsConfig, "services/rankEpisode");			//nested dataset to load ranking URL
	var ndsGetTimeStamp			= new Spry.Data.NestedXMLDataSet(dsConfig, "timestamp");					//nested dataset to load timestamp
	
	var dsEpisodesByShow;										//dataset to hold all the shows episodes

	var configObserver = new Object;							//spry observer type of event listener
	
	var loadedEpisodesByShow = false;							//flag to mark when URL for show episodes was loaded
	var loadedTimeStamp = false;								//flag to mark when time stamp was loaded
	var loadedVideoPlaylistPath = false;						//flag to mark when playlist path was loaded
	var loadedRatingsPath = false;								//flag to mark when ratings path was loaded

	//hard code the value of the showID you are working with
	var showID = "8a250ab022dbb5370122e6902cbf00e9";			
	

	//hard code the value for the page location.
	var pageUrl = "http://www.cartoonnetwork.com/clonewars/index2.html";		
	
	var pathRatings;											//URL to ratings post
	var pathEpisodeByShow;										//URL to get the shows episodes comes from cofiguration.xml
	var pathVideoPlayList;										//URL to get the Video Play List comes from cofiguration.xml
	var pathVideoPlayListQueryString;
	var timeStampNextGen;										//next gen cache busting comes from cofiguration.xml
	var resultsLimit;											//limit of results returned comes from cofiguration.xml
	var previous_btn = "previous";								//vars to use for javascript buttons
	var next_btn = "next";										//vars to use for javascript buttons
		
	//flash communication
	var flashVideoCommunication = new FlashVideoCommunication(); //required
	
	var videoConfigFlashVars	= null;

	var videoList 				= new Array(0);
	// videoList[0].id 				- <episode id="8a25030a209062eb0120b598510c0021"
	// videoList[0].thumb 			- <episode thumbnailUrl="http://orbitint-web1:9289/collections/4a0b0/episodes/510c0/img/thumbnail.jpg"
	// videoList[0].title			- <episode title="Episode 105"
    // videoList[0].description 	- <episode <description><![CDATA[A boy named Dan finds... and powerful Naga.]]></description>
	// videoList[0].morebutton 			- <episode contentTags="http://www.cartoonnetwork.com"
	// videoList[0].ranking				- <episode ranking="2.0"
	// videoList[0].segmentid[0]		- <segments> <segment id="8a25030a209062eb0120b5994bb20023"
		// videoList[0].segmentid[1]		- <segment id="8a25c392183650ad011837c94dc00014"
		// videoList[0].segmentid[2]		- <segment id="8a25c392183650ad011837c96f520017" etc... 
	 
	var videoListIndex 			= 0;							//keeps track of the current location in the video list array
	var videoListSegmentIndex 	= 0;							//keeps track of the current segment location of the episode in the video list 
	var reachedPlayListEnd		= false;						//flag to mark when a user has reached the end of the video list array
	var continuousPlayEnabled 	= true;							//flag to mark if Continuos play 
	
	var sp1;
	var thumbnailStart 		= 0;
	var thumbnailEnd		= 0;

	//querystring vars -----------------------------------------------------------------------------------------------------------------------------------------------//
	if(params.section != null) 		videoConfigFlashVars = "FLASHVARS_defaultSection=" 		+ params.section;
	if(params.categoryID != null) 	videoConfigFlashVars = "FLASHVARS_defaultCategoryID=" 	+ params.categoryID;
	if(params.showID != null) 		videoConfigFlashVars = "FLASHVARS_defaultShowID=" 		+ params.showID;
	if(params.episodeID != null) 	videoConfigFlashVars = "FLASHVARS_defaultEpisodeID=" 	+ params.episodeID;
	if(params.segmentID != null) 	videoConfigFlashVars = "FLASHVARS_defaultSegmentID=" 	+ params.segmentID;	
	
	
	//end querystring vars -----------------------------------------------------------------------------------------------------------------------------------------------//
	
	
	//spry and episode data ------------------------------------------------------------------------------------------------------------------------------------------//
	
	//creates an episode object to hold the episodes id, title, description, and ids for its segments 
	function episodeData(p_id, p_thumb, p_title, p_description, p_morebutton, p_episodeType, p_collectionTitle, p_ranking){
		
		if(p_ranking > 5){
			p_ranking = 5;
		}
		
		this.id 				= p_id;
		this.thumb 				= p_thumb;
		this.title 				= p_title;
		this.description 		= p_description;
		this.morebutton			= p_morebutton;
		this.episodeType 		= p_episodeType;
		this.collectionTitle	= p_collectionTitle;
		this.ranking			= p_ranking;
	

		//hold an array for all segments associated with an episodes - a.k.a full length episode
		this.segment 		= new Array();
		this.duration 		= new Array();
		this.thumbnailUrl 	= new Array();

	}

	
	//spry event listener for configuration (data from configuration.xml)
	function configObserverFunc(notificationType, dataSet, data){
		
		if (notificationType == "onLoadError"){
			alert("Couldnt Load Data. Please reload page. Error 100")
		}
	
		// if data was loaded 
		if (notificationType == "onPostLoad"){

			// if the data set is the config.xml loaded do this
			if(dataSet == dsConfig){
				dsConfig.removeObserver(configObserverFunc);
			}

			// when the nested data set for loading the time stamp (next gen cache busting number) 
			if(dataSet == ndsGetTimeStamp){
				ndsGetTimeStamp.removeObserver(configObserverFunc);

				timeStampNextGen = getConfigNode(ndsGetTimeStamp, "@value");

				loadedTimeStamp = true;
			}

			// when nested data set loads for the URL path to episodesByShow		
			if(dataSet == ndsEpisodesByShowPath){
				ndsEpisodesByShowPath.removeObserver(configObserverFunc);

				pathEpisodeByShow = getConfigNode(ndsEpisodesByShowPath, "@url");

				pathEpisodeByShow = pathEpisodeByShow.replace(dsregEx, dsreplace);

				resultsLimit = getConfigNode(ndsEpisodesByShowPath, "@limit");

				loadedEpisodesByShow = true;
			}
			
			// when the nested data set for loading the URL path to getVideoPlaylist			
			if(dataSet == ndsVideoPlayListPath){
				ndsVideoPlayListPath.removeObserver(configObserverFunc);
				
				pathVideoPlayList = getConfigNode(ndsVideoPlayListPath, "@url");
				
				pathVideoPlayList = pathVideoPlayList.replace(dsregEx, dsreplace);
				
				loadedVideoPlaylistPath = true;
			}
			
			// when the nested data set for loading the URL path to getVideoPlaylist			
			if(dataSet == ndsRatingsPath){
				ndsRatingsPath.removeObserver(configObserverFunc);
				
				pathRatings = getConfigNode(ndsRatingsPath, "@url");
				
				pathRatings = pathRatings.replace(dsregEx, dsreplace);
				
				loadedRatingsPath = true;
			}
			
			// when you have the URL paths and the timestamp since load is asynchronous check each time before proceeding			
			if(loadedEpisodesByShow && loadedTimeStamp && loadedVideoPlaylistPath && loadedRatingsPath){

				pathVideoPlayList = pathVideoPlayList + "&r=" + timeStampNextGen 

				getShowData()
			}
		}
		
	}
	
	//spry event listener for episodes (data from episodesByShow)
	function showEpisodeObserverFunc(notificationType, dataSet, data){

		if (notificationType == "onLoadError"){
			alert("Couldnt Load Data. Please reload page. Error 200")
		}

	
		// if data was loaded 
		if (notificationType == "onPostLoad"){
			
			if(dataSet == dsEpisodesByShow){

				dsEpisodesByShow.removeObserver(showEpisodeObserverFunc);
			
				var rows = dsEpisodesByShow.getData();
				
				var currentRow;
				var segments 			= new Array();
				var duration			= new Array();
				var thumb				= new Array();
				var newID				= true;
				var matchingIndex		= 0;
				
				
				//store episode data from spry dataset into the videoList array -------------------------------------------//
				for(var i=0; i <= rows.length - 1; i++){
					currentRow = dsEpisodesByShow.getData()[i]["ds_RowID"]; // Get the ID of the 3rd row.
					dsEpisodesByShow.setCurrentRow(currentRow);

					//loop through the videolist and make sure an entry has not already been made for this episode
					//if one exist locate duplicate index number and flag as not new.
					for(var n=0; n <= videoList.length - 1; n++){
						if(rows[i]["@id"] == videoList[n].id){
							newID = false;
							matchingIndex = n;
						}
					}
					
					if(newID || videoList.length == 0){
						var newEP = new episodeData(rows[i]["@id"], rows[i]["@thumbnailUrl"], rows[i]["@title"], rows[i]["description"], rows[i]["@contentTags"], rows[i]["@episodeType"], rows[i]["@collectionTitle"], rows[i]["@ranking"]);
						videoList.push(newEP);
						matchingIndex = videoList.length == 0 ? 0 : videoList.length -1;
					}

					videoList[matchingIndex].segment.push(rows[i]["segments/segment/@id"]);
					videoList[matchingIndex].duration.push(rows[i]["segments/segment/@duration"]);
					videoList[matchingIndex].thumbnailUrl.push(rows[i]["segments/segment/@thumbnailUrl"]);
					
					newID = true;
				}

				//Start auto play and initiate first video here
				
				//loop through all the segment ids if a query string is found
				var validSegment = false;

				if(params.segmentID != null){
					for(var f=0; f <= videoList.length - 1; f++){
						for(var t=0; t <= videoList[f].segment.length - 1; t++){
							if(videoList[f].segment[t] == params.segmentID){
								videoListIndex = f;
								validSegment = true;
							}
						}
					}
				}
						
				initializeAndPlayVideo();
				initVideo();
				//end store episode data ----------------------------------------------------------------------------------//
			}
		}
		
	}
	
	
	//set up event listener and load the episodes (data from episodesByShow)
	function getShowData(){
		
		var s = pathEpisodeByShow  + "&id=" + showID + "&limit=" + resultsLimit + "&offset=0&r=" + timeStampNextGen

		dsEpisodesByShow = new Spry.Data.XMLDataSet(s, "/episodes/episode", { subPaths: [ "segments/segment"] });
		dsEpisodesByShow.addObserver(showEpisodeObserverFunc);
		dsEpisodesByShow.loadData();

	}

	//gerneric function to read nodes with one node entry
	function getConfigNode(dsName, nodeName){

		var rows = dsName.getData(); 
		return rows[0][nodeName];

	}

	function startLoad(){
		//set up event listener and load configuration.xml file and its nested datasets (data from configuration.xml)
		dsConfig.addObserver(configObserverFunc);
		ndsEpisodesByShowPath.addObserver(configObserverFunc);
		ndsVideoPlayListPath.addObserver(configObserverFunc);
		ndsRatingsPath.addObserver(configObserverFunc);
		ndsGetTimeStamp.addObserver(configObserverFunc);

		dsConfig.loadData();
		ndsEpisodesByShowPath.loadData();
		ndsVideoPlayListPath.loadData();
		ndsRatingsPath.loadData();
		ndsGetTimeStamp.loadData();
	}
	//end spry and episode data --------------------------------------------------------------------------------------------------------------------------//
	
	//Navigation controls --------------------------------------------------------------------------------------------------------------------------------//
	
	//function works in tandem with the videoPlaylistObserverFunc 
	//once the data has been loaded it calls this to talk to the
	//flashcommunication object to play the video in the player
	function initializeAndPlayVideo(){

		var num1 = videoList.length;
		num1 = num1 - 1;
		
		var num2 = videoList[videoListIndex].segment.length;
		num2 = num2 - 1;
		
		flashVideoCommunication.segments = new Array();	

		for(var x=0; x <= videoList[videoListIndex].segment.length - 1; x++){
			var segDuration = videoList[videoListIndex].duration[x];	
			var segID 		= videoList[videoListIndex].segment[x];
			var segThumb 	= videoList[videoListIndex].thumbnailUrl[x];
			
			flashVideoCommunication.addSegment(segDuration, segID, segThumb);
		}			

		flashVideoCommunication.collectionTitle		= videoList[videoListIndex].collectionTitle;
		flashVideoCommunication.episodeType 		= videoList[videoListIndex].episodeType;
		flashVideoCommunication.episodeTitle 		= videoList[videoListIndex].title;
		flashVideoCommunication.pageUrl 			= pageUrl; 
		flashVideoCommunication.pathVideoPlayList	= pathVideoPlayList;
		flashVideoCommunication.playEndSlate 		= (videoListIndex == num1 && videoListSegmentIndex == num2) ? true : false;
		flashVideoCommunication.ranking 			= "0";

		flashVideoCommunication.playVideo(); 

	}

	//initiated after all data has been loaded from the spry framework.
	function initVideo(){
		
	//	writeTitle();
	//	writeDescription();
	//	writeMoreButton();
		
	//	createRating();
				
		//render out the buttons in the HTML	
	//	writeNavigation();
		
		//set the currently playing thumnail to be highlighted		
		//highlightThumbnail(videoListIndex, true);

	}
	
	
	//navigation control that initiates playing a video 
	//pass in index of a selected videolist index, 
	//or the values next or previous to have the navigation to keep track
	function playVideo(val){
		// removes highlight from previously playing clip
		//highlightThumbnail(videoListIndex, false); 

		//increse the number for selected clip or next in line from autoplaying clips
		//keeps track of videoListIndex
		if(val.toString() == "next"){
			videoListIndex = (videoListIndex >= 0 && videoListIndex < videoList.length -1) ? videoListIndex + 1 : 0;
		}else if(val.toString() == "previous"){
			videoListIndex = (videoListIndex != 0 && videoListIndex <= videoList.length -1) ? videoListIndex - 1 : videoList.length - 1;
		}else{
			videoListIndex = parseInt(val);
		}

		initializeAndPlayVideo();

		//determine if list should continue to autoplay if you are playing the last video in the list the flag will set to false
		reachedPlayListEnd = (videoListIndex == videoList.length -1) ? true : false; //stops video from looping list twice

		// highlight currently playing clip
		//highlightThumbnail(videoListIndex, true);
		
		//do write title
	//	writeTitle();
		
		//do write description
	//	writeDescription();
		
		//do write more button
	//	writeMoreButton();
		
	//	createRating();
		
	}
	
	//set up rollovers for thumnails
	function highlightThumbnail(num, state){

		thumbName = eval("thumb" + num);
		thumbName.src = (state) ? "/tv_shows/theothersiders/tools/img/videopage/playing.gif" : "http://i.cdn.turner.com/toon/tools/img/pixel.gif";

	}
	
	function rolloverThumbnail(obj){
		obj.className = "thumbgraphic_over";
	}
	
	function rolloutThumbnail(obj){
		obj.className = "thumbgraphic";
	}
	
	function writeNavigation(){

		//writes out the navigation
		var content = "";
		var i = 0;
		var newPanelId = true;
		var panelId = 1;

		for(n=0; n <= videoList.length - 1; n++){

				if(newPanelId){
					content += "<div id='p" + panelId + "' class='SlidingPanelsContent'>";
				}
				
				//-------------
				
				content += "<div id='video_nav_cell' style='background: url("+ videoList[n].thumb +") 2px -5px repeat-x; margin: 2px; overflow:hidden; height:49px; width:84; display:block;'>";
				content += "<a href='javascript:playVideo(" + n + ");' >"
				content += "<img class='thumbgraphic' onmouseover='javascript:rolloverThumbnail(this)' onmouseout='javascript:rolloutThumbnail(this)' name='thumb" + n +"' src='http://i.cdn.turner.com/toon/tools/img/pixel.gif'"; 
				content += "border='0' alt='" + videoList[n].title + "'  height='45' width='80'>";
				content += "</a> ";
				content += "</div>";
			
				if(i == 0){
					i = 0;
					newPanelId = true;
				}else{
					newPanelId = false;
					i++;
				}
				//-------------
				
				if(newPanelId ||  n == videoList.length - 1){
					content += "</div>";
					panelId++;
				}
		}

		document.getElementById('SlidingPanelsContentGroup').innerHTML = content;
		
		sp1 = new Spry.Widget.SlidingPanels("SlidingPanels1");
		
		writeNavButtons();

	}
	
	function writeNavButtons(){

		if(videoList.length > 4){
			var s = "";
		
			s += "<a id='videoA' href='#' onclick='sp1.showPreviousPanel(); return false;' style='float:left;'>&lt;Back</a>";
			s += "<a id='videoA' href='#' onclick='sp1.showNextPanel(); return false;'  style='float:right;'>Next&gt;</a>";
				
			document.getElementById('video_nav_btns').innerHTML = s;	
		}
	
	}
	
	function writeTitle(){

		//writes out the title in DIV tag
		var content = videoList[videoListIndex].title;
		
		document.getElementById('html_title').innerHTML = content.toUpperCase(); 

	}
	
	//function writeMoreButton(){

		//writes out the title in DIV tag
	//	var content
		
	//	if(videoList[videoListIndex].morebutton != ""){
	//		content = "<a href='" + videoList[videoListIndex].morebutton + "'>More &gt;</a>";
	//	}else{
	//		content = " ";
	//	}

	//	document.getElementById('html_morebutton').innerHTML = content; 

	//}
	
	// function writeDescription(){

		//writes out the title in DIV tag
		//var content = videoList[videoListIndex].description;
		
		//var content_regEx 				= /\&amp\Wapos\W/;
		//var content_replace				= "'"
	
		//content = content.replace(content_regEx, content_replace);

		//document.getElementById('rating_init').value = videoList[videoListIndex].ranking;
		
		//document.getElementById('html_description').innerHTML = content; 

	//}
	
	function moveNav(direction){
		
		if(direction == "left"){

		}else if(direction == "right"){

		}
		
	}
	
	function getRandomNumber(){
		var randomNumber;
		
		var m   	= new Date().getMonth() + 1;
		var d  		= new Date().getDate();
		var yr  	= new Date().getFullYear();
		var h 	 	= new Date().getHours();
		var min 	= new Date().getMinutes();
		var newMin 	= "00";
		
		if(min >= 0 && min <= 15){
			newMin = "00";
		}
		
		if(min >= 16 && min <= 30){
			newMin = "15";
		}
		
		if(min >= 31 && min <= 45){
			newMin = "30";
		}
		
		if(min >= 46 && min <= 59){
			newMin = "45";
		}
		
		randomNumber = m + "" + d + "" + yr + "" + h + "" + newMin;
		
		return randomNumber;        	
	}
	
	function videoContinuousPlay(){

		if(continuousPlayEnabled){
			continuousPlayEnabled = false;
			document.getElementById('img_continuousplay').src = "/tv_shows/theothersiders/tools/img/videopage/contplayoff.gif"
		}else{
			continuousPlayEnabled = true;
			document.getElementById('img_continuousplay').src = "/tv_shows/theothersiders/tools/img/videopage/contplay.gif";
		}

	}
	
	function continuousPlayOver(){
		
		if(continuousPlayEnabled){
			document.getElementById('img_continuousplay').src = "/tv_shows/theothersiders/tools/img/videopage/contplayoff.gif";
		}else{
			document.getElementById('img_continuousplay').src = "/tv_shows/theothersiders/tools/img/videopage/contplay.gif";
		}

	}

	function continuousPlayOut(){
		
		if(continuousPlayEnabled){
			document.getElementById('img_continuousplay').src = "/tv_shows/theothersiders/tools/img/videopage/contplay.gif";
		}else{
			document.getElementById('img_continuousplay').src = "/tv_shows/theothersiders/tools/img/videopage/contplayoff.gif";
		}

	}

	function createRating(){
										
		var rate = new Spry.Widget.Rating("spryrating", {rateHandler: ratingMsg,allowMultipleRating: false, ratingValueElement: 'rating_init', postData: 'id=' + videoList[videoListIndex].id  + '&rating=@@ratingValue@@', saveUrl:pathRatings});

	}
	
	function ratingMsg(){	
		
		document.getElementById('rating_thanks').style.display = "block";
		
		setTimeout("clearRatingMsg()", 5000);
	}
		
	function clearRatingMsg(){
		document.getElementById('rating_thanks').style.display = "none" 
	}
	
	//end navigation controls ------------------------------------------------------------------------------------------------------------------------------//

	//flash communication ----------------------------------------------------------------------------------------------------------------------------------//

	//event listener for video player swf file
	//fires when the events fire inside of the swf file.
	flashVideoCommunication.onVideoStateChange = function (val){
		// returns BUFFERING, CLOSED, ENDED, ERROR, LOADING, PAUSED, PLAYING, STOPPED
		
		//plays next video in the videoList array once the current video has ended 
		if(val == "ENDED" && continuousPlayEnabled == false){
			flashVideoCommunication.onShowEndSlate();
		}else if(val == "ENDED" && reachedPlayListEnd == false && videoList.length > 1){
			//autoplay the next clip if list has not reached the end of the play list

			playVideo("next");
		}

	}
	
	//end flash communication --------------------------------------------------------------------------------------------------------------------------------//
