1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. 2 // Use of this source code is governed by a BSD-style license that can be 3 // found in the LICENSE file. 4 5 // Search the bookmarks when entering the search keyword. 6 $(function() { 7 $('#search').change(function() { 8 $('#bookmarks').empty(); 9 dumpBookmarks($('#search').val()); 10 }); 11 }); 12 // Traverse the bookmark tree, and print the folder and nodes. 13 function dumpBookmarks(query) { 14 var bookmarkTreeNodes = chrome.bookmarks.getTree( 15 function(bookmarkTreeNodes) { 16 $('#bookmarks').append(dumpTreeNodes(bookmarkTreeNodes, query)); 17 }); 18 } 19 function dumpTreeNodes(bookmarkNodes, query) { 20 var list = $('<ul>'); 21 var i; 22 for (i = 0; i < bookmarkNodes.length; i++) { 23 list.append(dumpNode(bookmarkNodes[i], query)); 24 } 25 return list; 26 } 27 function dumpNode(bookmarkNode, query) { 28 if (bookmarkNode.title) { 29 if (query && !bookmarkNode.children) { 30 if (String(bookmarkNode.title).indexOf(query) == -1) { 31 return $('<span></span>'); 32 } 33 } 34 var anchor = $('<a>'); 35 anchor.attr('href', bookmarkNode.url); 36 anchor.text(bookmarkNode.title); 37 /* 38 * When clicking on a bookmark in the extension, a new tab is fired with 39 * the bookmark url. 40 */ 41 anchor.click(function() { 42 chrome.tabs.create({url: bookmarkNode.url}); 43 }); 44 var span = $('<span>'); 45 var options = bookmarkNode.children ? 46 $('<span>[<a href="#" id="addlink">Add</a>]</span>') : 47 $('<span>[<a id="editlink" href="#">Edit</a> <a id="deletelink" ' + 48 'href="#">Delete</a>]</span>'); 49 var edit = bookmarkNode.children ? $('<table><tr><td>Name</td><td>' + 50 '<input id="title"></td></tr><tr><td>URL</td><td><input id="url">' + 51 '</td></tr></table>') : $('<input>'); 52 // Show add and edit links when hover over. 53 span.hover(function() { 54 span.append(options); 55 $('#deletelink').click(function() { 56 $('#deletedialog').empty().dialog({ 57 autoOpen: false, 58 title: 'Confirm Deletion', 59 resizable: false, 60 height: 140, 61 modal: true, 62 overlay: { 63 backgroundColor: '#000', 64 opacity: 0.5 65 }, 66 buttons: { 67 'Yes, Delete It!': function() { 68 chrome.bookmarks.remove(String(bookmarkNode.id)); 69 span.parent().remove(); 70 $(this).dialog('destroy'); 71 }, 72 Cancel: function() { 73 $(this).dialog('destroy'); 74 } 75 } 76 }).dialog('open'); 77 }); 78 $('#addlink').click(function() { 79 $('#adddialog').empty().append(edit).dialog({autoOpen: false, 80 closeOnEscape: true, title: 'Add New Bookmark', modal: true, 81 buttons: { 82 'Add' : function() { 83 chrome.bookmarks.create({parentId: bookmarkNode.id, 84 title: $('#title').val(), url: $('#url').val()}); 85 $('#bookmarks').empty(); 86 $(this).dialog('destroy'); 87 window.dumpBookmarks(); 88 }, 89 'Cancel': function() { 90 $(this).dialog('destroy'); 91 } 92 }}).dialog('open'); 93 }); 94 $('#editlink').click(function() { 95 edit.val(anchor.text()); 96 $('#editdialog').empty().append(edit).dialog({autoOpen: false, 97 closeOnEscape: true, title: 'Edit Title', modal: true, 98 show: 'slide', buttons: { 99 'Save': function() { 100 chrome.bookmarks.update(String(bookmarkNode.id), { 101 title: edit.val() 102 }); 103 anchor.text(edit.val()); 104 options.show(); 105 $(this).dialog('destroy'); 106 }, 107 'Cancel': function() { 108 $(this).dialog('destroy'); 109 } 110 }}).dialog('open'); 111 }); 112 options.fadeIn(); 113 }, 114 // unhover 115 function() { 116 options.remove(); 117 }).append(anchor); 118 } 119 var li = $(bookmarkNode.title ? '<li>' : '<div>').append(span); 120 if (bookmarkNode.children && bookmarkNode.children.length > 0) { 121 li.append(dumpTreeNodes(bookmarkNode.children, query)); 122 } 123 return li; 124 } 125 126 document.addEventListener('DOMContentLoaded', function () { 127 dumpBookmarks(); 128 }); 129