OLD | NEW |
1 // Copyright 2015 The Chromium Authors. All rights reserved. | 1 // Copyright 2015 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 Polymer({ | 5 Polymer({ |
6 is: 'history-list', | 6 is: 'history-list', |
7 | 7 |
8 properties: { | 8 properties: { |
9 // An array of history entries in reverse chronological order. | 9 // The search term for the current query. Set when the query returns. |
10 historyData: { | 10 searchedTerm: { |
11 type: Array | 11 type: String, |
| 12 value: '', |
12 }, | 13 }, |
13 | 14 |
14 // The time of access of the last history item in historyData. | 15 lastSearchedTerm_: String, |
15 lastVisitedTime: { | |
16 type: Number, | |
17 value: 0 | |
18 }, | |
19 | 16 |
20 searchTerm: { | 17 querying: Boolean, |
21 type: String, | |
22 value: '' | |
23 }, | |
24 | 18 |
25 // True if there is a pending request to the backend. | 19 // An array of history entries in reverse chronological order. |
26 loading_: { | 20 historyData: Array, |
27 type: Boolean, | |
28 value: true | |
29 }, | |
30 | 21 |
31 resultLoadingDisabled_: { | 22 resultLoadingDisabled_: { |
32 type: Boolean, | 23 type: Boolean, |
33 value: false | 24 value: false, |
34 }, | 25 }, |
35 }, | 26 }, |
36 | 27 |
37 listeners: { | 28 listeners: { |
38 'infinite-list.scroll': 'closeMenu_', | 29 'infinite-list.scroll': 'closeMenu_', |
39 'tap': 'closeMenu_', | 30 'tap': 'closeMenu_', |
40 'toggle-menu': 'toggleMenu_', | 31 'toggle-menu': 'toggleMenu_', |
41 }, | 32 }, |
42 | 33 |
43 /** | 34 /** |
44 * Closes the overflow menu. | 35 * Closes the overflow menu. |
45 * @private | 36 * @private |
46 */ | 37 */ |
47 closeMenu_: function() { | 38 closeMenu_: function() { |
48 /** @type {CrSharedMenuElement} */(this.$.sharedMenu).closeMenu(); | 39 /** @type {CrSharedMenuElement} */(this.$.sharedMenu).closeMenu(); |
49 }, | 40 }, |
50 | 41 |
51 /** | 42 /** |
52 * Mark the page as currently loading new data from the back-end. | |
53 */ | |
54 setLoading: function() { | |
55 this.loading_ = true; | |
56 }, | |
57 | |
58 /** | |
59 * Opens the overflow menu unless the menu is already open and the same button | 43 * Opens the overflow menu unless the menu is already open and the same button |
60 * is pressed. | 44 * is pressed. |
61 * @param {{detail: {item: !HistoryEntry, target: !HTMLElement}}} e | 45 * @param {{detail: {item: !HistoryEntry, target: !HTMLElement}}} e |
62 * @private | 46 * @private |
63 */ | 47 */ |
64 toggleMenu_: function(e) { | 48 toggleMenu_: function(e) { |
65 var target = e.detail.target; | 49 var target = e.detail.target; |
66 /** @type {CrSharedMenuElement} */(this.$.sharedMenu).toggleMenu( | 50 /** @type {CrSharedMenuElement} */(this.$.sharedMenu).toggleMenu( |
67 target, e.detail.item); | 51 target, e.detail.item); |
68 }, | 52 }, |
69 | 53 |
70 /** @private */ | 54 /** @private */ |
71 onMoreFromSiteTap_: function() { | 55 onMoreFromSiteTap_: function() { |
72 var menu = /** @type {CrSharedMenuElement} */(this.$.sharedMenu); | 56 var menu = /** @type {CrSharedMenuElement} */(this.$.sharedMenu); |
73 this.fire('search-changed', {search: menu.itemData.domain}); | 57 this.fire('search-domain', {domain: menu.itemData.domain}); |
74 menu.closeMenu(); | 58 menu.closeMenu(); |
75 }, | 59 }, |
76 | 60 |
77 /** @private */ | 61 /** @private */ |
78 onRemoveFromHistoryTap_: function() { | 62 onRemoveFromHistoryTap_: function() { |
79 var menu = /** @type {CrSharedMenuElement} */(this.$.sharedMenu); | 63 var menu = /** @type {CrSharedMenuElement} */(this.$.sharedMenu); |
80 md_history.BrowserService.getInstance() | 64 md_history.BrowserService.getInstance() |
81 .deleteItems([menu.itemData]) | 65 .deleteItems([menu.itemData]) |
82 .then(function(items) { | 66 .then(function(items) { |
83 this.removeDeletedHistory_(items); | 67 this.removeDeletedHistory_(items); |
84 // This unselect-all is to reset the toolbar when deleting a selected | 68 // This unselect-all is to reset the toolbar when deleting a selected |
85 // item. TODO(tsergeant): Make this automatic based on observing list | 69 // item. TODO(tsergeant): Make this automatic based on observing list |
86 // modifications. | 70 // modifications. |
87 this.fire('unselect-all'); | 71 this.fire('unselect-all'); |
88 }.bind(this)); | 72 }.bind(this)); |
89 menu.closeMenu(); | 73 menu.closeMenu(); |
90 }, | 74 }, |
91 | 75 |
92 /** | 76 /** |
93 * Disables history result loading when there are no more history results. | 77 * Disables history result loading when there are no more history results. |
94 */ | 78 */ |
95 disableResultLoading: function() { | 79 disableResultLoading: function() { |
96 this.resultLoadingDisabled_ = true; | 80 this.resultLoadingDisabled_ = true; |
97 }, | 81 }, |
98 | 82 |
99 /** | 83 /** |
100 * Adds the newly updated history results into historyData. Adds new fields | 84 * Adds the newly updated history results into historyData. Adds new fields |
101 * for each result. | 85 * for each result. |
102 * @param {!Array<!HistoryEntry>} historyResults The new history results. | 86 * @param {!Array<!HistoryEntry>} historyResults The new history results. |
103 * @param {string} searchTerm Search query used to find these results. | |
104 */ | 87 */ |
105 addNewResults: function(historyResults, searchTerm) { | 88 addNewResults: function(historyResults) { |
106 this.loading_ = false; | |
107 /** @type {IronScrollThresholdElement} */(this.$['scroll-threshold']) | 89 /** @type {IronScrollThresholdElement} */(this.$['scroll-threshold']) |
108 .clearTriggers(); | 90 .clearTriggers(); |
109 | 91 |
110 if (this.searchTerm != searchTerm) { | 92 if (this.lastSearchedTerm_ != this.searchedTerm) { |
111 this.resultLoadingDisabled_ = false; | 93 this.resultLoadingDisabled_ = false; |
112 if (this.historyData) | 94 if (this.historyData) |
113 this.splice('historyData', 0, this.historyData.length); | 95 this.splice('historyData', 0, this.historyData.length); |
114 this.searchTerm = searchTerm; | 96 this.lastSearchedTerm_ = this.searchedTerm; |
115 } | 97 } |
116 | 98 |
117 if (historyResults.length == 0) | 99 if (historyResults.length == 0) |
118 return; | 100 return; |
119 | 101 |
120 // Creates a copy of historyResults to prevent accidentally modifying this | 102 // Creates a copy of historyResults to prevent accidentally modifying this |
121 // field. | 103 // field. |
122 var results = historyResults.slice(); | 104 var results = historyResults.slice(); |
123 | 105 |
124 var currentDate = results[0].dateRelativeDay; | 106 var currentDate = results[0].dateRelativeDay; |
125 | 107 |
126 for (var i = 0; i < results.length; i++) { | 108 for (var i = 0; i < results.length; i++) { |
127 // Sets the default values for these fields to prevent undefined types. | 109 // Sets the default values for these fields to prevent undefined types. |
128 results[i].selected = false; | 110 results[i].selected = false; |
129 results[i].readableTimestamp = | 111 results[i].readableTimestamp = |
130 searchTerm == '' ? results[i].dateTimeOfDay : results[i].dateShort; | 112 this.searchedTerm == '' ? |
| 113 results[i].dateTimeOfDay : results[i].dateShort; |
131 | 114 |
132 if (results[i].dateRelativeDay != currentDate) { | 115 if (results[i].dateRelativeDay != currentDate) { |
133 currentDate = results[i].dateRelativeDay; | 116 currentDate = results[i].dateRelativeDay; |
134 } | 117 } |
135 } | 118 } |
136 | 119 |
137 if (this.historyData) { | 120 if (this.historyData) { |
138 // If we have previously received data, push the new items onto the | 121 // If we have previously received data, push the new items onto the |
139 // existing array. | 122 // existing array. |
140 results.unshift('historyData'); | 123 results.unshift('historyData'); |
141 this.push.apply(this, results); | 124 this.push.apply(this, results); |
142 } else { | 125 } else { |
143 // The first time we receive data, use set() to ensure the iron-list is | 126 // The first time we receive data, use set() to ensure the iron-list is |
144 // initialized correctly. | 127 // initialized correctly. |
145 this.set('historyData', results); | 128 this.set('historyData', results); |
146 } | 129 } |
147 | |
148 this.lastVisitedTime = this.historyData[this.historyData.length - 1].time; | |
149 }, | 130 }, |
150 | 131 |
151 /** | 132 /** |
152 * Cycle through each entry in historyData and set all items to be | 133 * Cycle through each entry in historyData and set all items to be |
153 * unselected. | 134 * unselected. |
154 * @param {number} overallItemCount The number of checkboxes selected. | 135 * @param {number} overallItemCount The number of checkboxes selected. |
155 */ | 136 */ |
156 unselectAllItems: function(overallItemCount) { | 137 unselectAllItems: function(overallItemCount) { |
157 if (this.historyData === undefined) | 138 if (this.historyData === undefined) |
158 return; | 139 return; |
(...skipping 54 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
213 this.removeDeletedHistory_(items); | 194 this.removeDeletedHistory_(items); |
214 this.fire('unselect-all'); | 195 this.fire('unselect-all'); |
215 }.bind(this)); | 196 }.bind(this)); |
216 }, | 197 }, |
217 | 198 |
218 /** | 199 /** |
219 * Called when the page is scrolled to near the bottom of the list. | 200 * Called when the page is scrolled to near the bottom of the list. |
220 * @private | 201 * @private |
221 */ | 202 */ |
222 loadMoreData_: function() { | 203 loadMoreData_: function() { |
223 if (this.resultLoadingDisabled_ || this.loading_) | 204 if (this.resultLoadingDisabled_ || this.querying) |
224 return; | 205 return; |
225 | 206 |
226 this.loading_ = true; | 207 this.fire('load-more-history'); |
227 chrome.send('queryHistory', | |
228 [this.searchTerm, 0, 0, this.lastVisitedTime, RESULTS_PER_PAGE]); | |
229 }, | 208 }, |
230 | 209 |
231 /** | 210 /** |
232 * Check whether the time difference between the given history item and the | 211 * Check whether the time difference between the given history item and the |
233 * next one is large enough for a spacer to be required. | 212 * next one is large enough for a spacer to be required. |
234 * @param {HistoryEntry} item | 213 * @param {HistoryEntry} item |
235 * @param {number} index The index of |item| in |historyData|. | 214 * @param {number} index The index of |item| in |historyData|. |
236 * @param {number} length The length of |historyData|. | 215 * @param {number} length The length of |historyData|. |
237 * @return {boolean} Whether or not time gap separator is required. | 216 * @return {boolean} Whether or not time gap separator is required. |
238 * @private | 217 * @private |
239 */ | 218 */ |
240 needsTimeGap_: function(item, index, length) { | 219 needsTimeGap_: function(item, index, length) { |
241 if (index >= length - 1 || length == 0) | 220 if (index >= length - 1 || length == 0) |
242 return false; | 221 return false; |
243 | 222 |
244 var currentItem = this.historyData[index]; | 223 var currentItem = this.historyData[index]; |
245 var nextItem = this.historyData[index + 1]; | 224 var nextItem = this.historyData[index + 1]; |
246 | 225 |
247 if (this.searchTerm) | 226 if (this.searchedTerm) |
248 return currentItem.dateShort != nextItem.dateShort; | 227 return currentItem.dateShort != nextItem.dateShort; |
249 | 228 |
250 return currentItem.time - nextItem.time > BROWSING_GAP_TIME && | 229 return currentItem.time - nextItem.time > BROWSING_GAP_TIME && |
251 currentItem.dateRelativeDay == nextItem.dateRelativeDay; | 230 currentItem.dateRelativeDay == nextItem.dateRelativeDay; |
252 }, | 231 }, |
253 | 232 |
254 hasResults: function(historyDataLength) { | 233 hasResults: function(historyDataLength) { |
255 return historyDataLength > 0; | 234 return historyDataLength > 0; |
256 }, | 235 }, |
257 | 236 |
258 noResultsMessage_: function(searchTerm, isLoading) { | 237 noResultsMessage_: function(searchedTerm, isLoading) { |
259 if (isLoading) | 238 if (isLoading) |
260 return ''; | 239 return ''; |
261 var messageId = searchTerm !== '' ? 'noSearchResults' : 'noResults'; | 240 var messageId = searchedTerm !== '' ? 'noSearchResults' : 'noResults'; |
262 return loadTimeData.getString(messageId); | 241 return loadTimeData.getString(messageId); |
263 }, | 242 }, |
264 | 243 |
265 /** | 244 /** |
266 * True if the given item is the beginning of a new card. | 245 * True if the given item is the beginning of a new card. |
267 * @param {HistoryEntry} item | 246 * @param {HistoryEntry} item |
268 * @param {number} i Index of |item| within |historyData|. | 247 * @param {number} i Index of |item| within |historyData|. |
269 * @param {number} length | 248 * @param {number} length |
270 * @return {boolean} | 249 * @return {boolean} |
271 * @private | 250 * @private |
(...skipping 15 matching lines...) Expand all Loading... |
287 * @private | 266 * @private |
288 */ | 267 */ |
289 isCardEnd_: function(item, i, length) { | 268 isCardEnd_: function(item, i, length) { |
290 if (length == 0 || i > length - 1) | 269 if (length == 0 || i > length - 1) |
291 return false; | 270 return false; |
292 return i == length - 1 || | 271 return i == length - 1 || |
293 this.historyData[i].dateRelativeDay != | 272 this.historyData[i].dateRelativeDay != |
294 this.historyData[i + 1].dateRelativeDay; | 273 this.historyData[i + 1].dateRelativeDay; |
295 }, | 274 }, |
296 }); | 275 }); |
OLD | NEW |