1 /* 2 * Copyright (c) 2011 The Chromium Authors. All rights reserved. 3 * Use of this source code is governed by a BSD-style license that can be 4 * found in the LICENSE file. 5 */ 6 7 /** 8 * Performs an XMLHttpRequest to Twitter's API to get trending topics. 9 * 10 * @param callback Function If the response from fetching url has a 11 * HTTP status of 200, this function is called with a JSON decoded 12 * response. Otherwise, this function is called with null. 13 */ 14 function fetchTwitterFeed(callback) { 15 var xhr = new XMLHttpRequest(); 16 xhr.onreadystatechange = function(data) { 17 if (xhr.readyState == 4) { 18 if (xhr.status == 200) { 19 var data = JSON.parse(xhr.responseText); 20 callback(data); 21 } else { 22 callback(null); 23 } 24 } 25 } 26 // Note that any URL fetched here must be matched by a permission in 27 // the manifest.json file! 28 var url = 'https://api.twitter.com/1/trends/daily.json?exclude=hashtags'; 29 xhr.open('GET', url, true); 30 xhr.send(); 31 }; 32 33 /** 34 * Parses text from Twitter's API and generates a bar with trending topics at 35 * the top of the current page 36 * 37 * @param data Object JSON decoded response. Null if the request failed. 38 */ 39 function onText(data) { 40 // Only render the bar if the data is parsed into a format we recognize. 41 if (data.trends) { 42 // Create the overlay at the top of the page and fill it with data. 43 var trends_dom = document.createElement('div'); 44 var title_dom = document.createElement('strong'); 45 title_dom.innerText = 'Topics currently trending on Twitter:'; 46 trends_dom.appendChild(title_dom); 47 for (var key in data.trends) { 48 for (var i=0,trend; trend = data.trends[key][i]; i++) { 49 var link_dom = document.createElement('a'); 50 link_dom.setAttribute('href', trend.url) 51 link_dom.innerText = trend.name; 52 link_dom.style.color = '#000'; 53 trends_dom.appendChild(document.createTextNode(' ')); 54 trends_dom.appendChild(link_dom); 55 } 56 break; 57 } 58 trends_dom.style.cssText = [ 59 'background-color: #ffd700;', 60 'background-image: -webkit-repeating-linear-gradient(' + 61 '45deg, transparent, transparent 35px,' + 62 'rgba(0,0,0,.1) 35px, rgba(0,0,0,.1) 70px);', 63 'color: #000;', 64 'padding: 10px;', 65 'font: 14px Arial;' 66 ].join(' '); 67 document.body.style.cssText = 'position: relative'; 68 document.body.parentElement.insertBefore(trends_dom, document.body); 69 } 70 }; 71 72 fetchTwitterFeed(onText); 73
