Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(406)

Unified Diff: chrome/common/extensions/docs/examples/howto/contentscript_xhr/contentscript.js

Issue 7210049: Update contentscript xhr example to remove background page. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Rebuilding docs Created 9 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/common/extensions/docs/examples/howto/contentscript_xhr/contentscript.js
diff --git a/chrome/common/extensions/docs/examples/howto/contentscript_xhr/contentscript.js b/chrome/common/extensions/docs/examples/howto/contentscript_xhr/contentscript.js
index 1719d8a91f4bb1d2f3c4d6fb1d3c79356d348009..33235e08cfe2a50020a16876a1a8fc812a8d97e0 100644
--- a/chrome/common/extensions/docs/examples/howto/contentscript_xhr/contentscript.js
+++ b/chrome/common/extensions/docs/examples/howto/contentscript_xhr/contentscript.js
@@ -1,44 +1,69 @@
/*
- * Copyright (c) 2010 The Chromium Authors. All rights reserved. Use of this
- * source code is governed by a BSD-style license that can be found in the
- * LICENSE file.
+* Copyright (c) 2011 The Chromium Authors. All rights reserved.
+* Use of this source code is governed by a BSD-style license that can be
+* found in the LICENSE file.
+*/
+
+/**
+ * Performs an XMLHttpRequest to Twitter's API to get trending topics.
+ *
+ * @param callback Function If the response from fetching url has a
+ * HTTP status of 200, this function is called with a JSON decoded
+ * response. Otherwise, this function is called with null.
*/
+function fetchTwitterFeed(callback) {
+ var xhr = new XMLHttpRequest();
+ xhr.onreadystatechange = function(data) {
+ if (xhr.readyState == 4) {
+ if (xhr.status == 200) {
+ var data = JSON.parse(xhr.responseText);
+ callback(data);
+ } else {
+ callback(null);
+ }
+ }
+ }
+ // Note that any URL fetched here must be matched by a permission in
+ // the manifest.json file!
+ var url = 'https://api.twitter.com/1/trends.json?exclude=hashtags';
+ xhr.open('GET', url, true);
+ xhr.send();
+};
/**
* Parses text from Twitter's API and generates a bar with trending topics at
* the top of the current page
+ *
* @param data Object JSON decoded response. Null if the request failed.
*/
function onText(data) {
// Only render the bar if the data is parsed into a format we recognize.
if (data.trends) {
- var trend_names = []
- for (var date in data.trends) {
- if (data.trends.hasOwnProperty(date)) {
- var trends = data.trends[date];
- for (var i=0,trend; trend = trends[i]; i++) {
- trend_names.push(trend.name);
- }
- }
- }
-
// Create the overlay at the top of the page and fill it with data.
var trends_dom = document.createElement('div');
var title_dom = document.createElement('strong');
- var text_dom = document.createTextNode(trend_names.join(', '));
- title_dom.innerText = 'Topics currently trending on Twitter ';
+ title_dom.innerText = 'Topics currently trending on Twitter:';
trends_dom.appendChild(title_dom);
- trends_dom.appendChild(text_dom);
- trends_dom.style.background = '#36b';
- trends_dom.style.color = '#fff';
- trends_dom.style.padding = '10px';
- trends_dom.style.position = 'relative';
- trends_dom.style.zIndex = '123456';
- trends_dom.style.font = '14px Arial';
- document.body.insertBefore(trends_dom, document.body.firstChild);
+ for (var i=0,trend; trend = data.trends[i]; i++) {
+ var link_dom = document.createElement('a');
+ link_dom.setAttribute('href', trend.url)
+ link_dom.innerText = trend.name;
+ link_dom.style.color = '#000';
+ trends_dom.appendChild(document.createTextNode(' '));
+ trends_dom.appendChild(link_dom);
+ }
+ trends_dom.style.cssText = [
+ 'background-color: #ffd700;',
+ 'background-image: -webkit-repeating-linear-gradient(' +
+ '45deg, transparent, transparent 35px,' +
+ 'rgba(0,0,0,.1) 35px, rgba(0,0,0,.1) 70px);',
+ 'color: #000;',
+ 'padding: 10px;',
+ 'font: 14px Arial;'
+ ].join(' ');
+ document.body.style.cssText = 'position: relative';
+ document.body.parentElement.insertBefore(trends_dom, document.body);
}
};
-// Send a request to fetch data from Twitter's API to the background page.
-// Specify that onText should be called with the result.
-chrome.extension.sendRequest({'action' : 'fetchTwitterFeed'}, onText);
+fetchTwitterFeed(onText);

Powered by Google App Engine
This is Rietveld 408576698