[MD Bookmarks] Implement adding folders and bookmarks from toolbar menu.

chrome/browser/resources/md_bookmarks/store.js

Index: chrome/browser/resources/md_bookmarks/store.js
diff --git a/chrome/browser/resources/md_bookmarks/store.js b/chrome/browser/resources/md_bookmarks/store.js
index eb4cb11c7a3cab9825505dd03faceb876fb8ba14..857f0f11d403f3ca86c89fa40c320df8a3953897 100644
--- a/chrome/browser/resources/md_bookmarks/store.js
+++ b/chrome/browser/resources/md_bookmarks/store.js
@@ -54,6 +54,7 @@ var BookmarksStore = Polymer({
   attached: function() {
     this.documentListeners_ = {
       'folder-open-changed': this.onFolderOpenChanged_.bind(this),
+      'node-added': this.onNodeAdded_.bind(this),
       'search-term-changed': this.onSearchTermChanged_.bind(this),
       'select-item': this.onItemSelected_.bind(this),
       'selected-folder-changed': this.onSelectedFolderChanged_.bind(this),
@@ -79,6 +80,7 @@ var BookmarksStore = Polymer({
     // Attach bookmarks API listeners.
     chrome.bookmarks.onRemoved.addListener(this.onBookmarkRemoved_.bind(this));
     chrome.bookmarks.onChanged.addListener(this.onBookmarkChanged_.bind(this));
+    chrome.bookmarks.onCreated.addListener(this.onBookmarkCreated_.bind(this));
   },
 
   //////////////////////////////////////////////////////////////////////////////
@@ -326,6 +328,24 @@ var BookmarksStore = Polymer({
       this.updateSearchDisplay_();
   },
 
+  /**
+   * Called when after a node is created.
+   * @param {string} id The id of the newly added bookmark node.
+   * @param {!BookmarkTreeNode} bookmarkNode
+   */
+  onBookmarkCreated_: function(id, bookmarkNode) {
+    var parent =
+        this.idToNodeMap_[/** @type {?string} */ (bookmarkNode.parentId)];
+    this.splice(
+        parent.path + '.children', /** @type {number} */ (bookmarkNode.index),
+        0, bookmarkNode);
+    BookmarksStore.generatePaths(parent, 0);

[jiaxi, 2017/02/09 04:09:45]

The index inside the tree doesn't get updated properly here.

Suppose a children array:
[{id:1, index:0}, {id:2, index:1}]

after splice:
[{id:1, index:0}, {id:3, index:1}, {id:2, index:1}]

This is because Polymer doesn't know the rest of the BookmarkTreeNode changed as
well. Use getSubTree to update the index would be nice. (We still need to use
splice to let Polymer know the tree has a new element tho)

+    BookmarksStore.initNodes(bookmarkNode, this.idToNodeMap_);
+
+    if (this.searchTerm)
+      this.updateSearchDisplay_();
+  },
+
   //////////////////////////////////////////////////////////////////////////////
   // bookmarks-store, bookmarks app event listeners:
 
@@ -390,6 +410,18 @@ var BookmarksStore = Polymer({
   },
 
   /**
+   * Appends a node to the children the selected folder.
+   * @param {CustomEvent} e
+   * @private
+   */
+  onNodeAdded_: function(e) {
+    var info = /** @type {!Object} */ (e.detail);
+    info.parentId = this.selectedId;
+    // TODO (angelayang): handle invalid urls.
+    chrome.bookmarks.create(info);
+  },
+
+  /**
    * Selects items according to keyboard behaviours.
    * @param {CustomEvent} e
    * @private
@@ -441,6 +473,9 @@ BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) {
 
   bookmarkNode.isSelectedFolder = false;
   bookmarkNode.isOpen = true;
+  if (!bookmarkNode.children)
+    bookmarkNode.children = [];
+
   for (var i = 0; i < bookmarkNode.children.length; i++)
     BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap);
 };