OLD | NEW |
---|---|
1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 var BookmarksStore = Polymer({ | 5 var BookmarksStore = Polymer({ |
6 is: 'bookmarks-store', | 6 is: 'bookmarks-store', |
7 | 7 |
8 properties: { | 8 properties: { |
9 /** @type {BookmarkTreeNode} */ | 9 /** @type {BookmarkTreeNode} */ |
10 rootNode: { | 10 rootNode: { |
(...skipping 19 matching lines...) Expand all Loading... | |
30 * selected folder. | 30 * selected folder. |
31 * @type {Array<BookmarkTreeNode>} | 31 * @type {Array<BookmarkTreeNode>} |
32 */ | 32 */ |
33 displayedList: { | 33 displayedList: { |
34 type: Array, | 34 type: Array, |
35 notify: true, | 35 notify: true, |
36 readOnly: true, | 36 readOnly: true, |
37 }, | 37 }, |
38 | 38 |
39 idToNodeMap_: Object, | 39 idToNodeMap_: Object, |
40 | |
41 anchorIndex_: Number, | |
42 | |
43 idToSearchResultMap_: Object, | |
tsergeant
2017/01/25 06:02:13
I recently discovered how to closure annotate some
jiaxi
2017/01/30 03:28:58
Done.
| |
40 }, | 44 }, |
41 | 45 |
42 /** @private {Object} */ | 46 /** @private {Object} */ |
43 documentListeners_: null, | 47 documentListeners_: null, |
44 | 48 |
45 /** @override */ | 49 /** @override */ |
46 attached: function() { | 50 attached: function() { |
47 this.documentListeners_ = { | 51 this.documentListeners_ = { |
48 'selected-folder-changed': this.onSelectedFolderChanged_.bind(this), | |
49 'folder-open-changed': this.onFolderOpenChanged_.bind(this), | 52 'folder-open-changed': this.onFolderOpenChanged_.bind(this), |
50 'search-term-changed': this.onSearchTermChanged_.bind(this), | 53 'search-term-changed': this.onSearchTermChanged_.bind(this), |
54 'select-item': this.onItemSelected_.bind(this), | |
55 'selected-folder-changed': this.onSelectedFolderChanged_.bind(this), | |
51 }; | 56 }; |
52 for (var event in this.documentListeners_) | 57 for (var event in this.documentListeners_) |
53 document.addEventListener(event, this.documentListeners_[event]); | 58 document.addEventListener(event, this.documentListeners_[event]); |
54 }, | 59 }, |
55 | 60 |
56 /** @override */ | 61 /** @override */ |
57 detached: function() { | 62 detached: function() { |
58 for (var event in this.documentListeners_) | 63 for (var event in this.documentListeners_) |
59 document.removeEventListener(event, this.documentListeners_[event]); | 64 document.removeEventListener(event, this.documentListeners_[event]); |
60 }, | 65 }, |
(...skipping 23 matching lines...) Expand all Loading... | |
84 this.idToNodeMap_ = {}; | 89 this.idToNodeMap_ = {}; |
85 this.rootNode.path = 'rootNode'; | 90 this.rootNode.path = 'rootNode'; |
86 BookmarksStore.generatePaths(rootNode, 0); | 91 BookmarksStore.generatePaths(rootNode, 0); |
87 BookmarksStore.initNodes(this.rootNode, this.idToNodeMap_); | 92 BookmarksStore.initNodes(this.rootNode, this.idToNodeMap_); |
88 this.fire('selected-folder-changed', this.rootNode.children[0].id); | 93 this.fire('selected-folder-changed', this.rootNode.children[0].id); |
89 }, | 94 }, |
90 | 95 |
91 /** @private */ | 96 /** @private */ |
92 deselectFolders_: function() { | 97 deselectFolders_: function() { |
93 this.unlinkPaths('displayedList'); | 98 this.unlinkPaths('displayedList'); |
94 this.set(this.idToNodeMap_[this.selectedId].path + '.isSelected', false); | 99 this.set( |
100 this.idToNodeMap_[this.selectedId].path + '.isSelectedFolder', false); | |
95 this.selectedId = null; | 101 this.selectedId = null; |
96 }, | 102 }, |
97 | 103 |
98 /** | 104 /** |
99 * @param {BookmarkTreeNode} folder | 105 * @param {BookmarkTreeNode} folder |
100 * @private | 106 * @private |
101 * @return {boolean} | 107 * @return {boolean} |
102 */ | 108 */ |
103 isAncestorOfSelected_: function(folder) { | 109 isAncestorOfSelected_: function(folder) { |
104 if (!this.selectedId) | 110 if (!this.selectedId) |
105 return false; | 111 return false; |
106 | 112 |
107 var selectedNode = this.idToNodeMap_[this.selectedId]; | 113 var selectedNode = this.idToNodeMap_[this.selectedId]; |
108 return selectedNode.path.startsWith(folder.path); | 114 return selectedNode.path.startsWith(folder.path); |
109 }, | 115 }, |
110 | 116 |
111 /** @private */ | 117 /** @private */ |
112 updateSearchDisplay_: function() { | 118 updateSearchDisplay_: function() { |
113 if (this.searchTerm == '') { | 119 if (this.searchTerm == '') { |
114 this.fire('selected-folder-changed', this.rootNode.children[0].id); | 120 this.fire('selected-folder-changed', this.rootNode.children[0].id); |
115 } else { | 121 } else { |
116 chrome.bookmarks.search(this.searchTerm, function(results) { | 122 chrome.bookmarks.search(this.searchTerm, function(results) { |
123 this.clearSelectedItems_(); | |
124 this.anchorIndex_ = undefined; | |
125 this.idToSearchResultMap_ = {}; | |
126 | |
117 if (this.selectedId) | 127 if (this.selectedId) |
118 this.deselectFolders_(); | 128 this.deselectFolders_(); |
119 | 129 |
120 this._setDisplayedList(results); | 130 this.setupSearchResults_(results); |
121 }.bind(this)); | 131 }.bind(this)); |
122 } | 132 } |
123 }, | 133 }, |
124 | 134 |
125 /** @private */ | 135 /** @private */ |
126 updateSelectedDisplay_: function() { | 136 updateSelectedDisplay_: function() { |
127 // Don't change to the selected display if ID was cleared. | 137 // Don't change to the selected display if ID was cleared. |
128 if (!this.selectedId) | 138 if (!this.selectedId) |
129 return; | 139 return; |
130 | 140 |
141 this.clearSelectedItems_(); | |
142 this.anchorIndex_ = undefined; | |
143 | |
131 var selectedNode = this.idToNodeMap_[this.selectedId]; | 144 var selectedNode = this.idToNodeMap_[this.selectedId]; |
132 this.linkPaths('displayedList', selectedNode.path + '.children'); | 145 this.linkPaths('displayedList', selectedNode.path + '.children'); |
133 this._setDisplayedList(selectedNode.children); | 146 this._setDisplayedList(selectedNode.children); |
134 }, | 147 }, |
135 | 148 |
136 /** | 149 /** |
137 * Remove all descendants of a given node from the map. | 150 * Remove all descendants of a given node from the map. |
138 * @param {string} id | 151 * @param {string} id |
139 * @private | 152 * @private |
140 */ | 153 */ |
141 removeDescendantsFromMap_: function(id) { | 154 removeDescendantsFromMap_: function(id) { |
142 var node = this.idToNodeMap_[id]; | 155 var node = this.idToNodeMap_[id]; |
143 if (!node) | 156 if (!node) |
144 return; | 157 return; |
145 | 158 |
146 if (node.children) { | 159 if (node.children) { |
147 for (var i = 0; i < node.children.length; i++) | 160 for (var i = 0; i < node.children.length; i++) |
148 this.removeDescendantsFromMap_(node.children[i].id); | 161 this.removeDescendantsFromMap_(node.children[i].id); |
149 } | 162 } |
150 delete this.idToNodeMap_[id]; | 163 delete this.idToNodeMap_[id]; |
151 }, | 164 }, |
152 | 165 |
166 /** | |
167 * Remove all selected items in the list. | |
168 * @private | |
169 */ | |
170 clearSelectedItems_: function() { | |
171 if (!this.displayedList) | |
172 return; | |
173 | |
174 for (var i = 0; i < this.displayedList.length; i++) { | |
175 if (!this.displayedList[i].isSelectedItem) | |
176 continue; | |
177 | |
178 this.set('displayedList.#' + i + '.isSelectedItem', false); | |
179 } | |
180 }, | |
181 | |
182 /** | |
183 * Return the index in the search result of an item. | |
184 * @param {BookmarkTreeNode} item | |
185 * @return {number} | |
186 * @private | |
187 */ | |
188 getIndexInList_: function(item) { | |
189 return this.searchTerm ? item.searchResultIndex : item.index; | |
190 }, | |
191 | |
192 /** | |
193 * @param {BookmarkTreeNode} item | |
194 * @return {boolean} | |
195 * @private | |
196 */ | |
197 isInDisplayedList_: function(id) { | |
198 return this.searchTerm ? this.idToSearchResultMap_[id] : | |
tsergeant
2017/01/25 06:02:13
This doesn't always return a boolean? Sometimes it
jiaxi
2017/01/30 03:28:58
Discussed offline, changing this map into a set.
| |
199 this.idToNodeMap_[id].parentId == this.selectedId; | |
200 }, | |
201 | |
202 /** | |
203 * Initializes the search results returned by the API as follows: | |
204 * - Populates |idToSearchResultMap_| with a mapping of all result ids to | |
205 * their corresponding result. | |
206 * - Sets up the |searchResultIndex|. | |
207 * @param {array<BookmarkTreeNode>} item | |
tsergeant
2017/01/25 06:02:13
The Array type has an uppercase 'A'
jiaxi
2017/01/30 03:28:59
Done.
| |
208 * @private | |
209 */ | |
210 setupSearchResults_: function(results) { | |
211 for (var i = 0; i < results.length; i++) { | |
212 results[i].searchResultIndex = i; | |
213 this.idToSearchResultMap_[results[i].id] = results[i]; | |
214 } | |
tsergeant
2017/01/25 06:02:13
Can you set `isSelectedItem = false` in here? It's
jiaxi
2017/01/30 03:28:58
Done.
| |
215 | |
216 this._setDisplayedList(results); | |
217 }, | |
218 | |
153 //////////////////////////////////////////////////////////////////////////////// | 219 //////////////////////////////////////////////////////////////////////////////// |
154 // bookmarks-store, bookmarks API event listeners: | 220 // bookmarks-store, bookmarks API event listeners: |
155 | 221 |
156 /** | 222 /** |
157 * Callback for when a bookmark node is removed. | 223 * Callback for when a bookmark node is removed. |
158 * If a folder is selected or is an ancestor of a selected folder, the parent | 224 * If a folder is selected or is an ancestor of a selected folder, the parent |
159 * of the removed folder will be selected. | 225 * of the removed folder will be selected. |
160 * @param {string} id The id of the removed bookmark node. | 226 * @param {string} id The id of the removed bookmark node. |
161 * @param {!{index: number, | 227 * @param {!{index: number, |
162 * parentId: string, | 228 * parentId: string, |
163 * node: BookmarkTreeNode}} removeInfo | 229 * node: BookmarkTreeNode}} removeInfo |
164 */ | 230 */ |
165 onBookmarkRemoved_: function(id, removeInfo) { | 231 onBookmarkRemoved_: function(id, removeInfo) { |
166 if (this.isAncestorOfSelected_(this.idToNodeMap_[id])) | 232 chrome.bookmarks.getSubTree(removeInfo.parentId, function(parentNodes) { |
167 this.fire('selected-folder-changed', removeInfo.parentId); | 233 var parentNode = parentNodes[0]; |
234 var isAncestor = this.isAncestorOfSelected_(this.idToNodeMap_[id]); | |
235 var isInDisplayedList = this.isInDisplayedList_(id); | |
168 | 236 |
169 var parentNode = this.idToNodeMap_[removeInfo.parentId]; | 237 // Update the tree. |
tsergeant
2017/01/25 06:02:13
Updates the tree...for what reason?
The fact that
jiaxi
2017/01/30 03:28:58
Done.
| |
170 this.splice(parentNode.path + '.children', removeInfo.index, 1); | 238 this.removeDescendantsFromMap_(id); |
171 this.removeDescendantsFromMap_(id); | 239 parentNode.path = this.idToNodeMap_[parentNode.id].path; |
172 BookmarksStore.generatePaths(parentNode, removeInfo.index); | 240 BookmarksStore.generatePaths(parentNode, 0); |
241 BookmarksStore.initNodes(parentNode, this.idToNodeMap_); | |
242 this.set(parentNode.path, parentNode) | |
173 | 243 |
174 // Regenerate the search list if its displayed. | 244 // Update selectedId if the removed node is an ancestor of the current |
175 if (this.searchTerm) | 245 // selected node. |
176 this.updateSearchDisplay_(); | 246 if (isAncestor) |
247 this.fire('selected-folder-changed', removeInfo.parentId); | |
248 | |
249 // Only update the displayedList if the removed node is in the | |
250 // displayedList. | |
251 if (!isInDisplayedList) | |
252 return; | |
253 | |
254 if (this.anchorIndex_ == this.displayedList.length - 1) | |
255 this.anchorIndex_--; | |
256 | |
257 if (this.searchTerm) { | |
258 chrome.bookmarks.search(this.searchTerm, function(results) { | |
tsergeant
2017/01/25 06:02:13
This spooks me a little because there are now two
jiaxi
2017/01/30 03:28:58
I can't think of a good way to using promise to re
| |
259 delete this.idToSearchResultMap_[id]; | |
260 this.setupSearchResults_(results); | |
261 this.set( | |
262 'displayedList.#' + this.anchorIndex_ + '.isSelectedItem', true); | |
263 }.bind(this)); | |
264 } else { | |
265 this._setDisplayedList(parentNode.children); | |
266 | |
267 this.set( | |
268 'displayedList.#' + this.anchorIndex_ + '.isSelectedItem', true); | |
269 } | |
270 }.bind(this)); | |
177 }, | 271 }, |
178 | 272 |
179 /** | 273 /** |
180 * Called when the title of a bookmark changes. | 274 * Called when the title of a bookmark changes. |
181 * @param {string} id The id of changed bookmark node. | 275 * @param {string} id The id of changed bookmark node. |
182 * @param {!Object} changeInfo | 276 * @param {!Object} changeInfo |
183 */ | 277 */ |
184 onBookmarkChanged_: function(id, changeInfo) { | 278 onBookmarkChanged_: function(id, changeInfo) { |
185 if (changeInfo.title) | 279 if (changeInfo.title) |
186 this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title); | 280 this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title); |
(...skipping 19 matching lines...) Expand all Loading... | |
206 * Selects the folder specified by the event and deselects the previously | 300 * Selects the folder specified by the event and deselects the previously |
207 * selected folder. | 301 * selected folder. |
208 * @param {CustomEvent} e | 302 * @param {CustomEvent} e |
209 * @private | 303 * @private |
210 */ | 304 */ |
211 onSelectedFolderChanged_: function(e) { | 305 onSelectedFolderChanged_: function(e) { |
212 if (this.searchTerm) | 306 if (this.searchTerm) |
213 this.searchTerm = ''; | 307 this.searchTerm = ''; |
214 | 308 |
215 // Deselect the old folder if defined. | 309 // Deselect the old folder if defined. |
216 if (this.selectedId) | 310 if (this.selectedId && this.idToNodeMap_[this.selectedId]) |
217 this.set(this.idToNodeMap_[this.selectedId].path + '.isSelected', false); | 311 this.set( |
312 this.idToNodeMap_[this.selectedId].path + '.isSelectedFolder', false); | |
218 | 313 |
219 var selectedId = /** @type {string} */ (e.detail); | 314 var selectedId = /** @type {string} */ (e.detail); |
220 var newFolder = this.idToNodeMap_[selectedId]; | 315 var newFolder = this.idToNodeMap_[selectedId]; |
221 this.set(newFolder.path + '.isSelected', true); | 316 this.set(newFolder.path + '.isSelectedFolder', true); |
222 this.selectedId = selectedId; | 317 this.selectedId = selectedId; |
223 }, | 318 }, |
224 | 319 |
225 /** | 320 /** |
226 * Handles events that open and close folders. | 321 * Handles events that open and close folders. |
227 * @param {CustomEvent} e | 322 * @param {CustomEvent} e |
228 * @private | 323 * @private |
229 */ | 324 */ |
230 onFolderOpenChanged_: function(e) { | 325 onFolderOpenChanged_: function(e) { |
231 var folder = this.idToNodeMap_[e.detail.id]; | 326 var folder = this.idToNodeMap_[e.detail.id]; |
232 this.set(folder.path + '.isOpen', e.detail.open); | 327 this.set(folder.path + '.isOpen', e.detail.open); |
233 if (!folder.isOpen && this.isAncestorOfSelected_(folder)) | 328 if (!folder.isOpen && this.isAncestorOfSelected_(folder)) |
234 this.fire('selected-folder-changed', folder.id); | 329 this.fire('selected-folder-changed', folder.id); |
235 }, | 330 }, |
331 | |
332 /** | |
333 * Select a single item in the list. | |
334 * @param {BookmarkTreeNode} item | |
335 * @private | |
336 */ | |
337 onSingleItemSelected_: function(item) { | |
338 this.clearSelectedItems_(); | |
339 this.anchorIndex_ = this.getIndexInList_(item); | |
340 this.set( | |
341 'displayedList.#' + this.anchorIndex_ + '.isSelectedItem', | |
342 true); | |
343 }, | |
344 | |
345 /** | |
346 * Select multiple items based on |anchorIndex_| and the selected | |
347 * item. If |anchorIndex_| is not set, single select the item. | |
348 * @param {BookmarkTreeNode} item | |
349 * @private | |
350 */ | |
351 onMultipleItemsShiftSelected_: function(item) { | |
352 this.clearSelectedItems_(); | |
353 var startIndex, endIndex; | |
354 if (this.anchorIndex_ == undefined) { | |
355 this.anchorIndex_ = this.getIndexInList_(item); | |
356 startIndex = this.anchorIndex_; | |
357 endIndex = this.anchorIndex_; | |
358 } else { | |
359 var selectedIndex = this.getIndexInList_(item); | |
360 startIndex = Math.min(this.anchorIndex_, selectedIndex); | |
361 endIndex = Math.max(this.anchorIndex_, selectedIndex); | |
362 } | |
363 for (var i = startIndex; i <= endIndex; i++) | |
364 this.set('displayedList.#' + i + '.isSelectedItem', true); | |
365 }, | |
366 | |
367 /** | |
368 * Select multiple items with the index of the last elected item as | |
369 * |anchorIndex_|. | |
370 * @param {BookmarkTreeNode} item | |
371 * @private | |
372 */ | |
373 onMultipleItemsCtrlSelected_: function(item) { | |
374 this.anchorIndex_ = this.getIndexInList_(item); | |
375 this.set( | |
376 'displayedList.#' + this.anchorIndex_ + '.isSelectedItem', | |
377 true); | |
378 }, | |
379 | |
380 /** | |
381 * Select item according to keyboard behaviours. | |
382 * @param {CustomEvent} e | |
383 * @private | |
384 */ | |
385 onItemSelected_: function(e) { | |
tsergeant
2017/01/25 06:02:13
Since store is supposed to be isolated from UI, I
jiaxi
2017/01/30 03:28:58
The old bmm doesn't support Ctrl and Shift operati
| |
386 if (e.detail.shiftKey) | |
387 this.onMultipleItemsShiftSelected_(e.detail.item); | |
388 else if (e.detail.ctrlKey) | |
389 this.onMultipleItemsCtrlSelected_(e.detail.item); | |
390 else | |
391 this.onSingleItemSelected_(e.detail.item); | |
392 }, | |
236 }); | 393 }); |
237 | 394 |
238 //////////////////////////////////////////////////////////////////////////////// | 395 //////////////////////////////////////////////////////////////////////////////// |
239 // bookmarks-store, static methods: | 396 // bookmarks-store, static methods: |
240 | 397 |
241 /** | 398 /** |
242 * Stores the path from the store to a node inside the node. | 399 * Stores the path from the store to a node inside the node. |
243 * @param {BookmarkTreeNode} bookmarkNode | 400 * @param {BookmarkTreeNode} bookmarkNode |
244 * @param {number} startIndex | 401 * @param {number} startIndex |
245 */ | 402 */ |
246 BookmarksStore.generatePaths = function(bookmarkNode, startIndex) { | 403 BookmarksStore.generatePaths = function(bookmarkNode, startIndex) { |
247 if (!bookmarkNode.children) | 404 if (!bookmarkNode.children) |
248 return; | 405 return; |
249 | 406 |
250 for (var i = startIndex; i < bookmarkNode.children.length; i++) { | 407 for (var i = startIndex; i < bookmarkNode.children.length; i++) { |
251 bookmarkNode.children[i].path = bookmarkNode.path + '.children.#' + i; | 408 bookmarkNode.children[i].path = bookmarkNode.path + '.children.#' + i; |
252 BookmarksStore.generatePaths(bookmarkNode.children[i], 0); | 409 BookmarksStore.generatePaths(bookmarkNode.children[i], 0); |
253 } | 410 } |
254 }; | 411 }; |
255 | 412 |
256 /** | 413 /** |
257 * Initializes the nodes in the bookmarks tree as follows: | 414 * Initializes the nodes in the bookmarks tree as follows: |
258 * - Populates |idToNodeMap_| with a mapping of all node ids to their | 415 * - Populates |idToNodeMap_| with a mapping of all node ids to their |
259 * corresponding BookmarkTreeNode. | 416 * corresponding BookmarkTreeNode. |
260 * - Sets all the nodes to not selected and open by default. | 417 * - Sets all the nodes to not selected and open by default. |
261 * @param {BookmarkTreeNode} bookmarkNode | 418 * @param {BookmarkTreeNode} bookmarkNode |
262 * @param {Object=} idToNodeMap | 419 * @param {Object=} idToNodeMap |
263 */ | 420 */ |
264 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) { | 421 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) { |
422 bookmarkNode.isSelectedItem = false; | |
265 if (idToNodeMap) | 423 if (idToNodeMap) |
266 idToNodeMap[bookmarkNode.id] = bookmarkNode; | 424 idToNodeMap[bookmarkNode.id] = bookmarkNode; |
267 | 425 |
268 if (bookmarkNode.url) | 426 if (bookmarkNode.url) |
269 return; | 427 return; |
270 | 428 |
271 bookmarkNode.isSelected = false; | 429 bookmarkNode.isSelectedFolder = false; |
272 bookmarkNode.isOpen = true; | 430 bookmarkNode.isOpen = true; |
273 for (var i = 0; i < bookmarkNode.children.length; i++) | 431 for (var i = 0; i < bookmarkNode.children.length; i++) |
274 BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap); | 432 BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap); |
275 }; | 433 }; |
OLD | NEW |