diff options
| author | erikkay@chromium.org <erikkay@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2010-01-22 22:02:26 +0000 |
|---|---|---|
| committer | erikkay@chromium.org <erikkay@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> | 2010-01-22 22:02:26 +0000 |
| commit | d3038f1e9f975349122113151fdb29c04571c793 (patch) | |
| tree | de30189952c8c7e32797dbd595973e13d5e599af /chrome/common/extensions | |
| parent | bd5a00a743c92290ec01d6ea603a5fd96098093e (diff) | |
| download | chromium_src-d3038f1e9f975349122113151fdb29c04571c793.zip chromium_src-d3038f1e9f975349122113151fdb29c04571c793.tar.gz chromium_src-d3038f1e9f975349122113151fdb29c04571c793.tar.bz2 | |
Sample chrome extension that uses the bookmarks API.
BUG=none
TEST=none
Review URL: http://codereview.chromium.org/515076
git-svn-id: svn://svn.chromium.org/chrome/trunk/src@36906 0039d316-1c4b-4281-b951-d872f2087c98
Diffstat (limited to 'chrome/common/extensions')
| -rw-r--r-- | chrome/common/extensions/docs/examples/api/bookmarks/basic/manifest.json | 13 | ||||
| -rw-r--r-- | chrome/common/extensions/docs/examples/api/bookmarks/basic/popup.html | 139 |
2 files changed, 152 insertions, 0 deletions
diff --git a/chrome/common/extensions/docs/examples/api/bookmarks/basic/manifest.json b/chrome/common/extensions/docs/examples/api/bookmarks/basic/manifest.json new file mode 100644 index 0000000..1dc28ab --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/bookmarks/basic/manifest.json @@ -0,0 +1,13 @@ +{ + "name": "My Bookmarks", + "version": "1.0", + "description": "A browser action with a popup dump of all bookmarks, including search, add, edit and delete.", + "permissions": [ + "bookmarks", "tabs" + ], + "browser_action": { + "default_title": "My Bookmarks.", + "default_icon": "icon.png", + "popup": "popup.html" + } +}
\ No newline at end of file diff --git a/chrome/common/extensions/docs/examples/api/bookmarks/basic/popup.html b/chrome/common/extensions/docs/examples/api/bookmarks/basic/popup.html new file mode 100644 index 0000000..00919c2 --- /dev/null +++ b/chrome/common/extensions/docs/examples/api/bookmarks/basic/popup.html @@ -0,0 +1,139 @@ +<html> +<head> +<link type="text/css" href="http://jqueryui.com/themes/base/ui.all.css" rel="stylesheet"> +<style> +div, td, th { color: black; } +</style> +<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> +<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> +<script> + // Search the bookmarks when entering the search keyword. + $(function() { + $('#search').change(function() { + $('#bookmarks').empty(); + dumpBookmarks($('#search').val()); + }); + }); + // Traverse the bookmark tree, and print the folder and nodes. + function dumpBookmarks(query) { + var bookmarkTreeNodes = chrome.bookmarks.getTree( + function(bookmarkTreeNodes) { + $('#bookmarks').append(dumpTreeNodes(bookmarkTreeNodes, query)); + }); + } + function dumpTreeNodes(bookmarkNodes, query) { + var list = $('<ul>'); + var i; + for (i = 0; i < bookmarkNodes.length; i++) { + list.append(dumpNode(bookmarkNodes[i], query)); + } + return list; + } + function dumpNode(bookmarkNode, query) { + if (bookmarkNode.title) { + if (query && !bookmarkNode.children) { + if (String(bookmarkNode.title).indexOf(query) == -1) { + return $('<span></span>'); + } + } + var anchor = $('<a>'); + anchor.attr('href', bookmarkNode.url); + anchor.text(bookmarkNode.title); + /* + * When clicking on a bookmark in the extension, a new tab is fired with + * the bookmark url. + */ + anchor.click(function() { + chrome.tabs.create({url: bookmarkNode.url}); + }); + var span = $('<span>'); + var options = bookmarkNode.children ? + $('<span>[<a href="#" id='addlink'>Add</a>]</span>') : + $('<span>[<a id="editlink" href="#">Edit</a> <a id="deletelink" ' + + 'href="#">Delete</a>]</span>'); + var edit = bookmarkNode.children ? $('<table><tr><td>Name</td><td>' + + '<input id="title"></td></tr><tr><td>URL</td><td><input id="url">' + + '</td></tr></table>') : $('<input>'); + // Show add and edit links when hover over. + span.hover(function() { + span.append(options); + $('#deletelink').click(function() { + $('#deletedialog').empty().dialog({ + autoOpen: false, + title: 'Confirm Deletion', + resizable: false, + height: 140, + modal: true, + overlay: { + backgroundColor: '#000', + opacity: 0.5 + }, + buttons: { + 'Yes, Delete It!': function() { + chrome.bookmarks.remove(String(bookmarkNode.id)); + span.parent().remove(); + $(this).dialog('destroy'); + }, + Cancel: function() { + $(this).dialog('destroy'); + } + } + }).dialog('open'); + }); + $('#addlink').click(function() { + $('#adddialog').empty().append(edit).dialog({autoOpen: false, + closeOnEscape: true, title: 'Add New Bookmark', modal: true, + buttons: { + 'Add' : function() { + chrome.bookmarks.create({parentId: bookmarkNode.id, + title: $('#title').val(), url: $('#url').val()}); + $('#bookmarks').empty(); + $(this).dialog('destroy'); + window.dumpBookmarks(); + }, + 'Cancel': function() { + $(this).dialog('destroy'); + } + }}).dialog('open'); + }); + $('#editlink').click(function() { + edit.val(anchor.text()); + $('#editdialog').empty().append(edit).dialog({autoOpen: false, + closeOnEscape: true, title: 'Edit Title', modal: true, + show: 'slide', buttons: { + 'Save': function() { + chrome.bookmarks.update(String(bookmarkNode.id), { + title: edit.val() + }); + anchor.text(edit.val()); + options.show(); + $(this).dialog('destroy'); + }, + 'Cancel': function() { + $(this).dialog('destroy'); + } + }}).dialog('open'); + }); + options.fadeIn(); + }, + // unhover + function() { + options.remove(); + }).append(anchor); + } + var li = $(bookmarkNode.title ? '<li>' : '<div>').append(span); + if (bookmarkNode.children && bookmarkNode.children.length > 0) { + li.append(dumpTreeNodes(bookmarkNode.children, query)); + } + return li; + } +</script> +</head> +<body onload="dumpBookmarks();" style="width: 400px"> +<div>Search Bookmarks: <input id="search"></div> +<div id="bookmarks"></div> +<div id="editdialog"></div> +<div id="deletedialog"></div> +<div id="adddialog"></div> +</body> +</html> |