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 prevSelectedItemIndex_: Number, | |
40 }, | 42 }, |
41 | 43 |
42 /** @private {Object} */ | 44 /** @private {Object} */ |
43 documentListeners_: null, | 45 documentListeners_: null, |
44 | 46 |
45 /** @override */ | 47 /** @override */ |
46 attached: function() { | 48 attached: function() { |
47 this.documentListeners_ = { | 49 this.documentListeners_ = { |
50 'ctrl-select-multiple-items': | |
51 this.onMultipleItemsCtrlSelected_.bind(this), | |
52 'select-single-item': this.onSingleItemSelected_.bind(this), | |
48 'selected-folder-changed': this.onSelectedFolderChanged_.bind(this), | 53 'selected-folder-changed': this.onSelectedFolderChanged_.bind(this), |
54 'shift-select-multiple-items': | |
55 this.onMultipleItemsShiftSelected_.bind(this), | |
49 'folder-open-changed': this.onFolderOpenChanged_.bind(this), | 56 'folder-open-changed': this.onFolderOpenChanged_.bind(this), |
angelayang
2017/01/17 00:46:51
Nice, since you've got yours in alphabetical order
jiaxi
2017/01/17 01:53:33
Done.
| |
50 'search-term-changed': this.onSearchTermChanged_.bind(this), | 57 'search-term-changed': this.onSearchTermChanged_.bind(this), |
51 }; | 58 }; |
52 for (var event in this.documentListeners_) | 59 for (var event in this.documentListeners_) |
53 document.addEventListener(event, this.documentListeners_[event]); | 60 document.addEventListener(event, this.documentListeners_[event]); |
54 }, | 61 }, |
55 | 62 |
56 /** @override */ | 63 /** @override */ |
57 detached: function() { | 64 detached: function() { |
58 for (var event in this.documentListeners_) | 65 for (var event in this.documentListeners_) |
59 document.removeEventListener(event, this.documentListeners_[event]); | 66 document.removeEventListener(event, this.documentListeners_[event]); |
60 }, | 67 }, |
61 | 68 |
62 /** | 69 /** |
63 * Initializes the store with data from the bookmarks API. | 70 * Initializes the store with data from the bookmarks API. |
64 * Called by app on attached. | 71 * Called by app on attached. |
65 */ | 72 */ |
66 initializeStore: function() { | 73 initializeStore: function() { |
67 chrome.bookmarks.getTree(function(results) { | 74 chrome.bookmarks.getTree(function(results) { |
68 this.setupStore_(results[0]); | 75 this.setupStore_(results[0]); |
69 }.bind(this)); | 76 }.bind(this)); |
70 // Attach bookmarks API listeners. | 77 // Attach bookmarks API listeners. |
71 chrome.bookmarks.onRemoved.addListener(this.onBookmarkRemoved_.bind(this)); | 78 chrome.bookmarks.onRemoved.addListener(this.onBookmarkRemoved_.bind(this)); |
72 chrome.bookmarks.onChanged.addListener(this.onBookmarkChanged_.bind(this)); | 79 chrome.bookmarks.onChanged.addListener(this.onBookmarkChanged_.bind(this)); |
73 }, | 80 }, |
74 | 81 |
75 //////////////////////////////////////////////////////////////////////////////// | 82 ////////////////////////////////////////////////////////////////////////////// |
76 // bookmarks-store, private: | 83 // bookmarks-store, private: |
77 | 84 |
78 /** | 85 /** |
79 * @param {BookmarkTreeNode} rootNode | 86 * @param {BookmarkTreeNode} rootNode |
80 * @private | 87 * @private |
81 */ | 88 */ |
82 setupStore_: function(rootNode) { | 89 setupStore_: function(rootNode) { |
83 this.rootNode = rootNode; | 90 this.rootNode = rootNode; |
84 this.idToNodeMap_ = {}; | 91 this.idToNodeMap_ = {}; |
85 this.rootNode.path = 'rootNode'; | 92 this.rootNode.path = 'rootNode'; |
86 BookmarksStore.generatePaths(rootNode, 0); | 93 BookmarksStore.generatePaths(rootNode, 0); |
87 BookmarksStore.initNodes(this.rootNode, this.idToNodeMap_); | 94 BookmarksStore.initNodes(this.rootNode, this.idToNodeMap_); |
88 this.fire('selected-folder-changed', this.rootNode.children[0].id); | 95 this.fire('selected-folder-changed', this.rootNode.children[0].id); |
89 }, | 96 }, |
90 | 97 |
91 /** @private */ | 98 /** @private */ |
92 deselectFolders_: function() { | 99 deselectFolders_: function() { |
93 this.unlinkPaths('displayedList'); | 100 this.unlinkPaths('displayedList'); |
94 this.set(this.idToNodeMap_[this.selectedId].path + '.isSelected', false); | 101 this.set( |
102 this.idToNodeMap_[this.selectedId].path + '.isSelectedFolder', false); | |
95 this.selectedId = null; | 103 this.selectedId = null; |
96 }, | 104 }, |
97 | 105 |
98 /** | 106 /** |
99 * @param {BookmarkTreeNode} folder | 107 * @param {BookmarkTreeNode} folder |
100 * @private | 108 * @private |
101 * @return {boolean} | 109 * @return {boolean} |
102 */ | 110 */ |
103 isAncestorOfSelected_: function(folder) { | 111 isAncestorOfSelected_: function(folder) { |
104 if (!this.selectedId) | 112 if (!this.selectedId) |
105 return false; | 113 return false; |
106 | 114 |
107 var selectedNode = this.idToNodeMap_[this.selectedId]; | 115 var selectedNode = this.idToNodeMap_[this.selectedId]; |
108 return selectedNode.path.startsWith(folder.path); | 116 return selectedNode.path.startsWith(folder.path); |
109 }, | 117 }, |
110 | 118 |
111 /** @private */ | 119 /** @private */ |
112 updateSearchDisplay_: function() { | 120 updateSearchDisplay_: function() { |
113 if (this.searchTerm == '') { | 121 if (this.searchTerm == '') { |
114 this.fire('selected-folder-changed', this.rootNode.children[0].id); | 122 this.fire('selected-folder-changed', this.rootNode.children[0].id); |
115 } else { | 123 } else { |
116 chrome.bookmarks.search(this.searchTerm, function(results) { | 124 chrome.bookmarks.search(this.searchTerm, function(results) { |
125 if (this.displayedList) | |
126 this.clearSelectedItems_(); | |
127 | |
128 this.prevSelectedItemIndex_ = undefined; | |
129 | |
117 if (this.selectedId) | 130 if (this.selectedId) |
118 this.deselectFolders_(); | 131 this.deselectFolders_(); |
119 | 132 |
120 this._setDisplayedList(results); | 133 var searchedList = []; |
134 if (results) { | |
angelayang
2017/01/17 00:46:51
Can we remove this outer if? or does no results gi
jiaxi
2017/01/17 01:53:33
It returns an empty array []
| |
135 for (var i = 0; i < results.length; i++) { | |
136 searchedList.push(this.idToNodeMap_[results[i].id]); | |
137 this.linkPaths( | |
138 'displayedList.#' + i, this.idToNodeMap_[results[i].id].path); | |
139 } | |
140 } | |
141 this._setDisplayedList(searchedList); | |
121 }.bind(this)); | 142 }.bind(this)); |
122 } | 143 } |
123 }, | 144 }, |
124 | 145 |
125 /** @private */ | 146 /** @private */ |
126 updateSelectedDisplay_: function() { | 147 updateSelectedDisplay_: function() { |
127 // Don't change to the selected display if ID was cleared. | 148 // Don't change to the selected display if ID was cleared. |
128 if (!this.selectedId) | 149 if (!this.selectedId) |
129 return; | 150 return; |
130 | 151 |
152 if (this.displayedList) | |
153 this.clearSelectedItems_(); | |
154 | |
155 this.prevSelectedItemIndex_ = undefined; | |
156 | |
131 var selectedNode = this.idToNodeMap_[this.selectedId]; | 157 var selectedNode = this.idToNodeMap_[this.selectedId]; |
132 this.linkPaths('displayedList', selectedNode.path + '.children'); | 158 this.linkPaths('displayedList', selectedNode.path + '.children'); |
133 this._setDisplayedList(selectedNode.children); | 159 this._setDisplayedList(selectedNode.children); |
134 }, | 160 }, |
135 | 161 |
136 /** | 162 /** |
137 * Remove all descendants of a given node from the map. | 163 * Remove all descendants of a given node from the map. |
138 * @param {string} id | 164 * @param {string} id |
139 * @private | 165 * @private |
140 */ | 166 */ |
141 removeDescendantsFromMap_: function(id) { | 167 removeDescendantsFromMap_: function(id) { |
142 var node = this.idToNodeMap_[id]; | 168 var node = this.idToNodeMap_[id]; |
143 if (!node) | 169 if (!node) |
144 return; | 170 return; |
145 | 171 |
146 if (node.children) { | 172 if (node.children) { |
147 for (var i = 0; i < node.children.length; i++) | 173 for (var i = 0; i < node.children.length; i++) |
148 this.removeDescendantsFromMap_(node.children[i].id); | 174 this.removeDescendantsFromMap_(node.children[i].id); |
149 } | 175 } |
150 delete this.idToNodeMap_[id]; | 176 delete this.idToNodeMap_[id]; |
151 }, | 177 }, |
152 | 178 |
153 //////////////////////////////////////////////////////////////////////////////// | 179 /** |
154 // bookmarks-store, bookmarks API event listeners: | 180 * Remove all selected items in the list. |
181 * @private | |
182 */ | |
183 clearSelectedItems_: function() { | |
184 for (var i = 0; i < this.displayedList.length; i++) { | |
185 if (this.displayedList[i].isSelected == true) { | |
angelayang
2017/01/17 00:46:51
can we make this, if (this.displayedList[i].isSele
jiaxi
2017/01/17 01:53:33
Done.
| |
186 this.set( | |
187 this.idToNodeMap_[this.displayedList[i].id].path + | |
188 '.isSelected', | |
189 false); | |
190 } | |
191 } | |
192 }, | |
193 | |
194 /** | |
195 * Return the index in the search result of an item. | |
196 * @param {BookmarkTreeNode} item | |
197 * @return {number} | |
198 * @private | |
199 */ | |
200 getSelectedIndex_: function(item) { | |
201 if (this.searchTerm == '') | |
202 return item.index; | |
203 | |
204 for (var i = 0; i < this.displayedList.length; i++) { | |
205 if (this.displayedList[i].id == item.id) | |
206 return i; | |
207 } | |
208 }, | |
209 ////////////////////////////////////////////////////////////////////////////// | |
210 //////// bookmarks-store, bookmarks API event listeners: | |
155 | 211 |
156 /** | 212 /** |
157 * Callback for when a bookmark node is removed. | 213 * Callback for when a bookmark node is removed. |
158 * If a folder is selected or is an ancestor of a selected folder, the parent | 214 * If a folder is selected or is an ancestor of a selected folder, the parent |
159 * of the removed folder will be selected. | 215 * of the removed folder will be selected. |
160 * @param {string} id The id of the removed bookmark node. | 216 * @param {string} id The id of the removed bookmark node. |
161 * @param {!{index: number, | 217 * @param {!{index: number, |
162 * parentId: string, | 218 * parentId: string, |
163 * node: BookmarkTreeNode}} removeInfo | 219 * node: BookmarkTreeNode}} removeInfo |
164 */ | 220 */ |
(...skipping 20 matching lines...) Expand all Loading... | |
185 onBookmarkChanged_: function(id, changeInfo) { | 241 onBookmarkChanged_: function(id, changeInfo) { |
186 if (changeInfo.title) | 242 if (changeInfo.title) |
187 this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title); | 243 this.set(this.idToNodeMap_[id].path + '.title', changeInfo.title); |
188 if (changeInfo.url) | 244 if (changeInfo.url) |
189 this.set(this.idToNodeMap_[id].path + '.url', changeInfo.url); | 245 this.set(this.idToNodeMap_[id].path + '.url', changeInfo.url); |
190 | 246 |
191 if (this.searchTerm) | 247 if (this.searchTerm) |
192 this.updateSearchDisplay_(); | 248 this.updateSearchDisplay_(); |
193 }, | 249 }, |
194 | 250 |
195 //////////////////////////////////////////////////////////////////////////////// | 251 ////////////////////////////////////////////////////////////////////////////// |
196 // bookmarks-store, bookmarks app event listeners: | 252 // bookmarks-store, bookmarks app event listeners: |
197 | 253 |
198 /** | 254 /** |
199 * @param {Event} e | 255 * @param {Event} e |
200 * @private | 256 * @private |
201 */ | 257 */ |
202 onSearchTermChanged_: function(e) { | 258 onSearchTermChanged_: function(e) { |
203 this.searchTerm = /** @type {string} */ (e.detail); | 259 this.searchTerm = /** @type {string} */ (e.detail); |
204 }, | 260 }, |
205 | 261 |
206 /** | 262 /** |
207 * Selects the folder specified by the event and deselects the previously | 263 * Selects the folder specified by the event and deselects the previously |
208 * selected folder. | 264 * selected folder. |
209 * @param {CustomEvent} e | 265 * @param {CustomEvent} e |
210 * @private | 266 * @private |
211 */ | 267 */ |
212 onSelectedFolderChanged_: function(e) { | 268 onSelectedFolderChanged_: function(e) { |
213 if (this.searchTerm) | 269 if (this.searchTerm) |
214 this.searchTerm = ''; | 270 this.searchTerm = ''; |
215 | 271 |
216 // Deselect the old folder if defined. | 272 // Deselect the old folder if defined. |
217 if (this.selectedId) | 273 if (this.selectedId) |
218 this.set(this.idToNodeMap_[this.selectedId].path + '.isSelected', false); | 274 this.set( |
275 this.idToNodeMap_[this.selectedId].path + '.isSelectedFolder', false); | |
jiaxi
2017/01/16 23:48:39
?
jiaxi
2017/01/16 23:49:22
Oops wrong click, ignore me.
| |
219 | 276 |
220 var selectedId = /** @type {string} */ (e.detail); | 277 var selectedId = /** @type {string} */ (e.detail); |
221 var newFolder = this.idToNodeMap_[selectedId]; | 278 var newFolder = this.idToNodeMap_[selectedId]; |
222 this.set(newFolder.path + '.isSelected', true); | 279 this.set(newFolder.path + '.isSelectedFolder', true); |
223 this.selectedId = selectedId; | 280 this.selectedId = selectedId; |
224 }, | 281 }, |
225 | 282 |
226 /** | 283 /** |
227 * Handles events that open and close folders. | 284 * Handles events that open and close folders. |
228 * @param {CustomEvent} e | 285 * @param {CustomEvent} e |
229 * @private | 286 * @private |
230 */ | 287 */ |
231 onFolderOpenChanged_: function(e) { | 288 onFolderOpenChanged_: function(e) { |
232 var folder = this.idToNodeMap_[e.detail.id]; | 289 var folder = this.idToNodeMap_[e.detail.id]; |
233 this.set(folder.path + '.isOpen', e.detail.open); | 290 this.set(folder.path + '.isOpen', e.detail.open); |
234 if (!folder.isOpen && this.isAncestorOfSelected_(folder)) | 291 if (!folder.isOpen && this.isAncestorOfSelected_(folder)) |
235 this.fire('selected-folder-changed', folder.id); | 292 this.fire('selected-folder-changed', folder.id); |
236 }, | 293 }, |
294 | |
295 /** | |
296 * Select a single item in the list. | |
297 * @param {CustomEvent} e | |
298 * @private | |
299 */ | |
300 onSingleItemSelected_: function(e) { | |
301 this.clearSelectedItems_(); | |
302 this.set(this.idToNodeMap_[e.detail.item.id].path + '.isSelected', true); | |
303 this.prevSelectedItemIndex_ = this.getSelectedIndex_(e.detail.item); | |
304 }, | |
305 | |
306 /** | |
307 * Selected multiple items based on |prevSelectedItemIndex_| and the selected | |
308 * item. If |prevSelectedItemIndex_| is not set, single select the item. | |
309 * @param {CustomEvent} e | |
310 * @private | |
311 */ | |
312 onMultipleItemsShiftSelected_: function(e) { | |
313 this.clearSelectedItems_(); | |
314 var startIndex, endIndex; | |
315 if (this.prevSelectedItemIndex_ == undefined) { | |
316 this.prevSelectedItemIndex_ = this.getSelectedIndex_(e.detail.item); | |
317 startIndex = this.prevSelectedItemIndex_; | |
318 endIndex = this.prevSelectedItemIndex_; | |
319 } else { | |
320 var currIndex = this.getSelectedIndex_(e.detail.item); | |
321 startIndex = Math.min(this.prevSelectedItemIndex_, currIndex); | |
322 endIndex = Math.max(this.prevSelectedItemIndex_, currIndex); | |
323 } | |
324 for (var i = startIndex; i <= endIndex; i++) | |
325 this.set( | |
326 this.idToNodeMap_[this.displayedList[i].id].path + | |
327 '.isSelected', | |
328 true); | |
329 }, | |
330 | |
331 /** | |
332 * Select multiple items with the index of the last elected item as | |
333 * |prevSelectedItemIndex_|. | |
334 * @param {CustomEvent} e | |
335 * @private | |
336 */ | |
337 onMultipleItemsCtrlSelected_: function(e) { | |
338 this.set(this.idToNodeMap_[e.detail.item.id].path + '.isSelected', true); | |
339 this.prevSelectedItemIndex_ = this.getSelectedIndex_(e.detail.item); | |
340 }, | |
237 }); | 341 }); |
238 | 342 |
239 //////////////////////////////////////////////////////////////////////////////// | 343 //////////////////////////////////////////////////////////////////////////////// |
240 // bookmarks-store, static methods: | 344 // bookmarks-store, static methods: |
241 | 345 |
242 /** | 346 /** |
243 * Stores the path from the store to a node inside the node. | 347 * Stores the path from the store to a node inside the node. |
244 * @param {BookmarkTreeNode} bookmarkNode | 348 * @param {BookmarkTreeNode} bookmarkNode |
245 * @param {number} startIndex | 349 * @param {number} startIndex |
246 */ | 350 */ |
247 BookmarksStore.generatePaths = function(bookmarkNode, startIndex) { | 351 BookmarksStore.generatePaths = function(bookmarkNode, startIndex) { |
248 if (!bookmarkNode.children) | 352 if (!bookmarkNode.children) |
249 return; | 353 return; |
250 | 354 |
251 for (var i = startIndex; i < bookmarkNode.children.length; i++) { | 355 for (var i = startIndex; i < bookmarkNode.children.length; i++) { |
252 bookmarkNode.children[i].path = bookmarkNode.path + '.children.#' + i; | 356 bookmarkNode.children[i].path = bookmarkNode.path + '.children.#' + i; |
253 BookmarksStore.generatePaths(bookmarkNode.children[i], 0); | 357 BookmarksStore.generatePaths(bookmarkNode.children[i], 0); |
254 } | 358 } |
255 }; | 359 }; |
256 | 360 |
257 /** | 361 /** |
258 * Initializes the nodes in the bookmarks tree as follows: | 362 * Initializes the nodes in the bookmarks tree as follows: |
259 * - Populates |idToNodeMap_| with a mapping of all node ids to their | 363 * - Populates |idToNodeMap_| with a mapping of all node ids to their |
260 * corresponding BookmarkTreeNode. | 364 * corresponding BookmarkTreeNode. |
261 * - Sets all the nodes to not selected and open by default. | 365 * - Sets all the nodes to not selected and open by default. |
262 * @param {BookmarkTreeNode} bookmarkNode | 366 * @param {BookmarkTreeNode} bookmarkNode |
263 * @param {Object=} idToNodeMap | 367 * @param {Object=} idToNodeMap |
264 */ | 368 */ |
265 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) { | 369 BookmarksStore.initNodes = function(bookmarkNode, idToNodeMap) { |
370 bookmarkNode.isSelected = false; | |
266 if (idToNodeMap) | 371 if (idToNodeMap) |
267 idToNodeMap[bookmarkNode.id] = bookmarkNode; | 372 idToNodeMap[bookmarkNode.id] = bookmarkNode; |
268 | 373 |
269 if (bookmarkNode.url) | 374 if (bookmarkNode.url) |
270 return; | 375 return; |
271 | 376 |
272 bookmarkNode.isSelected = false; | 377 bookmarkNode.isSelectedFolder = false; |
273 bookmarkNode.isOpen = true; | 378 bookmarkNode.isOpen = true; |
274 for (var i = 0; i < bookmarkNode.children.length; i++) | 379 for (var i = 0; i < bookmarkNode.children.length; i++) |
275 BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap); | 380 BookmarksStore.initNodes(bookmarkNode.children[i], idToNodeMap); |
276 }; | 381 }; |
OLD | NEW |