<?xml version="1.0" encoding="UTF-8" ?>
<Module>
	<ModulePrefs 
		title="Viral Videos" 
		directory_title="Latest Viral Videos from ViralVideoChart.com"
		description="See the new viral videos hitting the web before your friends and family even send them to you! This gadget uses the feed from ViralVideoChart.com, which monitors videos posted to web sites and blogs to identify those that are becoming popular and 'going viral'. This feed will let you watch them before most people have seen them, so you can keep your finger on the pulse of the web's pop culture. Once you've seen a video, you can click the X to mark it as seen so you won't waste space on your screen with videos you've already watched! When a new video is becoming popular, you'll see it show up in your gadget so you can watch it and know what everyone will be talking about tomorrow!" 
		author="Matt Kruse" 
		author_email="gadget@mattkruse.com" 
		screenshot="http://www.javascripttoolbox.com/gadget/viralvideo/viralvideo.png" 
		thumbnail="http://www.javascripttoolbox.com/gadget/viralvideo/viralvideo_thumb.png"
		singleton="false"
		author_affiliation="Matt Kruse" 
		author_location="IL, USA" 
		author_link="http://www.MattKruse.com/" 
		height="50"
		> 
		<Require feature="dynamic-height" /> 
		<Require feature="setprefs" /> 
		<Require feature="minimessage"/>
		<Require feature="analytics"/>
	</ModulePrefs>
		<UserPref name="num" display_name="Number of Videos To Show: " default_value="10" />
		<UserPref name="fontsize" display_name="Font Size: " default_value="80%" />
		<UserPref name="embed" datatype="bool" display_name="Embedded Videos in details: " default_value="true" />
		<UserPref name="refresh" display_name="Refresh interval (minutes): " default_value="60" />
		<UserPref name="seen" display_name="Seen Items (Do not edit!): " default_value="" />
		<UserPref name="lastmsg" datatype="hidden" default_value="0" />
		<UserPref name="today" datatype="hidden" default_value="" />
		<Content type="html"> 
		<![CDATA[ 
<script type="text/javascript">
var prefs = new _IG_Prefs();

// Analytics
var now = new Date();
var today = (now.getFullYear?now.getFullYear():now.getYear())+'-'+(now.getMonth()+1)+'-'+now.getDate();
var prefs_today = prefs.getString('today');
// Analytics - Record a new gadget add
if (prefs_today=='') {
	_IG_Analytics("UA-6382940-1", "/addgadget/viralvideo");
}
// Analytics - Record a unique hit for today
if (prefs_today!=today) {
	prefs.set('today',today);
	_IG_Analytics("UA-6382940-1", "/gadget/viralvideo");
}
// Messages
var lastmsg = prefs.getInt("lastmsg");
var maxmsg = 0;
var displaymsgs = false;
var msgcontent = "";
function createMessage(id,msg) {
	msgcontent += "<div class=\"message\">"+msg+"</div>";
	if (id>maxmsg) {
		maxmsg = id;
	}
}
_IG_RegisterOnloadHandler(function() {
	if (msgcontent!="") {
		_gel('msg_content').innerHTML = msgcontent;
		_gel('messages').style.display="block";
		_IG_AdjustIFrameHeight();
	}
});
function dismiss_msg() { 
	prefs.set("lastmsg",maxmsg); 
	_gel('messages').style.display="none";
	_IG_AdjustIFrameHeight();
}
function addMsg(id,msg) { if (id>lastmsg) { createMessage(id,msg); } }

// Gadget messages
addMsg(1,"Click each item to expand and view the video. Click the red X to the right to mark it as seen and remove it from your list. Click the X in this message to dismiss it forever!");
addMsg(2,"2009-03-04: New option added - limit number of videos shown to less than 20! (default is now 10)");

// Handling marking items as seen
var seen = prefs.getString('seen');
function addSeen(ref) {
	seen = ref+"|"+seen.substring(0,999);
	prefs.set('seen',seen);
}

// Data retrieval, etc
var url = 'http://www.viralvideochart.com/?format=atomB';
var x_div = '<div class="del" onclick="del(this,\'%ref%\');return false;" title="Click to mark as seen">X</div>';
var title_div = '<div class="title %alternate% %siteId%" onclick="title_click(this)">' + x_div + '%rank%. %favicon% %title%</div>';
var embed_div = '<div class="embed" style="display:none;"><a href="%viralVideoUrl%" target="_blank">View on ViralVideoChart.com</a> <a href="%hostingSiteUrl%" target="_blank">View on %siteId%</a><br><div class="description"></div>%embed%</div>';
var template = '<div class="item">' + title_div + embed_div + '</div>';
var interval = null;

function load() {
	if (interval!=null) { clearInterval(interval); }
	interval = setInterval(load, (1000 * 60 * prefs.getInt('refresh')));
	_IG_FetchXmlContent(url,render);
}
function setContent(str) {
	_gel("content").innerHTML = str;
}
function children(o,tag) {
	var t = o.getElementsByTagName(tag);
	if (t==null) { t=[]; }
	return t;
}
function childVal(o,tag) {
	var t = o.getElementsByTagName(tag);
	if (t && t.length>0) {
		return t.item(0).firstChild.nodeValue;
	}
	return '';
}
function render(obj) {
	if (obj == null || typeof(obj) != "object" || obj.firstChild == null) {
		setContent("<i>Invalid data.</i>");
		return;
	}
	var num = prefs.getInt('num');
	
	var content = '';

	var videos = children(obj,'vv:video');
	var count = 0;
	for (var i=0; i<videos.length; i++) {
		if (i<num) {
			var v = videos[i];
			var props = {};
			props['ref'] = childVal(v,'videoRef');
			if (seen.indexOf(props['ref'])==-1) {
				props['title'] = _hesc(childVal(v,'title'));
				props['embed'] = (prefs.getBool('embed'))?childVal(v,'embedCode'):'';
				props['viralVideoUrl'] = childVal(v,'viralVideoUrl');
				var hostingSiteUrl = props['hostingSiteUrl'] = childVal(v,'hostingSiteUrl');
				props['siteId'] = childVal(v,'siteId');
				props['rank'] = i+1;
				props['alternate'] = (count++%2==1)?'alternate':'';
				props['favicon'] = '<img height=16 width=16 src="'+hostingSiteUrl.replace(/(http:\/\/[^\/]+).*/,"$1") + '/favicon.ico" onerror="this.style.display=\'none\';">';
			
				var item = template;
				for (var v in props) {
					item = item.replace(new RegExp('%'+v+'%','g'),props[v]);
				}
			content += item;
			}
		}
	}

	setContent(content||'no new videos');
	_IG_AdjustIFrameHeight();
}
_IG_RegisterOnloadHandler(load);

function title_click(div) {
	var embed = div.nextSibling;
	_toggle(embed);
	var divs = embed.getElementsByTagName('DIV');
	var as = embed.getElementsByTagName('A');
	if (divs && divs.length>0 && as && as.length>1) {
		var desc = divs[0];
		var a = as[1];
		if (div.className && div.className.indexOf('youtube')>=0) {
			if (desc.innerHTML=='') {
				desc.innerHTML = 'Loading description from YouTube...';
				_IG_FetchContent(a.href, function (c) {
					var desc_regex = /\<div\s*class="watch-video-desc\s*description"\>([\s\S]*?)\<\/div\>/mi;
					var match = desc_regex.exec(c);
					if (match && match.length>1) {
						desc.innerHTML = match[1];
						_IG_AdjustIFrameHeight();
					}
				});
			}
		}
	}
	_IG_AdjustIFrameHeight();
}

function del(div,ref) {
	var item = div.parentNode.parentNode;
	item.style.display="none";
	addSeen(ref);
	_IG_AdjustIFrameHeight();
}

document.writeln("<style>body { font-size:"+prefs.getString('fontsize')+";}</style>");
</script>
<style>
.title {
	cursor:pointer;
}
.alternate {
	background-color:#eee;
}
div.title:hover {
	background-color:yellow !important;
}
div.description {
	border:1px solid #ccc; 
	padding:1px;
	margin:3px;
	color:#333;
}
.del {
	float:right;
	width:12;
	height:10px;
	font-size:10px;
	cursor:pointer;
	background-color:red;
	color:white;
	font-weight:bold;
	border:1px solid black;
	margin:1px;
	padding:0px;
	text-align:center;
	vertical-align:center;
	line-height:10px;
}
div.del:hover {
	background-color:white;
	color:red;
}

#messages {
	display:none;
	border:3px solid #F4D307;
	-moz-border-radius:8px;
	background-color:white;
	background-image:url(http://www.google.com/nonprofits/images/lightbulb-35.gif);
	background-repeat:no-repeat;
	background-position:2px 3px;
	padding-left: 37px;
	padding-top:2px;
	min-height:35px;
	font-family:arial;
	font-weight:bold;
	font-size:12px;
	margin:3px;
}
.close {
	width:50px;
	background-color:#8B8C8D;
	color:white;
	border:1px solid #999;
	border-color:#ddd #999 #999 #ddd;
	text-align:center;
	cursor:pointer;
	margin:5px 0px;
}
.message{
	margin-bottom:10px;
}
</style>
<div id="messages"><div id="msg_content"></div><div class="close" onclick="dismiss_msg()">OK</div></div>
<div id="container">
	<div id="content">
	Loading...
	</div>
</div>

     ]]> 
   </Content> 
</Module>
