google.load("jquery","1.4.2");
google.load("swfobject", "2.1");
var demo_template_html = '<div class="demoContainer">' +
		'<div class="demo">'+
			'<p class="demoName"></p>' + 
			'<ul class="thumbnails">'+
			'</ul>'+
			'<p class="time"></p>'+
		'</div>'+
	'</div>';
var playlist_url_jsonP="http://pipes.yahoo.com/pipes/pipe.run?_id=2d05005c94d2bb67daba1ed2963c0d05&_render=json&_callback=?";
var yt_player_width = 480;
var overlay_opacity = .70;
var modal_win_opacity = 1.0;

var modal_win_html = '<div id="modal-win">' +
		'<div id="modal-win-bg">&nbsp;</div>'+
		'<div id="modal-player-display">' + 
			'<div id="yt-player">&nbsp;</div>' +
			'<p id="yt-video-name">&nbsp;</p>' + 
			'<div id="modal-win-close">'+
				'<img src="/ECM/Images/SolutionsVideo/modal-player-close-btn.png" height="19" width="23" class="btn" alt="Close Window - Return To Playlist" />'+
			'</div>'+
		'</div>' +
	'</div>';
function jqueryLoaded(){
	
	var playlist_container = $("#contentMain #playlist");
	var jq_body = $('body');
	var jq_document = $(document);
	var jq_window = $(window);
	$('#visit-yt p').hover(
		function(){
			$(this).addClass('hover');
		},
		function(){
			$(this).removeClass('hover');
		}
	)
	$('img.arrow').live('click',openPlayerWin);
	$('#modal-win-close img.btn').live('click',closePlayerWin);
	$.getJSON(playlist_url_jsonP,
		function(data){
			$.each(data.value.items,
				function(i,item){
					playlist_container.append("<h2 class='playlist-title'><span>Playlist - "+item.title+"</span></h2>");
					playlist_container.append("<p class='playlist-description'>"+ item.description+"</p");
					$.each(item["playlist:video"],
						function(index,video){
							var curr_video_title = String(video.title).replace(/_/g," ").replace(/.flv/,"");
							var media_group = video["media:group"];
							var demo_container =$(demo_template_html);
							if ((index+1)%3 == 0){
								demo_container.addClass('last');
							}
							demo_container.find('.demoName').html('<a href="'+ video.link + '" target="_blank">' + curr_video_title + '</a>' ).bind('click',openPlayerWin);
							
							var thumbnails_container = demo_container.find('ul').bind('click',openPlayerWin);
							$.each(media_group["media:thumbnail"],
								function(thumb_index,thumbnail){
									if(thumbnail.width == 120)
									{
										thumbnails_container.append($('<li></li>').html('<img src="' + thumbnail.url + '" width="' +thumbnail.width + '" height="' + thumbnail.height + '"' + '/>'));
									}
									
								}
							);
							demo_container.find('.time').text("running time - " + convertTimeStr(media_group["yt:duration"].seconds));
							demo_container.find('.demo').attr("rel",media_group["yt:videoid"]).attr("title",curr_video_title).append('<img src="/ECM/Images/SolutionsVideo/thumbnail-play-arrow.png" height="44" width="40" alt="play arrow" class="arrow" />').append('<p class="demo-description">'+ media_group["media:description"].content +'</p>');
							playlist_container.append(demo_container);
								if(jQuery.browser.msie && (jQuery.browser.version < 7))
								{
									DD_belatedPNG.fix('.arrow');
								}
						}//End playlist:video loop
					)
				}//End data.value.items loop
			);
		}
	);//End $.getJSON()
	function openPlayerWin(){
		var curr_demo = $(this).parents('.demo');
		var yt_video_id = curr_demo.attr("rel");
		var yt_video_title = curr_demo.attr("title")
		var yt_params = {allowScriptAccess: "always" };
		var yt_atts = { id: "ytPlayer" };
		
		overlay = $('<div id="overlay"></div>').css({
			"opacity": 0,
			width:jq_document.width(),
			height:jq_document.height()
		});
		modal_win = $(modal_win_html).css({
			"display":"none"
		});
		jq_body.append(overlay).append(modal_win);
		overlay.animate({opacity:overlay_opacity},750,function(){
			var modal_win_height = modal_win.outerHeight();
			var modal_win_width = modal_win.outerWidth();
			modal_win.find('#yt-video-name').text(yt_video_title);
			$('#modal-win-bg').height(modal_win_height).width(modal_win_width);
			
			swfobject.embedSWF("http://www.youtube.com/v/"  +  yt_video_id +  "&enablejsapi=1&playerapiid=player1&border=1&color1=0x182B56&color2=0xCEDAEF",
                    "yt-player", "480", "295", "8", null, null, yt_params, yt_atts);
			
			modal_win.css({
				"top": (jq_window.height()/2 - modal_win_height/2) + jq_window.scrollTop(),
				"left":jq_window.width()/2 - modal_win_width/2
			})
			.fadeIn(750,startVideo);
		});
		jq_window.scroll(function(){
			var modal_win_height = modal_win.outerHeight();
			var modal_win_width = modal_win.outerWidth();
			modal_win.css({
				"top": (jq_window.height()/2 - modal_win_height/2) + jq_window.scrollTop(),
				"left":jq_window.width()/2 - modal_win_width/2
			});
		});
		function startVideo(){
			
			
		}
		return false;
	}
	function closePlayerWin()
	{
		ytplayer = document.getElementById("ytPlayer");
		ytplayer.stopVideo();
		$(ytplayer).css("visibility","hidden");
		overlay.fadeOut(function()
		{
			$(this).remove();
		}
		);
		modal_win.fadeOut(function(){
			
			swfobject.removeSWF("ytPlayer");
			$(this).remove();
		});
	}
};

function convertTimeStr(t_seconds){
	var d = new Date(0,0,0,0,0,t_seconds,0);
	return (d.getMinutes() + ":" + ((d.getSeconds()< 10) ? "0"+d.getSeconds():d.getSeconds()));

}
google.setOnLoadCallback(jqueryLoaded);
