diff options
| author | smus@chromium.org <smus@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2011-12-15 00:02:15 +0000 |
|---|---|---|
| committer | smus@chromium.org <smus@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2011-12-15 00:02:15 +0000 |
| commit | d6fa6fba71f69b2c4c3ad454770d57d837c36f77 (patch) | |
| tree | 27da085be382990d3fd9b730eecaa1f7366433e6 /chrome/common/extensions/docs/examples/api/storage | |
| parent | cb6573d8608d89db80b50ecdefb9ed1fb51f0101 (diff) | |
| download | chromium_src-d6fa6fba71f69b2c4c3ad454770d57d837c36f77.zip chromium_src-d6fa6fba71f69b2c4c3ad454770d57d837c36f77.tar.gz chromium_src-d6fa6fba71f69b2c4c3ad454770d57d837c36f77.tar.bz2 | |
Added storage sample.
BUG=98591
TEST=
Review URL: http://codereview.chromium.org/8916013
git-svn-id: svn://svn.chromium.org/chrome/trunk/src@114531 0039d316-1c4b-4281-b951-d872f2087c98
Diffstat (limited to 'chrome/common/extensions/docs/examples/api/storage')
7 files changed, 164 insertions, 0 deletions
diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr.zip b/chrome/common/extensions/docs/examples/api/storage/stylizr.zip Binary files differnew file mode 100644 index 0000000..e962e3a --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr.zip diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr/icon.png b/chrome/common/extensions/docs/examples/api/storage/stylizr/icon.png Binary files differnew file mode 100644 index 0000000..85ea072 --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr/icon.png diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr/manifest.json b/chrome/common/extensions/docs/examples/api/storage/stylizr/manifest.json new file mode 100644 index 0000000..64484e0 --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr/manifest.json @@ -0,0 +1,21 @@ +{ + "name": "Stylizr", + "description": "Spruce up your pages with custom CSS.", + "version": "1.0", + + "permissions": [ + "tabs", + "<all_urls>", + "experimental" + ], + + "options_page": "options.html", + + "browser_action": { + "default_icon": "icon.png", + "default_title": "Stylize!", + "default_popup": "popup.html" + }, + + "manifest_version": 2 +} diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr/options.html b/chrome/common/extensions/docs/examples/api/storage/stylizr/options.html new file mode 100644 index 0000000..108e661 --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr/options.html @@ -0,0 +1,42 @@ +<!doctype html> +<html> + <head> + <title>Stylizr</title> + <style> + body { + font-family: sans-serif; + } + label { + display: block; + } + textarea { + font-family: monospace; + } + .message { + height: 20px; + background: #eee; + padding: 5px; + } + </style> + </head> + <body> + <div class="message"></div> + <h3>Stylizr Instructions</h3> + + <ol> + <li>Write CSS in this textarea and save</li> + <li>Navigate to some page</li> + <li>Click the browser action icon <img src="icon.png" /></li> + <li>Hey presto! CSS is injected!</li> + </ol> + + <textarea name="style_url" id="style_url" cols=80 rows=24 + placeholder="eg: * { font-size: 110%; }"></textarea> + + <br/> + <button class="submit">Save</button> + <button class="reset">Reset</button> + + <script src="options.js"></script> + </body> +</html> diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr/options.js b/chrome/common/extensions/docs/examples/api/storage/stylizr/options.js new file mode 100644 index 0000000..4eeab8f --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr/options.js @@ -0,0 +1,58 @@ +// 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. + +// Store settings in the synchronized repository. +var storage = chrome.experimental.storage.sync; + +// Get at the DOM controls used in the sample. +var resetButton = document.querySelector('button.reset'); +var submitButton = document.querySelector('button.submit'); +var textarea = document.querySelector('textarea'); + +// Load any CSS that may have previously been saved. +loadChanges(); + +submitButton.addEventListener('click', saveChanges); +resetButton.addEventListener('click', reset); + +function saveChanges() { + // Get the current CSS snippet from the form. + var cssCode = textarea.value; + // Check that there's some code there. + if (!cssCode) { + message('Error: No CSS specified'); + return; + } + // Save it locally (un-synchronized) using the Chrome extension storage API. + storage.set({'css': cssCode}, function() { + // Notify that we saved. + message('Settings saved'); + }); +} + +function loadChanges() { + storage.get('css', function(items) { + if (items.css) { + textarea.value = items.css; + message('Loaded saved CSS.'); + } + }); +} + +function reset() { + // Remove the saved value from storage + storage.remove('css', function(items) { + message('Reset stored CSS'); + }); + // Refresh the text area. + textarea.value = ''; +} + +function message(msg) { + var message = document.querySelector('.message'); + message.innerText = msg; + setTimeout(function() { + message.innerText = ''; + }, 3000); +} diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr/popup.html b/chrome/common/extensions/docs/examples/api/storage/stylizr/popup.html new file mode 100644 index 0000000..02b597d --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr/popup.html @@ -0,0 +1,16 @@ +<!doctype html> +<html> + <head> + <title>Stylizr</title> + <style> + body { + font-family: sans-serif; + width: 200px; + } + </style> + </head> + <body> + <div id="message"></div> + <script src="popup.js"></script> + </body> +</html> diff --git a/chrome/common/extensions/docs/examples/api/storage/stylizr/popup.js b/chrome/common/extensions/docs/examples/api/storage/stylizr/popup.js new file mode 100644 index 0000000..af1833f --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/storage/stylizr/popup.js @@ -0,0 +1,27 @@ +// 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. + +// Store settings in the synchronized repository. +var storage = chrome.experimental.storage.sync; +var message = document.querySelector('#message'); + +// Check if there is CSS specified. +storage.get('css', function(items) { + console.log(items); + // If there is CSS specified, inject it into the page. + if (items.css) { + chrome.tabs.insertCSS(null, {code: items.css}, function() { + if (chrome.extension.lastError) { + message.innerText = 'Not allowed to inject CSS into special page.'; + } else { + message.innerText = 'Injected style!'; + } + }); + } else { + var optionsUrl = chrome.extension.getURL('options.html'); + message.innerHTML = 'Set a style in the <a target="_blank" href="' + + optionsUrl + '">options page</a> first.'; + } +}); + |
