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

chrome/browser/resources/md_bookmarks/store.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 var BookmarksStore = Polymer({
   is: 'bookmarks-store',
 
   properties: {
     /** @type {BookmarkTreeNode} */
     rootNode: {
@@ skipping 36 matching lines @@
     searchResultSet_: Object,
   },
 
   /** @private {Object} */
   documentListeners_: null,
 
   /** @override */
   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),
     };
     for (var event in this.documentListeners_)
       document.addEventListener(event, this.documentListeners_[event]);
   },
 
   /** @override */
   detached: function() {
     for (var event in this.documentListeners_)
       document.removeEventListener(event, this.documentListeners_[event]);
   },
 
   /**
    * Initializes the store with data from the bookmarks API.
    * Called by app on attached.
    */
   initializeStore: function() {
     chrome.bookmarks.getTree(function(results) {
       this.setupStore_(results[0]);
     }.bind(this));
     // 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));
   },
 
   //////////////////////////////////////////////////////////////////////////////
   // bookmarks-store, private:
 
   /**
    * @param {BookmarkTreeNode} rootNode
    * @private
    */
   setupStore_: function(rootNode) {
@@ skipping 227 matching lines @@
   onBookmarkChanged_: function(id, changeInfo) {
     if (changeInfo.title)
       this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title);
     if (changeInfo.url)
       this.set(this.idToNodeMap_[id].path + '.url', changeInfo.url);
 
     if (this.searchTerm)
       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:
 
   /**
    * @param {Event} e
    * @private
    */
   onSearchTermChanged_: function(e) {
     this.searchTerm = /** @type {string} */ (e.detail);
   },
@@ skipping 44 matching lines @@
    * @private
    */
   onFolderOpenChanged_: function(e) {
     var folder = this.idToNodeMap_[e.detail.id];
     this.set(folder.path + '.isOpen', e.detail.open);
     if (!folder.isOpen && this.isAncestorOfSelected_(folder))
       this.fire('selected-folder-changed', folder.id);
   },
 
   /**
+   * 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
    */
   onItemSelected_: function(e) {
     if (!e.detail.add)
       this.clearSelectedItems_();
 
     if (e.detail.range)
       this.selectRange_(e.detail.item);
@@ skipping 31 matching lines @@
 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) {
   bookmarkNode.isSelectedItem = false;
   if (idToNodeMap)
     idToNodeMap[bookmarkNode.id] = bookmarkNode;
 
   if (bookmarkNode.url)
     return;
 
   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);
 };