Index: chrome/common/extensions/docs/static/options.html |
=================================================================== |
--- chrome/common/extensions/docs/static/options.html (revision 0) |
+++ chrome/common/extensions/docs/static/options.html (revision 0) |
@@ -0,0 +1,77 @@ |
+<div id="pageData-title" class="pageData">Options</div> |
+<div id="pageData-showTOC" class="pageData">true</div> |
+<p>To allow users to customize the behavior of your extension, you may wish to provide an options page. If you do, a link to it will be provided from the Extensions Management page at chrome://extensions. Clicking on this link will open a new tab pointing at your options page. |
+ |
+<h2>Step 1: Declare your options page in the manifest</h2> |
+ |
+<pre>{ |
+ "name": "Test Extension", |
+ "version": "1.0", |
+ "description": "This is a test", |
+ <b>"options_page": "options.html"</b> |
+} |
+</pre> |
+ |
+ |
+<h2>Step 2: Write your options page</h2> |
+ |
+Here is an example options page: |
+ |
+<pre> |
+<html> |
+<head><title>My Test Extension Options</title></head> |
+<script type="text/javascript"> |
+ |
+// Saves options to localStorage. |
+function save_options() { |
+ var select = document.getElementById("color"); |
+ var color = select.children[select.selectedIndex].value; |
+ localStorage["favorite_color"] = color; |
+ |
+ // Update status to let user know options were saved. |
+ var status = document.getElementById("status"); |
+ status.innerHTML = "Options Saved."; |
+ setTimeout(function() { |
+ status.innerHTML = ""; |
+ }, 750); |
+} |
+ |
+// Restores select box state to saved value from localStorage. |
+function restore_options() { |
+ var favorite = localStorage["favorite_color"]; |
+ if (!favorite) { |
+ return; |
+ } |
+ var select = document.getElementById("color"); |
+ for (var i = 0; i < select.children.length; i++) { |
+ var child = select.children[i]; |
+ if (child.value == favorite) { |
+ child.selected = "true"; |
+ break; |
+ } |
+ } |
+} |
+ |
+</script> |
+ |
+<body onload="restore_options()"> |
+ |
+Favorite Color: |
+<select id="color"> |
+ <option value="red">red</option> |
+ <option value="green">green</option> |
+ <option value="blue">blue</option> |
+ <option value="yellow">yellow</option> |
+</select> |
+ |
+<br> |
+<button onclick="save_options()">Save</button> |
+</body> |
+</html> |
+</pre> |
+ |
+<h2>Important Notes</h2> |
+<ul> |
+<li>This feature is checked in to the trunk and should land in official builds sometime <b>after</b> version 4.0.222.x.</li> |
+<li>We plan on providing some default css styles to encourage a consistent look across different extensions' options pages. You can star <a href="http://crbug.com/25317">crbug.com/25317</a> to be notified of updates.</li> |
+</ul> |
Property changes on: chrome\common\extensions\docs\static\options.html |
___________________________________________________________________ |
Added: svn:eol-style |
+ LF |