[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 35 matching lines @@
     /** @type {Set<string>} */
     searchResultSet_: Object,
   },
 
   /** @private {Object} */
   documentListeners_: null,
 
   /** @override */
   attached: function() {
     this.documentListeners_ = {
+      'add-node-saved': this.onAddNodeSaved_.bind(this),
       'folder-open-changed': this.onFolderOpenChanged_.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_[bookmarkNode.parentId || null];

[angelayang, 2017/02/08 07:34:03]

Closure complains that bookmarkNode.parentId can be undefined whilst the
idToNodeMap expects ?string. I'm unsure of what should be done for this.

[jiaxi, 2017/02/09 01:13:09]

I used /** @type {?string} */ in onSelectedFolderChanged. If you come across any
better options can you change the code there as well?

[angelayang, 2017/02/09 03:12:24]

I'll to do the same for consistency sake for now and then see.

+    this.push(parent.path + '.children', bookmarkNode);

[jiaxi, 2017/02/09 01:13:09]

According to my understanding, this adds the new BookmarkTreeNode at the end of
the parent node. If you create an item using the bar the new node will actually
gets 'inserted' into the children.
We might want to check if the BookmarkTreeNode in the callback has an index in
it or not. If it does and there's some function similar to 'insert' in Polymer
we can do that, otherwise we have to getSubTree instead. (Do we have enough time
for finishing this cl?)

[jiaxi, 2017/02/09 01:20:24]

Take a second thought, Polymer's splice could probably insert elements into the
specific index of the array. Make sure all the indexes are correct after you
insert the new element. (Check out how it's done in onBookmarkRemoved_)

This listener handles create event very well from the toolbar. But since we are
only going to use this listener for all onCreate events I think it would be
better to write a listener that works for all cases.

[angelayang, 2017/02/09 03:12:24]

I think what you suggested is good, thanks 

+    BookmarksStore.generatePaths(parent, parent.children.length - 1);
+    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 29 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
+   */
+  onAddNodeSaved_: 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);
 };