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 * This updates to either the result of a search or the contents of the | 30 * This updates to either the result of a search or the contents of the |
31 * selected folder. | 31 * selected folder. |
32 * @type {Array<BookmarkTreeNode>} | 32 * @type {Array<BookmarkTreeNode>} |
33 */ | 33 */ |
34 displayedList: { | 34 displayedList: { |
35 type: Array, | 35 type: Array, |
36 notify: true, | 36 notify: true, |
37 readOnly: true, | 37 readOnly: true, |
38 }, | 38 }, |
39 | 39 |
40 /** @type {Object<?string, !BookmarkTreeNode>} */ | |
40 idToNodeMap_: Object, | 41 idToNodeMap_: Object, |
42 | |
43 /** @type {?number} */ | |
44 anchorIndex_: Number, | |
45 | |
46 /** @type {Set<string>} */ | |
47 searchResultSet_: Object, | |
41 }, | 48 }, |
42 | 49 |
43 /** @private {Object} */ | 50 /** @private {Object} */ |
44 documentListeners_: null, | 51 documentListeners_: null, |
45 | 52 |
46 /** @override */ | 53 /** @override */ |
47 attached: function() { | 54 attached: function() { |
48 this.documentListeners_ = { | 55 this.documentListeners_ = { |
49 'selected-folder-changed': this.onSelectedFolderChanged_.bind(this), | |
50 'folder-open-changed': this.onFolderOpenChanged_.bind(this), | 56 'folder-open-changed': this.onFolderOpenChanged_.bind(this), |
51 'search-term-changed': this.onSearchTermChanged_.bind(this), | 57 'search-term-changed': this.onSearchTermChanged_.bind(this), |
58 'select-item': this.onItemSelected_.bind(this), | |
59 'selected-folder-changed': this.onSelectedFolderChanged_.bind(this), | |
52 }; | 60 }; |
53 for (var event in this.documentListeners_) | 61 for (var event in this.documentListeners_) |
54 document.addEventListener(event, this.documentListeners_[event]); | 62 document.addEventListener(event, this.documentListeners_[event]); |
55 }, | 63 }, |
56 | 64 |
57 /** @override */ | 65 /** @override */ |
58 detached: function() { | 66 detached: function() { |
59 for (var event in this.documentListeners_) | 67 for (var event in this.documentListeners_) |
60 document.removeEventListener(event, this.documentListeners_[event]); | 68 document.removeEventListener(event, this.documentListeners_[event]); |
61 }, | 69 }, |
(...skipping 28 matching lines...) Expand all Loading... | |
90 // Initialize the store's fields from the router. | 98 // Initialize the store's fields from the router. |
91 if (this.$.router.searchTerm) | 99 if (this.$.router.searchTerm) |
92 this.searchTerm = this.$.router.searchTerm; | 100 this.searchTerm = this.$.router.searchTerm; |
93 else | 101 else |
94 this.fire('selected-folder-changed', this.$.router.selectedId); | 102 this.fire('selected-folder-changed', this.$.router.selectedId); |
95 }, | 103 }, |
96 | 104 |
97 /** @private */ | 105 /** @private */ |
98 deselectFolders_: function() { | 106 deselectFolders_: function() { |
99 this.unlinkPaths('displayedList'); | 107 this.unlinkPaths('displayedList'); |
100 this.set(this.idToNodeMap_[this.selectedId].path + '.isSelected', false); | 108 this.set( |
109 this.idToNodeMap_[this.selectedId].path + '.isSelectedFolder', false); | |
101 this.selectedId = null; | 110 this.selectedId = null; |
102 }, | 111 }, |
103 | 112 |
104 /** | 113 /** |
105 * @param {BookmarkTreeNode} folder | 114 * @param {BookmarkTreeNode} folder |
106 * @private | 115 * @private |
107 * @return {boolean} | 116 * @return {boolean} |
108 */ | 117 */ |
109 isAncestorOfSelected_: function(folder) { | 118 isAncestorOfSelected_: function(folder) { |
110 if (!this.selectedId) | 119 if (!this.selectedId) |
111 return false; | 120 return false; |
112 | 121 |
113 var selectedNode = this.idToNodeMap_[this.selectedId]; | 122 var selectedNode = this.idToNodeMap_[this.selectedId]; |
114 return selectedNode.path.startsWith(folder.path); | 123 return selectedNode.path.startsWith(folder.path); |
115 }, | 124 }, |
116 | 125 |
117 /** @private */ | 126 /** @private */ |
118 updateSearchDisplay_: function() { | 127 updateSearchDisplay_: function() { |
119 if (!this.rootNode) | 128 if (!this.rootNode) |
120 return; | 129 return; |
121 | 130 |
122 if (!this.searchTerm) { | 131 if (!this.searchTerm) { |
123 this.fire('selected-folder-changed', this.rootNode.children[0].id); | 132 this.fire('selected-folder-changed', this.rootNode.children[0].id); |
124 } else { | 133 } else { |
125 chrome.bookmarks.search(this.searchTerm, function(results) { | 134 chrome.bookmarks.search(this.searchTerm, function(results) { |
135 this.anchorIndex_ = null; | |
136 this.clearSelectedItems_(); | |
137 this.searchResultSet_ = new Set(); | |
138 | |
126 if (this.selectedId) | 139 if (this.selectedId) |
127 this.deselectFolders_(); | 140 this.deselectFolders_(); |
128 | 141 |
129 this._setDisplayedList(results); | 142 this.setupSearchResults_(results); |
143 | |
144 this.set( | |
tsergeant
2017/02/02 00:16:03
Does this line ever do anything useful? Can it be
jiaxi
2017/02/02 04:11:55
Done.
| |
145 'displayedList.#' + this.anchorIndex_ + '.isSelectedItem', true); | |
130 }.bind(this)); | 146 }.bind(this)); |
131 } | 147 } |
132 }, | 148 }, |
133 | 149 |
134 /** @private */ | 150 /** @private */ |
135 updateSelectedDisplay_: function() { | 151 updateSelectedDisplay_: function() { |
136 // Don't change to the selected display if ID was cleared. | 152 // Don't change to the selected display if ID was cleared. |
137 if (!this.selectedId) | 153 if (!this.selectedId) |
138 return; | 154 return; |
139 | 155 |
156 this.clearSelectedItems_(); | |
157 this.anchorIndex_ = null; | |
158 | |
140 var selectedNode = this.idToNodeMap_[this.selectedId]; | 159 var selectedNode = this.idToNodeMap_[this.selectedId]; |
141 this.linkPaths('displayedList', selectedNode.path + '.children'); | 160 this.linkPaths('displayedList', selectedNode.path + '.children'); |
142 this._setDisplayedList(selectedNode.children); | 161 this._setDisplayedList( |
162 /** @type {Array<BookmarkTreeNode>} */ (selectedNode.children)); | |
143 }, | 163 }, |
144 | 164 |
145 /** | 165 /** |
146 * Remove all descendants of a given node from the map. | 166 * Remove all descendants of a given node from the map. |
147 * @param {string} id | 167 * @param {string} id |
148 * @private | 168 * @private |
149 */ | 169 */ |
150 removeDescendantsFromMap_: function(id) { | 170 removeDescendantsFromMap_: function(id) { |
151 var node = this.idToNodeMap_[id]; | 171 var node = this.idToNodeMap_[id]; |
152 if (!node) | 172 if (!node) |
153 return; | 173 return; |
154 | 174 |
155 if (node.children) { | 175 if (node.children) { |
156 for (var i = 0; i < node.children.length; i++) | 176 for (var i = 0; i < node.children.length; i++) |
157 this.removeDescendantsFromMap_(node.children[i].id); | 177 this.removeDescendantsFromMap_(node.children[i].id); |
158 } | 178 } |
159 delete this.idToNodeMap_[id]; | 179 delete this.idToNodeMap_[id]; |
160 }, | 180 }, |
161 | 181 |
182 /** | |
183 * Remove all selected items in the list. | |
184 * @private | |
185 */ | |
186 clearSelectedItems_: function() { | |
187 if (!this.displayedList) | |
188 return; | |
189 | |
190 for (var i = 0; i < this.displayedList.length; i++) { | |
191 if (!this.displayedList[i].isSelectedItem) | |
192 continue; | |
193 | |
194 this.set('displayedList.#' + i + '.isSelectedItem', false); | |
195 } | |
196 }, | |
197 | |
198 /** | |
199 * Return the index in the search result of an item. | |
200 * @param {BookmarkTreeNode} item | |
201 * @return {number} | |
202 * @private | |
203 */ | |
204 getIndexInList_: function(item) { | |
205 return this.searchTerm ? item.searchResultIndex : item.index; | |
206 }, | |
207 | |
208 /** | |
209 * @param {string} id | |
210 * @return {boolean} | |
211 * @private | |
212 */ | |
213 wasInDisplayedList_: function(id) { | |
214 return this.searchTerm ? this.searchResultSet_.has(id) : | |
215 this.idToNodeMap_[id].parentId == this.selectedId; | |
216 }, | |
217 | |
218 /** | |
219 * Initializes the search results returned by the API as follows: | |
220 * - Populates |searchResultSet_| with a mapping of all result ids to | |
221 * their corresponding result. | |
222 * - Sets up the |searchResultIndex|. | |
223 * @param {Array<BookmarkTreeNode>} results | |
224 * @private | |
225 */ | |
226 setupSearchResults_: function(results) { | |
227 for (var i = 0; i < results.length; i++) { | |
228 results[i].searchResultIndex = i; | |
229 results[i].isSelectedItem = false; | |
230 this.searchResultSet_.add(results[i].id); | |
231 } | |
232 | |
233 this._setDisplayedList(results); | |
234 }, | |
235 | |
236 /** | |
237 * Select multiple items based on |anchorIndex_| and the selected | |
238 * item. If |anchorIndex_| is not set, single select the item. | |
239 * @param {BookmarkTreeNode} item | |
240 * @private | |
241 */ | |
242 selectRange_: function(item) { | |
243 var startIndex, endIndex; | |
244 if (this.anchorIndex_ == null) { | |
245 this.anchorIndex_ = this.getIndexInList_(item); | |
246 startIndex = this.anchorIndex_; | |
247 endIndex = this.anchorIndex_; | |
248 } else { | |
249 var selectedIndex = this.getIndexInList_(item); | |
250 startIndex = Math.min(this.anchorIndex_, selectedIndex); | |
251 endIndex = Math.max(this.anchorIndex_, selectedIndex); | |
252 } | |
253 for (var i = startIndex; i <= endIndex; i++) | |
254 this.set('displayedList.#' + i + '.isSelectedItem', true); | |
255 }, | |
256 | |
257 /** | |
258 * Selects a single item in the displayedList. | |
259 * @param {BookmarkTreeNode} item | |
260 * @private | |
261 */ | |
262 selectItem_: function(item) { | |
263 this.anchorIndex_ = this.getIndexInList_(item); | |
264 this.set('displayedList.#' + this.anchorIndex_ + '.isSelectedItem', true); | |
265 }, | |
266 | |
162 ////////////////////////////////////////////////////////////////////////////// | 267 ////////////////////////////////////////////////////////////////////////////// |
163 // bookmarks-store, bookmarks API event listeners: | 268 // bookmarks-store, bookmarks API event listeners: |
164 | 269 |
165 /** | 270 /** |
166 * Callback for when a bookmark node is removed. | 271 * Callback for when a bookmark node is removed. |
167 * If a folder is selected or is an ancestor of a selected folder, the parent | 272 * If a folder is selected or is an ancestor of a selected folder, the parent |
168 * of the removed folder will be selected. | 273 * of the removed folder will be selected. |
169 * @param {string} id The id of the removed bookmark node. | 274 * @param {string} id The id of the removed bookmark node. |
170 * @param {!{index: number, | 275 * @param {!{index: number, |
171 * parentId: string, | 276 * parentId: string, |
172 * node: BookmarkTreeNode}} removeInfo | 277 * node: BookmarkTreeNode}} removeInfo |
173 */ | 278 */ |
174 onBookmarkRemoved_: function(id, removeInfo) { | 279 onBookmarkRemoved_: function(id, removeInfo) { |
175 if (this.isAncestorOfSelected_(this.idToNodeMap_[id])) { | 280 chrome.bookmarks.getSubTree(removeInfo.parentId, function(parentNodes) { |
176 this.fire('selected-folder-changed', removeInfo.parentId); | 281 var parentNode = parentNodes[0]; |
177 } | 282 var isAncestor = this.isAncestorOfSelected_(this.idToNodeMap_[id]); |
283 var wasInDisplayedList = this.wasInDisplayedList_(id); | |
178 | 284 |
179 var parentNode = this.idToNodeMap_[removeInfo.parentId]; | 285 // Refresh the parent node's data from the backend as its children's |
180 this.splice(parentNode.path + '.children', removeInfo.index, 1); | 286 // indexes will have changed and Polymer doesn't update them. |
181 this.removeDescendantsFromMap_(id); | 287 this.removeDescendantsFromMap_(id); |
182 BookmarksStore.generatePaths(parentNode, removeInfo.index); | 288 parentNode.path = this.idToNodeMap_[parentNode.id].path; |
289 BookmarksStore.generatePaths(parentNode, 0); | |
290 BookmarksStore.initNodes(parentNode, this.idToNodeMap_); | |
291 this.set(parentNode.path, parentNode); | |
183 | 292 |
184 // Regenerate the search list if its displayed. | 293 // Updates selectedId if the removed node is an ancestor of the current |
185 if (this.searchTerm) | 294 // selected node. |
186 this.updateSearchDisplay_(); | 295 if (isAncestor) |
296 this.fire('selected-folder-changed', removeInfo.parentId); | |
297 | |
298 // Only update the displayedList if the removed node is in the | |
299 // displayedList. | |
300 if (!wasInDisplayedList) | |
301 return; | |
302 | |
303 this.anchorIndex_ = null; | |
304 | |
305 // Update the currently displayed list. | |
306 if (this.searchTerm) { | |
307 this.updateSearchDisplay_(); | |
308 } else { | |
309 if (!isAncestor) | |
310 this.fire('selected-folder-changed', this.selectedId); | |
311 | |
312 this._setDisplayedList(parentNode.children); | |
313 } | |
314 }.bind(this)); | |
187 }, | 315 }, |
188 | 316 |
189 /** | 317 /** |
190 * Called when the title of a bookmark changes. | 318 * Called when the title of a bookmark changes. |
191 * @param {string} id The id of changed bookmark node. | 319 * @param {string} id The id of changed bookmark node. |
192 * @param {!Object} changeInfo | 320 * @param {!Object} changeInfo |
193 */ | 321 */ |
194 onBookmarkChanged_: function(id, changeInfo) { | 322 onBookmarkChanged_: function(id, changeInfo) { |
195 if (changeInfo.title) | 323 if (changeInfo.title) |
196 this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title); | 324 this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title); |
(...skipping 19 matching lines...) Expand all Loading... | |
216 * Selects the folder specified by the event and deselects the previously | 344 * Selects the folder specified by the event and deselects the previously |
217 * selected folder. | 345 * selected folder. |
218 * @param {CustomEvent} e | 346 * @param {CustomEvent} e |
219 * @private | 347 * @private |
220 */ | 348 */ |
221 onSelectedFolderChanged_: function(e) { | 349 onSelectedFolderChanged_: function(e) { |
222 if (this.searchTerm) | 350 if (this.searchTerm) |
223 this.searchTerm = ''; | 351 this.searchTerm = ''; |
224 | 352 |
225 // Deselect the old folder if defined. | 353 // Deselect the old folder if defined. |
226 if (this.selectedId) | 354 if (this.selectedId && this.idToNodeMap_[this.selectedId]) |
227 this.set(this.idToNodeMap_[this.selectedId].path + '.isSelected', false); | 355 this.set( |
356 this.idToNodeMap_[this.selectedId].path + '.isSelectedFolder', false); | |
228 | 357 |
229 // Check if the selected id is that of a defined folder. | 358 // Check if the selected id is that of a defined folder. |
230 var id = /** @type {string} */ (e.detail); | 359 var id = /** @type {string} */ (e.detail); |
231 if (!this.idToNodeMap_[id] || this.idToNodeMap_[id].url) | 360 if (!this.idToNodeMap_[id] || this.idToNodeMap_[id].url) |
232 id = this.rootNode.children[0].id; | 361 id = this.rootNode.children[0].id; |
233 | 362 |
234 var newFolder = this.idToNodeMap_[id]; | 363 var newFolder = this.idToNodeMap_[id]; |
235 this.set(newFolder.path + '.isSelected', true); | 364 this.set(newFolder.path + '.isSelectedFolder', true); |
236 this.selectedId = id; | 365 this.selectedId = id; |
237 }, | 366 }, |
238 | 367 |
239 /** | 368 /** |
240 * Handles events that open and close folders. | 369 * Handles events that open and close folders. |
241 * @param {CustomEvent} e | 370 * @param {CustomEvent} e |
242 * @private | 371 * @private |
243 */ | 372 */ |
244 onFolderOpenChanged_: function(e) { | 373 onFolderOpenChanged_: function(e) { |
245 var folder = this.idToNodeMap_[e.detail.id]; | 374 var folder = this.idToNodeMap_[e.detail.id]; |
246 this.set(folder.path + '.isOpen', e.detail.open); | 375 this.set(folder.path + '.isOpen', e.detail.open); |
247 if (!folder.isOpen && this.isAncestorOfSelected_(folder)) | 376 if (!folder.isOpen && this.isAncestorOfSelected_(folder)) |
248 this.fire('selected-folder-changed', folder.id); | 377 this.fire('selected-folder-changed', folder.id); |
249 }, | 378 }, |
379 | |
380 /** | |
381 * Selects items according to keyboard behaviours. | |
382 * @param {CustomEvent} e | |
383 * @private | |
384 */ | |
385 onItemSelected_: function(e) { | |
386 if (!e.detail.add) | |
387 this.clearSelectedItems_(); | |
388 | |
389 if (e.detail.range) | |
390 this.selectRange_(e.detail.item); | |
391 else | |
392 this.selectItem_(e.detail.item); | |
393 }, | |
250 }); | 394 }); |
251 | 395 |
252 //////////////////////////////////////////////////////////////////////////////// | 396 //////////////////////////////////////////////////////////////////////////////// |
253 // bookmarks-store, static methods: | 397 // bookmarks-store, static methods: |
254 | 398 |
255 /** | 399 /** |
256 * Stores the path from the store to a node inside the node. | 400 * Stores the path from the store to a node inside the node. |
257 * @param {BookmarkTreeNode} bookmarkNode | 401 * @param {BookmarkTreeNode} bookmarkNode |
258 * @param {number} startIndex | 402 * @param {number} startIndex |
259 */ | 403 */ |
260 BookmarksStore.generatePaths = function(bookmarkNode, startIndex) { | 404 BookmarksStore.generatePaths = function(bookmarkNode, startIndex) { |
261 if (!bookmarkNode.children) | 405 if (!bookmarkNode.children) |
262 return; | 406 return; |
263 | 407 |
264 for (var i = startIndex; i < bookmarkNode.children.length; i++) { | 408 for (var i = startIndex; i < bookmarkNode.children.length; i++) { |
265 bookmarkNode.children[i].path = bookmarkNode.path + '.children.#' + i; | 409 bookmarkNode.children[i].path = bookmarkNode.path + '.children.#' + i; |
266 BookmarksStore.generatePaths(bookmarkNode.children[i], 0); | 410 BookmarksStore.generatePaths(bookmarkNode.children[i], 0); |
267 } | 411 } |
268 }; | 412 }; |
269 | 413 |
270 /** | 414 /** |
271 * Initializes the nodes in the bookmarks tree as follows: | 415 * Initializes the nodes in the bookmarks tree as follows: |
272 * - Populates |idToNodeMap_| with a mapping of all node ids to their | 416 * - Populates |idToNodeMap_| with a mapping of all node ids to their |
273 * corresponding BookmarkTreeNode. | 417 * corresponding BookmarkTreeNode. |
274 * - Sets all the nodes to not selected and open by default. | 418 * - Sets all the nodes to not selected and open by default. |
275 * @param {BookmarkTreeNode} bookmarkNode | 419 * @param {BookmarkTreeNode} bookmarkNode |
276 * @param {Object=} idToNodeMap | 420 * @param {Object=} idToNodeMap |
277 */ | 421 */ |
278 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) { | 422 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) { |
423 bookmarkNode.isSelectedItem = false; | |
279 if (idToNodeMap) | 424 if (idToNodeMap) |
280 idToNodeMap[bookmarkNode.id] = bookmarkNode; | 425 idToNodeMap[bookmarkNode.id] = bookmarkNode; |
281 | 426 |
282 if (bookmarkNode.url) | 427 if (bookmarkNode.url) |
283 return; | 428 return; |
284 | 429 |
285 bookmarkNode.isSelected = false; | 430 bookmarkNode.isSelectedFolder = false; |
286 bookmarkNode.isOpen = true; | 431 bookmarkNode.isOpen = true; |
287 for (var i = 0; i < bookmarkNode.children.length; i++) | 432 for (var i = 0; i < bookmarkNode.children.length; i++) |
288 BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap); | 433 BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap); |
289 }; | 434 }; |
OLD | NEW |