| OLD | NEW |
| (Empty) |
| 1 // Copyright 2009 Google Inc. All Rights Reserved. | |
| 2 | |
| 3 /** | |
| 4 * @fileoverview This file contains js that continues collect Popular video | |
| 5 * from YouTube and displays them when needed. | |
| 6 * @author lzheng@chromium.com (Lei Zheng) | |
| 7 */ | |
| 8 | |
| 9 const YT_POLL_INTERVAL = 1000 * 600; // 10 minute | |
| 10 var json_url_popular = 'http://gdata.youtube.com/feeds/api/standardfeeds/' + | |
| 11 'most_popular?time=today&alt=json-in-script&format=5&max-results=50&' + | |
| 12 'callback=processVideos'; | |
| 13 | |
| 14 // This holds all videos when browser starts. | |
| 15 var YT_existing_video_map = new Map(); | |
| 16 // This holds all popular videos after browser starts. | |
| 17 var YT_latest_video_map = new Map(); | |
| 18 | |
| 19 var YT_reqCount = 0; | |
| 20 | |
| 21 const YT_MAX_VIDEOS = 500; | |
| 22 | |
| 23 var YT_start_time = Date(); | |
| 24 | |
| 25 /** | |
| 26 * Class that holds video information that will be displayed. | |
| 27 * @param {string} video_url Video Url from Gdata for a given video. | |
| 28 * @param {string} thumb_url The url to access thumbnails. | |
| 29 * @param {string} title Title of the video. | |
| 30 * @param {string} description The description of the video. | |
| 31 */ | |
| 32 function videoEntry(video_url, thumb_url, title, description) { | |
| 33 this.video_url = video_url; | |
| 34 this.thumb_url = thumb_url; | |
| 35 this.title = title; | |
| 36 this.description = description; | |
| 37 this.time = Date(); | |
| 38 } | |
| 39 | |
| 40 /** | |
| 41 * Dump what's in the video_map to html. | |
| 42 * @param {Map} video_map The Map that contains video information. | |
| 43 * @return {string} The html output. | |
| 44 */ | |
| 45 function outputMap(video_map) { | |
| 46 var keys = video_map.keys() || []; | |
| 47 var output = '<table>'; | |
| 48 for (var i = 0; i < keys.length; ++i) { | |
| 49 console.log(keys[i]); | |
| 50 var title = video_map.get(keys[i]).title; | |
| 51 var playerUrl = video_map.get(keys[i]).video_url; | |
| 52 var thumbnailUrl = video_map.get(keys[i]).thumb_url; | |
| 53 var time = video_map.get(keys[i]).time; | |
| 54 var description = video_map.get(keys[i]).description; | |
| 55 if (i % 3 == 0) { | |
| 56 if (i != 0) { | |
| 57 output += '</tr>'; | |
| 58 } | |
| 59 output += '<tr>'; | |
| 60 } | |
| 61 output += '<td><a href = \' ' + playerUrl + '\' target=\'_black\'\'>' + | |
| 62 '<img src="'+ thumbnailUrl + '" width="130" height="97"/><br />' + | |
| 63 '<span class="titlec">' + title + '...</span><br /></a><br />' + | |
| 64 '<font size=2>' + description + '... </font></td>'; | |
| 65 } | |
| 66 output += '</tr></table>'; | |
| 67 return output; | |
| 68 } | |
| 69 | |
| 70 /** | |
| 71 * Display popular videos when and after browser started. | |
| 72 */ | |
| 73 function showYTLatest() { | |
| 74 var new_win = window.open(); | |
| 75 var html = ['<html><head><title>New Popular YouTube Videos</title><style>', | |
| 76 '.titlec { font-size: small;}ul.videos li { float: left; ', | |
| 77 'width: 10em; margin-bottom: 1em;}ul.videos{ ', | |
| 78 'margin-bottom: 1em; padding-left : 0em; margin-left: 0em; ', | |
| 79 'list-style: none;}</style></head><body>']; | |
| 80 console.log('show my videos total: ' + YT_latest_video_map.size()); | |
| 81 html.push('<div id="videos"><font size="5" color="green">', | |
| 82 YT_latest_video_map.size(), | |
| 83 '</font> new popular videos after you start', | |
| 84 ' your browser at: <font size="1">', YT_start_time, | |
| 85 '</font><ul>'); | |
| 86 | |
| 87 html.push(outputMap(YT_latest_video_map)); | |
| 88 html.push('</ul></div>'); | |
| 89 | |
| 90 html.push('<div id="videos"><font size="5" color="green">', | |
| 91 YT_existing_video_map.size(), | |
| 92 '</font> popular videos when you start your browser at: ', | |
| 93 '<font size="1">', YT_start_time, '</font><ul>'); | |
| 94 html.push(outputMap(YT_existing_video_map)); | |
| 95 html.push('</ul></div>'); | |
| 96 html.push('</body></html>'); | |
| 97 console.log('html: ' + html.join('')); | |
| 98 new_win.document.write(html.join('')); | |
| 99 } | |
| 100 | |
| 101 /** | |
| 102 * Callback function for GDataJson and schedule the next gdata call. | |
| 103 * Extract data from Gdata and store them if needed. | |
| 104 * @param {Gdata} gdata Gdata from YouTube. | |
| 105 */ | |
| 106 function processVideos(gdata) { | |
| 107 var feed = gdata.feed; | |
| 108 var entries = feed.entry || []; | |
| 109 console.log('process videos total: ' + entries.length | |
| 110 + 'reqCount=' + YT_reqCount); | |
| 111 var first_run = false; | |
| 112 | |
| 113 if (YT_existing_video_map.size() == 0) { | |
| 114 first_run = true; | |
| 115 } | |
| 116 for (var i = 0; i < entries.length; i++) { | |
| 117 var title = entries[i].title.$t.substr(0,20); | |
| 118 var thumb_url = entries[i].media$group.media$thumbnail[0].url; | |
| 119 var video_url = entries[i].media$group.media$player[0].url; | |
| 120 var description = | |
| 121 entries[i].media$group.media$description.$t.substr(0, 100); | |
| 122 if (first_run == true) { | |
| 123 YT_existing_video_map.insert( | |
| 124 title, | |
| 125 new videoEntry(video_url, thumb_url, title, description)); | |
| 126 console.log(title); | |
| 127 } else { | |
| 128 if (YT_existing_video_map.get(title) == null) { | |
| 129 // This is new, keep it | |
| 130 if (YT_latest_video_map.size() < YT_MAX_VIDEOS) { | |
| 131 YT_latest_video_map.insert( | |
| 132 title, | |
| 133 new videoEntry(video_url, thumb_url, title, description)); | |
| 134 } else { | |
| 135 console.log('Too many new videos'); | |
| 136 } | |
| 137 } | |
| 138 } | |
| 139 } | |
| 140 | |
| 141 // Schedule the next call | |
| 142 document.getElementById('newCount').innerHTML = '(was ' + | |
| 143 YT_existing_video_map.size() + ', new ' + | |
| 144 YT_latest_video_map.size() + ')'; | |
| 145 var gdata_json = document.getElementById('gdata_json'); | |
| 146 | |
| 147 // cleanup the json script inserted in fetchJSON | |
| 148 document.getElementsByTagName('body')[0].removeChild(gdata_json); | |
| 149 scheduleRequest(); | |
| 150 } | |
| 151 | |
| 152 /** | |
| 153 * Fetch gdata via JSON. | |
| 154 */ | |
| 155 function fetchJSON() { | |
| 156 var scr = document.createElement('script'); | |
| 157 scr.setAttribute('language', 'JavaScript'); | |
| 158 scr.setAttribute('src', json_url_popular + '&reqCount=' + YT_reqCount); | |
| 159 scr.setAttribute('id', 'gdata_json'); | |
| 160 ++YT_reqCount; | |
| 161 document.getElementsByTagName('body')[0].appendChild(scr); | |
| 162 } | |
| 163 | |
| 164 /** | |
| 165 * Where the extension starts. | |
| 166 */ | |
| 167 function start() { | |
| 168 window.setTimeout(fetchJSON, 0); | |
| 169 } | |
| 170 | |
| 171 /** | |
| 172 * Schedule the fetchJSON call. | |
| 173 */ | |
| 174 function scheduleRequest() { | |
| 175 window.setTimeout(fetchJSON, YT_POLL_INTERVAL); | |
| 176 } | |
| OLD | NEW |