| OLD | NEW | 
| (Empty) |  | 
 |    1 <!DOCTYPE HTML> | 
 |    2 <title>Bookmark View</title> | 
 |    3 <style> | 
 |    4  | 
 |    5 .bookmark { | 
 |    6   margin-left: 5px; | 
 |    7   padding: 2px; | 
 |    8 } | 
 |    9  | 
 |   10 .bookmark_title { | 
 |   11   display: inline; | 
 |   12   border: 1px solid white; | 
 |   13   padding: 0px 3px; | 
 |   14 } | 
 |   15  | 
 |   16 .bookmark_title:hover { | 
 |   17   background-color: silver; | 
 |   18   border: 1px solid black; | 
 |   19 } | 
 |   20  | 
 |   21 .event-log { | 
 |   22   font-family: monospace; | 
 |   23 } | 
 |   24  | 
 |   25 </style> | 
 |   26 <script> | 
 |   27 // XXX Hack: When you call window.open('chrome-extension://...'), the window is | 
 |   28 // first navigated to about:blank, and then to the final URL. This confuses the | 
 |   29 // code that sets up our v8 extensions, and we don't end up with them running. | 
 |   30 // | 
 |   31 // If we noticed this happened, reload ourselves, which should fix it. | 
 |   32 if (!chromium.bookmarks) | 
 |   33   location.reload(); | 
 |   34  | 
 |   35 var logEvent = function(name, data) { | 
 |   36   var log = document.getElementById("event-log"); | 
 |   37   log.innerHTML = name + "<br>" + log.innerHTML; | 
 |   38   console.log("got event: " + name); | 
 |   39 } | 
 |   40  | 
 |   41 chromium.bookmarks.onBookmarkAdded.addListener(function(data) { | 
 |   42   logEvent("onBookmarkAdded", data); | 
 |   43 }); | 
 |   44  | 
 |   45 chromium.bookmarks.onBookmarkRemoved.addListener(function(data) { | 
 |   46   logEvent("onBookmarkRemoved", data); | 
 |   47 }); | 
 |   48  | 
 |   49 chromium.bookmarks.onBookmarkChanged.addListener(function(data) { | 
 |   50   logEvent("onBookmarkChanged", data); | 
 |   51 }); | 
 |   52  | 
 |   53 chromium.bookmarks.onBookmarkMoved.addListener(function(data) { | 
 |   54   logEvent("onBookmarkMoved", data); | 
 |   55 }); | 
 |   56  | 
 |   57 chromium.bookmarks.onBookmarkChildrenReordered.addListener(function(data) { | 
 |   58   logEvent("onBookmarkChildrenReordered", data); | 
 |   59 }); | 
 |   60  | 
 |   61 var prefix = "bookmark_"; | 
 |   62  | 
 |   63 var toggleBookmark = function(event) { | 
 |   64   event.stopPropagation(); | 
 |   65   var node = event.currentTarget; | 
 |   66   var id_str = node.id; | 
 |   67   if (id_str < prefix.length) | 
 |   68     return; | 
 |   69   var id = parseInt(id_str.substring(prefix.length)); | 
 |   70   if (id == NaN) | 
 |   71     return; | 
 |   72   console.log("toggle: " + id); | 
 |   73   //console.dir(event); | 
 |   74   chromium.bookmarks.get([id], function(bookmark) { | 
 |   75     //console.log("toggle get"); | 
 |   76     console.dir(bookmark[0]); | 
 |   77     if (bookmark[0].childrenIds && bookmark[0].childrenIds.length) { | 
 |   78       if (node.childNodes.length != 1) { | 
 |   79         //console.log("toggle collapse"); | 
 |   80         node.removeChild(node.childNodes[1]); | 
 |   81       } else { | 
 |   82         //console.log("before"); | 
 |   83         chromium.bookmarks.get(bookmark[0].childrenIds, function(children) { | 
 |   84           //console.log("toggle expand"); | 
 |   85           if (children && children.length) { | 
 |   86             console.dir(children); | 
 |   87             addBookmarks(children, node); | 
 |   88           } | 
 |   89         }); | 
 |   90       } | 
 |   91     } | 
 |   92   }); | 
 |   93 }; | 
 |   94  | 
 |   95 var addBookmark = function(bookmark, parent) { | 
 |   96   //console.log("addBookmark " + bookmark.id); | 
 |   97   var child = document.createElement('li'); | 
 |   98   child.className = 'bookmark'; | 
 |   99   child.id = prefix + bookmark.id; | 
 |  100   child.addEventListener('click', toggleBookmark, false); | 
 |  101   if (bookmark.url && bookmark.url.length) { | 
 |  102     var link = document.createElement('a'); | 
 |  103     link.href = bookmark.url; | 
 |  104     link.innerHTML = bookmark.title; | 
 |  105     link.className = 'bookmark_title'; | 
 |  106     child.appendChild(link); | 
 |  107   } else { | 
 |  108     var title = document.createElement('div'); | 
 |  109     title.innerHTML = bookmark.title; | 
 |  110     title.className = 'bookmark_title'; | 
 |  111     child.appendChild(title); | 
 |  112   } | 
 |  113   parent.appendChild(child); | 
 |  114 }; | 
 |  115  | 
 |  116 var addBookmarks = function(bookmarks, parent) { | 
 |  117   console.log("addBookmarks " + parent.id); | 
 |  118   var list = document.createElement("ul"); | 
 |  119   parent.appendChild(list); | 
 |  120   bookmarks.forEach(function(bookmark) { addBookmark(bookmark, list); }); | 
 |  121 }; | 
 |  122  | 
 |  123 var loadBookmarks = function() { | 
 |  124   var container = document.getElementById('container'); | 
 |  125   chromium.bookmarks.get([], function(results) { | 
 |  126     var root = results[0]; | 
 |  127     console.dir(root); | 
 |  128     var rootElement = document.createElement("div"); | 
 |  129     rootElement.id = prefix + root.id; | 
 |  130     // root element is empty / invisible, just an id to be looked up | 
 |  131     container.appendChild(rootElement); | 
 |  132     chromium.bookmarks.get(root.childrenIds, function(children) { | 
 |  133       addBookmarks(children, rootElement); | 
 |  134     }); | 
 |  135   }); | 
 |  136 }; | 
 |  137  | 
 |  138 </script> | 
 |  139 <body onload="loadBookmarks()"> | 
 |  140 <div id="container"> | 
 |  141 </div> | 
 |  142 <div id="event-log"></div> | 
 |  143 </body> | 
| OLD | NEW |