Kahn Academy Video Playlist

by dandiebolt

HTML

<script src="https://github.com/jquery/jquery-tmpl/raw/master/jquery.tmpl.min.js"></script>
<script src="https://www.quickbase.com/db/befe2yy7d?a=dbpage&amp;pagename=jsonpath-0.8.0.js"></script>
<script id="template1" type="text/x-jquery-tmpl">

<b>next_video:</b> ${next_video}<br/>
<b>video_position:</b> ${video_position}<br/>
<b>description:</b> ${description}<br/>
<b>title:</b> ${title}<br/>
<b>views:</b> ${views}<br/>
<b>related_videos:</b> ${related_videos}<br/>
<b>playlist_titles:</b> ${playlist_titles}<br/>
<b>duration:</b> ${duration}<br/>
<b>ka_url:</b> <a href="${ka_url}" target="_blank">${ka_url}</a><br/>
<b>youtube_id:</b> ${youtube_id}<br/>
<b>keywords:</b> ${keywords}<br/>
<b>date_added:</b> ${date_added}<br/>
<b>youtube_url:</b> <a href="${youtube_url}" target="_blank">${youtube_url}</a><br/>
<b>prev_video:</b> ${prev_video}<br/>
<b>readable_id:</b> ${readable_id}<br/>
<hr/>
</script>

<h1>Kahn Academy Video Playlist for Calculus</h1>
<div id="info1"></div>

CSS

ul {
    list-style-type: none;
}

JavaScript

var url ="http://www.khanacademy.org/api/playlistvideos?playlist=Calculus&callback=?";

$.ajax({
    url: url,
    dataType: 'jsonp',
    success: function(data) {
        console.log(data)
        $("#template1").tmpl(data).appendTo("#info1");
    }
});