/**
 * Layer mangement
 */

var PDF_PATH = "pdf/";
var VIDEO_PATH = "http://www.ebridge.tv/_video/usay_cp/";
var LAST_HIGHLIGHTED = null;
 
Layer =
{
	layers :
	{
		'title' : function() { return document.getElementById('titleLayer'); },
		'media' : function() { return document.getElementById('mediaLayer'); },
		'links' : function() { return document.getElementById('linksLayer'); }
	},
	
	exists 	: function(layer) { return (this.layers.hasOwnProperty(layer) && this.layers[layer]() != null); },
	hideAll : function()	  { for(var layer in this.layers) this.hide(layer); },
	hide	: function(layer) { if(this.exists(layer)) this.layers[layer]().style.display='none'; },
	show	: function(layer) { if(this.exists(layer)) this.layers[layer]().style.display='block'; },
	write	: function(layer,html) { if(this.exists(layer)) { this.layers[layer]().innerHTML = html; this.show(layer); }},
	clear	: function(layer) { if(this.exists(layer)) this.layers[layer]().innerHTML = ""; }
}

Layout=
{
	menu : function(category)
	{
		var Group = Playlist[category];
		var Videos = Group.videos;
		
		Layer.hideAll();
		Layer.show('title');
		
		var html = "<h1>+ Playlist</h1><ol>";
		
		for(var Filename in Videos)
		{
			var video = Videos[Filename];
			html += String.format('<li id="media_link_{0}_{1}"><a href="javascript://" onclick="Layout.display({1},\'{2}\',\'{3}\');">{4}</a></li>', Group.number, video.number, category, Filename, video.title);
		}
		
		html += "</ol>";
		
		Layer.write('menu', html);
		
		// Remove the highlight on the last row
		if(LAST_HIGHLIGHTED != null)
		{
			LAST_HIGHLIGHTED.className = "";
		}
		
		// Highlight this row and store a reference to it for next time;
		LAST_HIGHLIGHTED = document.getElementById(String.format('menu_link_{0}',Group.number));
		LAST_HIGHLIGHTED.className = "highlight";
		
		
		
	} ,
	
	display : function(link_number, category, media_file)
	{
		/**
		 * STEP
		 * 	title (string)
		 * 	media (array)
		 * 		(object)
		 * 		  - name
		 * 		  - href
		 * 	links (array)
		 * 		(object)
		 * 		  - name
		 * 		  - href
		 */
		
		Layer.hide('media');
		Layer.hide('links');
		
		oMediaPlayer.URL(VIDEO_PATH+media_file);
		
		// Get the media element from the playlist
		var oCategory = Playlist[category];
		var oVideo = oCategory.videos[media_file];
		
		// Remove the highlight on the last row
		if(LAST_HIGHLIGHTED != null)
		{
			LAST_HIGHLIGHTED.className = "";
		}
		
		// Highlight this row and store a reference to it for next time;
		LAST_HIGHLIGHTED = document.getElementById(String.format('media_link_{0}_{1}',oCategory.number, oVideo.number));
		LAST_HIGHLIGHTED.className = "highlight";
		
		
		// Display the media (PDF) links if there are any
		var mediaCount = oVideo.media.length;
		
		if(mediaCount > 0)
		{
			var html = "<h1>+ Worksheets (PDF)</h1><ul>";
			
			for(var i=0; i<mediaCount; i++)
			{
				var media = oVideo.media[i];
				
				// Use an absolute links that contain a 'http://' header in the string, otherwise use relative links.
				var href = (media.href.match(/http:/gi)?media.href:PDF_PATH+escape(media.href));
				html += String.format('<li><a href="{0}" target="_blank">{1}</a></li>', href, media.name);
			}
			html += "</ul>"
			
			// Display media
			Layer.write('media', html);
		}
		
		
		// Display the links if there are any
		var linkCount = oVideo.links.length;
		
		if(linkCount > 0)
		{
			var html = "<h1>+ Links</h1><ul>";			
			
			for(var i=0; i<linkCount; i++)
			{
				var link = oVideo.links[i];
				html += String.format('<li><a href="{0}" target="_blank">{1}</a></li>', link.href, link.name);
			}
			html += "</ul>"
			
			Layer.write('links', html);
		}
		
		// If there was media or links, display the title
		//if((linkCount|mediaCount) > 0)
		{
			Layer.write('title', "+ "+oVideo.title);
		}			
	}
}



String.format = function( text )
{
    //check if there are two arguments in the arguments list
    if ( arguments.length <= 1 )
    {
        //if there are not 2 or more arguments there’s nothing to replace
        //just return the original text
        return text;
    }
	
    //decrement to move to the second argument in the array
    var tokenCount = arguments.length - 2;
    for( var token = 0; token <= tokenCount; token++ )
    {
        //iterate through the tokens and replace their placeholders from the original text in order
        text = text.replace( new RegExp( "\\{" + token + "\\}", "gi" ), arguments[ token + 1 ] );
    }
    return text;
};