<?xml version="1.0" encoding="UTF-8" ?>
<Module>
	<ModulePrefs
		author="LabPixies"
		author_email="info@labpixies.com"
		description="__MSG_desc__"
		thumbnail="http://cdn.labpixies.com/campaigns/youtube/images/thumbnail.jpg"
		screenshot="http://cdn.labpixies.com/campaigns/youtube/images/screenshot.jpg"
		directory_title="__MSG_title__"
		title="YouTube Top Videos"
		title_url="http://www.labpixies.com"
		height="345">
		<Locale  messages="http://www.labpixies.com/campaigns/youtube/i19/all_all.xml"/>					
		<Locale lang="de" messages="http://www.labpixies.com/campaigns/youtube/i19/de_all.xml"/>
		<Locale lang="es" messages="http://www.labpixies.com/campaigns/youtube/i19/es_all.xml"/>
		<Locale lang="fr" messages="http://www.labpixies.com/campaigns/youtube/i19/fr_all.xml"/>		
		<Locale lang="it" messages="http://www.labpixies.com/campaigns/youtube/i19/it_all.xml"/>
		<Locale lang="ja" messages="http://www.labpixies.com/campaigns/youtube/i19/ja_all.xml"/>
		<Locale lang="nl" messages="http://www.labpixies.com/campaigns/youtube/i19/nl_all.xml"/>		
		<Locale lang="pl" messages="http://www.labpixies.com/campaigns/youtube/i19/pl_all.xml"/>
		<Locale lang="pt-PT" messages="http://www.labpixies.com/campaigns/youtube/i19/pt_all.xml"/>
		<Locale lang="pt-BR" messages="http://www.labpixies.com/campaigns/youtube/i19/pt_all.xml"/>
		<Locale lang="zh-CN" messages="http://www.labpixies.com/campaigns/youtube/i19/zh_cn_all.xml"/>
		
		<Require feature="analytics" />
		<Require feature="setprefs"/>
		<Require feature="flash" />
	</ModulePrefs>
	<UserPref name="my_clips" datatype="hidden" default_value="none"/>
	<Content type="html"> <![CDATA[
	<title>YouTube Top List</title>
	<style type="text/css">
		<!--
		body, html {
			margin: 0;
			padding: 0;
		}
		.text12 {
		    font-family: Arial, Helvetica, sans-serif;
		    font-size: 12px;
		    color: #000000;
		}
		.text10 {
		    font-family: Arial, Helvetica, sans-serif;
		    font-size: 10px;
		    color: #000000;
		    line-height: 12px;
		}
		.text11 {
		    font-family: Arial, Helvetica, sans-serif;
		    font-size: 10px;
		    color: #000000;
		    line-height: 12px;
		}
		.text10 a {
			display: block;
			height: 25px;
			overflow: hidden;
		}
		.text12bold p {
		    font-family: Arial, Helvetica, sans-serif;
		    font-size: 12px;
		    font-weight: bold;
		    color: #000000;
			height: 15px;
			overflow: hidden;
			padding: 0;
			margin: 0;
		}
		a:link {
		    color: #0033ce;
		    text-decoration: none;
		}
		a:visited {
		    text-decoration: none;
		    color: #0033ce;
		}
		a:hover {
		    text-decoration: underline;
		    color: #0033ce;
		}
		a:active {
		    text-decoration: none;
		    color: #0033ce;
		}

		img {
			border: 0;
		}

		table.style3 {
			color: #0033cc;
			border-collapse: collapse;
			font-family: Arial, Helvetica, sans-serif;
			font-size: 11px;
			background-color: #ffffff;
			text-align: left;
			vertical-align: middle;
			cursor: pointer;
		}

		table.style3 td {
			border: 1px solid #0033cc;
			height: 17px;
			padding-left: 3px;
			width: 135px;
		}

		table.style3 td:hover {
			background-color: #0033cc;
			color: #ffffff;
			height: 17px;
		}
		.cursor {
			cursor: pointer;
			border: 1px solid #e9e9e9;
		}

		.style0{
			font-size:1px;
		}

		-->
	</style>
		<!-- PUT THIS TAG IN THE head SECTION -->
	<script type="text/javascript" src="http://partner.googleadservices.com/gampad/google_service.js">
	</script>
	<script type="text/javascript">
	  GS_googleAddAdSenseService("ca-pub-8123415297019784");
	  GS_googleEnableAllServices();
	</script>
	<script type="text/javascript">
	  GA_googleAddSlot("ca-pub-8123415297019784", "youtube_top_videos_txt");
	</script>
	<script type="text/javascript">
	  GA_googleFetchAds();
	</script>
	<!-- END OF TAG FOR head SECTION -->
	
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
	<script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script>
	
	<script type="text/javascript">
		var $lp=jQuery.noConflict();
		var _gadgetID=37;
		
		var orig_pos = 0;
		var step = 6;
		var new_pos = 0;
		var itemlist;
		var num_entries = 36;
		var prefs;
		
		var pageTracker;
		var eventTracker;
		var unAvailable=false;

	 	function xmlError(e) {
			setErrorMsg();
		}

		function setErrorMsg(flag){
			unAvailable=true;
			$lp('#prev,#next').css('display','none');
			for (var i = 0; i < step ; i++) {
				 _gel('title_' + i).innerHTML = '&nbsp;';
				 _gel('thumbnail_'+i).title="";
			}
			if (flag==0)
				$lp('#movie_1,#mv_title_1').css('visibility','visible');
			else
				$lp('#mv_title_1').css('visibility','visible');
			_gel("thumbnail_1").src = _IG_GetImageUrl("http://cdn.labpixies.com/campaigns/youtube/images/not_available.gif");
			_gel('title_1').style.textDecoration="none";
			_gel('title_1').style.cursor="default";
			_gel('thumbnail_1').style.textDecoration="none";
			_gel('thumbnail_1').style.cursor="default";
			if (flag==0)//unavailable
		 		_gel('title_1').innerHTML = '__MSG_unavailable__';
			else
				if (flag==1)//no messages found
					_gel('title_1').innerHTML = '__MSG_not_found__';
		}

		//parse the rss
		function parseRSS(response) {
			try{
				_gel('title_1').style.textDecoration="";
				_gel('title_1').style.cursor="pointer";
				_gel('thumbnail_1').style.textDecoration="";
				_gel('thumbnail_1').style.cursor="pointer";
				unAvailable=false;
				$lp('.movieElm').css('visibility','hidden');
				if (response == null) {
					setErrorMsg(0);
					return;
				}
				if (response.error) {
					setErrorMsg(0);
					return;
				}
				itemList = response.getElementsByTagName("item");
				if (itemList.length==0){
					setErrorMsg(1);
					return;
				}
					
				new_pos = 0;
				_gel('next').style.display = 'inline';
				populate_thumbnails();
			}
			catch(e){//it seems that after a certain length youtube can't handle queries, this catch is for completely failed queries, which dont even return null
				setErrorMsg(0);
				return;
			}
		}

		function populate_thumbnails() {
			if (new_pos < step) {
				_gel('prev').style.display = 'none';
			}
			else {
			_gel('prev').style.display = 'inline';
			}
			for (var i = 0; i < step ; i++) {
			 	var thumbElm = _gel("thumbnail_"+i);
				if(i + new_pos >= itemList.length) {
					thumbElm.src = "http://cdn.labpixies.com/images/transparent.gif";
					thumbElm.style.cursor="default";
					thumbElm.style.border=0;
					thumbElm.title="";
					_gel('title_' + i).innerHTML = '';
					if (i == 5) {
						_gel('next').style.display = 'none';
					}
				}
				else {
					var item = itemList.item(i + new_pos);
		            var itemDetails = item.childNodes;
		            for (var j=0;j < itemDetails.length; j++) {
						var innerItem = itemDetails.item(j);
						if (innerItem.nodeName == "title") {
							thumbElm.cliptitle = innerItem.firstChild.nodeValue;
							thumbElm.title = innerItem.firstChild.nodeValue;
							_gel('title_' + i).innerHTML = innerItem.firstChild.nodeValue.substring(0,20);
						}
						else if (innerItem.nodeName == "media:thumbnail") {
							thumbElm.src = innerItem.getAttribute("url");
						}
						else if (innerItem.nodeName == "enclosure") {
							thumbElm.clipurl = innerItem.getAttribute("url");
						}
						
						thumbElm.style.cursor="pointer";		
						thumbElm.style.border=1;
		            }
					$lp('#movie_'+i).css('visibility','visible');
					$lp('#mv_title_'+i).css('visibility','visible');
				}
	        }
		}

		function next() {
			new_pos += step;
			populate_thumbnails();
		}

		function prev() {
			_gel('next').style.display = 'inline';
			new_pos -= step;
			populate_thumbnails();
		}

		function search_tagname() {
			go_back();
			if(_gel('search').value!=""){
				var current_tagname = escape(_gel('search').value);
				changeFeedTo(current_tagname,'tag');
			}
		}

		function changeFeedTo(feedname, s_url) {
			var root_url = 'http://youtube.com/rss/';
			if (!s_url) {
				url = feedname.replace(/\s/g,'_').toLowerCase();
				feedurl = 'global/' + url + '.rss';
			}
			else if (s_url == 'tag') {
				feedurl = 'tag/' + escape(feedname) + '.rss';
			}
			else {
				feedurl = s_url;
			}
			full_url = root_url + feedurl
			prefs.set("my_clips", feedname + '@' + feedurl);
			eventTracker._trackEvent('ChangeCategory');	
			
			//update the screen
			_gel("RSSMenuTable").style.display = "none";
			_gel("rssCategoryTitle").innerHTML =  unescape(feedname) + "&nbsp;";
			for (var i = 0; i < step ; i++) {
	             _gel("thumbnail_"+i).src = _IG_GetImageUrl("http://cdn.labpixies.com/campaigns/youtube/images/spacer.gif");
	        }
			_IG_FetchXmlContent(full_url, parseRSS);
			return false;
		}

		function playClip(s_obj) {
			if(document.getElementById(s_obj).src=="http://cdn.labpixies.com/images/transparent.gif"){
				return false;
			}
			
			var obj = _gel(s_obj);
			if(!obj.clipurl){
				return false;
			}
			$lp("#clip_holder").html("");
			var curl = (obj.clipurl+"&autoplay=1");
			curl = curl.replace(".swf","");
			_gel("rssCategoryTitle").style.display = 'none';
			_IG_EmbedFlash(curl, 'clip_holder', {
			    width: 255,
			    height: 213
			})
			$lp("#clip_holder").css("display","");
			_gel("thumbnails_holder").style.display = "none";
			_gel('menu_holder').style.display = 'none';
			_gel('back').style.display = 'inline';
			_gel('currentTitle').innerHTML = obj.cliptitle;
			_gel('currentTitle').style.display = "block";
		}

		function go_back() {
			$lp("#clip_holder").html("");
			$lp('#clip_holder').css('display','none');
			_gel("thumbnails_holder").style.display = "block";
			_gel('menu_holder').style.display = 'block';
			_gel('back').style.display = 'none';
			_gel("rssCategoryTitle").style.display = 'block';
			_gel('currentTitle').style.display = 'none';
		}

		function toggle_menu() {
			if (_gel('RSSMenuTable').style.display != 'block') {
				_gel('RSSMenuTable').style.display = 'block';
			}
			else {
				_gel('RSSMenuTable').style.display = 'none';
			}
		}

		function onKeyHandle(e){
			var keynum;
			if(window.event){
				keynum = e.keyCode;
			}
			else if(e.which){
				keynum = e.which;
			}

			if(keynum == 13){
				if(_gel("search").value!=""){
					search_tagname();
				}
				return false;
			}
			return true;
		}
	</script>
	<div style='height:10px; font-size:1px;'></div>
    <table id="main" align="center" width="285" height="295px" border="0" cellpadding="0" cellspacing="0">
	    <tr>
	        <td width="12">&nbsp;</td>
	        <td width="261">
				<table width="261" border="0" cellspacing="0" cellpadding="0">
		            <tr>
						<td height="5" style="font-size:1px;">&nbsp;</td>
		            </tr>
		            <tr>
			            <td height="41">
			                <table width="261" height="41" border="0" cellpadding="0" cellspacing="0">
				                <tr>
				                    <td width="71"><a href="http://www.youtube.com" target="_blank"><img id="spacer" alt="youtube" width="70px" height="41px" /></a></td>
				                    <td width="190" align="right" valign="middle">
				                      	<input name="textfield2" type="text" id="search" class="text12" size="15" onkeypress="onKeyHandle(event);" />
										<input name="Submit2" type="submit" class="text10" value= "Search" id="searchInput" onclick="search_tagname();" />
				                    </td>
				                </tr>
			                </table>
			            </td>
		            </tr>
		            <tr>
			            <td height="18">
			                <table width="261" border="0" cellspacing="0" cellpadding="0">
								<tr>
									<td class="text12bold"><p id="rssCategoryTitle" style="width:200px;">__MSG_loading__</p><p id="currentTitle" style="display: none;"></p></td>
									<td width="71" align="right" class="text11">
										<div id="menu_holder" style="position: relative;">
											<a href="javascript: toggle_menu();">__MSG_categories__</a>
											<table class="style3" id="RSSMenuTable" style="z-index:2;position:absolute;top:15px;right:0;display:none" width="135" border="0" cellpadding="0" cellspacing=0">
												<tr>
													<td onclick="changeFeedTo('Recently Added');">__MSG_recently_added__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Recently Featured');">__MSG_recently_featured__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Top Favorites');">__MSG_top_favorites__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Top Rated');">__MSG_top_rated__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Most Viewed Today','global/top_viewed_today.rss');">__MSG_most_viewed_today__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Most Viewed This Week','global/top_viewed_week.rss');">__MSG_most_viewed_this_week__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Most Viewed This Month','global/top_viewed_month.rss');">__MSG_most_viewed_this_month__</td>
												</tr>
												<tr>
													<td onclick="changeFeedTo('Most Viewed All Time','global/top_viewed.rss');">__MSG_most_viewed_all_time__</td>
												</tr>
											</table>
										</div>
										<a id="back" style="display:none;" href="javascript: go_back();">&lt; __MSG_back__</a>
									</td>
								</tr>
			                </table>
			            </td>
		            </tr>
		            <tr>
			            <td height="222">
			                <table width="261" border="0" cellspacing="0" cellpadding="0" id="thumbnails_holder">
				                <tr>
				                    <td height="14" style="font-size:1px;"> &nbsp; </td>
				                </tr>
				                <tr>
				                    <td height="188" align="center" valign="top">
					                    <table width="252" border="0" cellspacing="0" cellpadding="0">
					                        <tr>
						                        <td width="76" height="62" valign="top" id="movie_0" class="movieElm"><img onclick="if(!unAvailable) playClip(this.id.toString());" class="cursor" id="thumbnail_0" width="74" height="60" /></td>
						                        <td width="12" height="62" valign="top"> &nbsp; </td>
						                        <td width="76" height="62" valign="top" id="movie_1" class="movieElm" align="center"><img onclick="if(!unAvailable) playClip(this.id.toString());" class="cursor" id="thumbnail_1" width="74" height="60" /></td>
						                        <td width="12" height="62" valign="top"> &nbsp; </td>
						                        <td width="76" height="62" valign="top" id="movie_2" class="movieElm"><img onclick="if(!unAvailable) playClip(this.id.toString());" class="cursor" id="thumbnail_2"  width="74" height="60" /></td>
					                        </tr>
					                        <tr>
						                        <td width="76" height="32" align="center" valign="top" class="text10 movieElm" id="mv_title_0" ><div style="width:76px; height:32px; overflow:hidden;"><a href="javascript:if(!unAvailable) playClip('thumbnail_0');" id="title_0"></a></div></td>
						                        <td width="12" height="32" valign="top">&nbsp;</td>
						                        <td width="76" height="32" align="center" valign="top" class="text10 movieElm" id="mv_title_1" ><div style="width:76px; height:32px; overflow:hidden;"><a href="javascript:if(!unAvailable) if(!unAvailable) playClip('thumbnail_1');" id="title_1"></a></div></td>
						                        <td width="12" height="32" valign="top">&nbsp;</td>
						                        <td width="76" height="32" align="center" valign="top" class="text10 movieElm" id="mv_title_2"><div style="width:76px; height:32px; overflow:hidden;"><a href="javascript:if(!unAvailable) playClip('thumbnail_2');" id="title_2"></a></div></td>
					                        </tr>
					                        <tr>
						                        <td width="76" height="62" valign="top" id="movie_3" class="movieElm"><img onclick="if(!unAvailable) playClip(this.id.toString());" class="cursor" id="thumbnail_3" width="74" height="60" /></td>
						                        <td width="12" height="62" valign="top"> &nbsp; </td>
						                        <td width="76" height="62" valign="top" id="movie_4" class="movieElm"><img onclick="if(!unAvailable) playClip(this.id.toString());" class="cursor" id="thumbnail_4" width="74" height="60" /></td>
						                        <td width="12" height="62" valign="top"> &nbsp; </td>
						                        <td width="76" height="62" valign="top" id="movie_5" class="movieElm"><img onclick="if(!unAvailable) playClip(this.id.toString());" class="cursor" id="thumbnail_5"  width="74" height="60" /></td>
					                        </tr>
					                        <tr>
						                        <td width="76" height="32" align="center" valign="top" class="text10 movieElm" id="mv_title_3" ><div style="width:76px; height:32px; overflow:hidden;"><a href="javascript:if(!unAvailable) playClip('thumbnail_3');" id="title_3"></a></div></td>
						                        <td width="12" height="32" valign="top">&nbsp;</td>
						                        <td width="76" height="32" align="center" valign="top" class="text10 movieElm" id="mv_title_4" ><div style="width:76px; height:32px; overflow:hidden;"><a href="javascript:if(!unAvailable) playClip('thumbnail_4');" id="title_4"></a></div></td>
						                        <td width="12" height="32" valign="top">&nbsp;</td>
						                        <td width="76" height="32" align="center" valign="top" class="text10 movieElm" id="mv_title_5" ><div style="width:76px; height:32px; overflow:hidden;"><a href="javascript:if(!unAvailable) playClip('thumbnail_5');" id="title_5"></a></div></td>
					                        </tr>
					                    </table>
				                    </td>
				                </tr>
				                <tr>
				                    <td height="20" valign="top">
					                    <table width="261" border="0" cellspacing="0" cellpadding="0" border=0>
					                        <tr>
					                          <td class="text11"> <a id="prev" href="javascript:try{prev();}catch(e){}">&lt; __MSG_back__</a> </td>
					                          <td align="right" class="text11"> <a id="next" href="javascript:try{next();}catch(e){}">__MSG_next__ &gt;</a> </td>
					                        </tr>
					                    </table>
				                    </td>
				                </tr>
			                </table>
							<div id="clip_holder" style="text-align: center;"></div>
			            </td>
		            </tr>
		            <tr>
						<td height="9" style="font-size:1px;"> &nbsp; </td>
		            </tr>
				</table>
	        </td>
	        <td width="12"> &nbsp; </td>
	    </tr>
    </table>
	

	<div style="width:100%;text-align:center;">
		<!-- PUT THIS TAG IN DESIRED LOCATION OF SLOT youtube_top_videos_txt -->
		<script type="text/javascript">
		  GA_googleFillSlot("youtube_top_videos_txt");
		</script>
		<!-- END OF TAG FOR SLOT youtube_top_videos_txt -->
	</div>
  <!-- LP footer -->
  <div>
  	<script type="text/javascript">
      var mMENU = _IG_GetCachedUrl("http://cdn.labpixies.com/infra/js/lp_footer.js");
      document.write('<scr'+'ipt type="text/javascript" src="'+mMENU+'"></scr'+'ipt>');
    </script>
  </div>
  <iframe width="1" height="1" style="width:1px; height:1px; overflow:hidden; position:absolute; visibility:hidden;" src="http://static.labpixies.com/campaigns/youtube/analytics.html"></iframe>

	
	<!-- init -->
	<script type="text/javascript">
		function setimages() {
			_gel("spacer").src					= _IG_GetImageUrl("http://cdn.labpixies.com/campaigns/youtube/images/spacer.gif");
			for (var i = 0;i < step;i++) {
				_gel('thumbnail_' + i).src		= _IG_GetImageUrl("http://cdn.labpixies.com/campaigns/youtube/images/spacer.gif");
			}
			_gel("main").style.background 	= 'url('+_IG_GetImageUrl("http://cdn.labpixies.com/campaigns/youtube/images/youtube_background.png")+') no-repeat';
		}
		setimages();
		_IG_RegisterOnloadHandler(function() {
			prefs = new _IG_Prefs();
			
			pageTracker = _gat._getTracker("UA-345375-1");
			pageTracker._initData();
			eventTracker = pageTracker._createEventTracker('YouTube'); 
			
				var my_clips = prefs.getString("my_clips");
				if (my_clips == '' || my_clips == 'none') {
					var tag = 'Recently Added';
					var url = 'global/recently_added.rss';
				}
				else {
					var tmp = my_clips.split('@');
					tag = tmp[0];
					url = tmp[1];
				}
			changeFeedTo(tag,url);
		});
	</script>
	
	<!-- google analytics -->
	<script type="text/javascript">
		_IG_Analytics("UA-345375-1", "/YouTube Top List");
	</script>
	]]>
	</Content>
</Module>