Skip to content

Instantly share code, notes, and snippets.

@markandey

markandey/delhi-radio.html

Created October 31, 2012 21:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save markandey/3989983 to your computer and use it in GitHub Desktop.
Save markandey/3989983 to your computer and use it in GitHub Desktop.
Download ZIP
delhi-radio
Raw
delhi-radio.html
<html>
<head>
<title>Delhi Radio</title>
<script src="http://yui.yahooapis.com/3.7.3/build/yui/yui-min.js"></script>
<script src="radio.js">
function sing(songResult) {
var marquee = "",
songName = "";
try {
marquee = songResult.results[0] + "";
var m = marquee.match(/\<\/strong\>(.+?)\<strong\>/);
songName = m[1];
} catch(e) {
alert(marquee);
return;
}
YUI().use('node', 'yql', 'substitute', function(Y) {
/// THIS IS HOW CAN YOU USE YQL with YUI.
Y.YQL("select * from youtube.search where query=\"" + songName + "\" limit 3", function(r) {
var youTubeTemplate = "<div class=\"songName\">{title}</div><iframe width=\"420\" height=\"315\" src=\"http://www.youtube-nocookie.com/embed/{id}?autoplay=1&loop=1\" frameborder=\"0\" allowfullscreen></iframe>";
Y.one('#play').setContent(Y.substitute(youTubeTemplate, r.query.results.video[2]));
});
});
}
</script>
<style type="text/css">
html,body{
font-family: sans-serif;
text-align: center;
background-color: #eee;
}
#main{
margin: auto;
text-align: left;
background: #fff;
min-height: 400px;
width:700px;
padding: 10px;
}
.radio{
font-style: italic;
color:red;
}
.mirch{
font-style: italic;
color:green;
}
.tube{
background-color: red;
color:white;
}
.songName{
font-size: 17px;
margin:10px 0;
}
pre{
display: block;
padding:20px;
color:#22ff22;
margin-top: 20px;
background:#303030;
overflow: auto;
}
</style>
</head>
<body>
<div id="main">
<h1><span class="radio">Radio</span><span class="mirch">Mirchi</span> + <span> You</span><span class="tube">Tube</span></h1>
<div id="play">
<iframe width="420" height="315" src="http://www.youtube-nocookie.com/embed/dD8h2TT3Izs?autoplay=1&loop=1" frameborder="0" allowfullscreen></iframe>
</div>
</div>
<script src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22http%3A%2F%2Fwww.radiomirchi.com%2Fdelhi%2Fwhats-hot%2Faudio%22%20and%0A%20%20%20%20%20%20xpath%3D'%2F%2Fmarquee%5B%40id%3D%22ticker_nowplaying%22%5D'&format=xml&diagnostics=true&callback=sing" type="text/javascript"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment