Youtube Feed gdata example

On 04.03.12, In 4, social api, by Samuel east
Been playing around with youtube gdata video feed.

View a jsfiddle example http://jsfiddle.net/sFgnE/2/



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">

#results { width:100%; }

#results ul { width:100%; }

#results ul li {
display: inline-block;
width: 150px;
float: left;
height:210px;
}

#results ul li h3 {
	font-size:12px;
}

#results ul li p {
	font-size:12px;
}

#results ul li a { }

#loader { margin:200px auto; width:100px; height:100px; }

.countdown { color:#000; }

</style>
</head>

<body>
<p class="countdown"></p> 
<div id="results">  </div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> 
<script type="text/javascript">

 

var url = 'http://gdata.youtube.com/feeds/api/videos?v=2&alt=jsonc&q=heavy&orderby=published&time=today&callback=?';

 

var count = 10,
    countdown = setInterval(function () {
        $("p.countdown").html(count + " seconds remaining!");
		$("#loader").hide();
        if (count == 0) {
            count = 11;


    $("#results").empty();
	
	$('#results').after('<img id="loader" src="http://suys.s3.amazonaws.com/ajax.loaders/ajax-loader-loading.gif" class="loader" />');

    console.log(url);



    $.getJSON(url, function(json) {

        console.log(json);
		 var html = "<ul>";
        $.each(json.data.items, function(i, youtube) {
			
			var title = strip_tags(youtube.title).substr(0,20);
			var content = strip_tags(youtube.description).substr(0,80);
			
 				html += '<li><img src="'+youtube.thumbnail.sqDefault+'"/><h3><a target="_blank" href="'+youtube.player.default+'">'+title+'</a></h3><p>'+content+'</p></li>'; 
				
			
				
				if( title.indexOf( "dubstep" ) !== -1 ){
				
				alert('found');	
					
				}

             $("#loader").hide();
        });
		 html += "</ul>";
		$('#results').html(html).fadeIn('slow');

    }); 
	
}
        count--;
    }, 1000);

function strip_tags(html){
 
		//PROCESS STRING
		if(arguments.length < 3) {
			html=html.replace(/</?(?!!)[^>]*>/gi, '');
		} else {
			var allowed = arguments[1];
			var specified = eval("["+arguments[2]+"]");
			if(allowed){
				var regex='</?(?!(' + specified.join('|') + '))b[^>]*>';
				html=html.replace(new RegExp(regex, 'gi'), '');
			} else{
				var regex='</?(' + specified.join('|') + ')b[^>]*>';
				html=html.replace(new RegExp(regex, 'gi'), '');
			}
		}
 
		//CHANGE NAME TO CLEAN JUST BECAUSE 
		var clean_string = html;
 
		//RETURN THE CLEAN STRING
		return clean_string;
	}

</script>



</body>
</html>