Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(113)

Side by Side Diff: chrome/browser/resources/md_history/history_card_manager.js

Issue 1641543002: MD History: Refactored design for displaying history information (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@second_patch
Patch Set: concat -> push Created 4 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
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
3 // found in the LICENSE file.
4
5 Polymer({
6 is: 'history-card-manager',
7
8 properties: {
9 // An array of objects sorted in reverse chronological order.
10 // Each object has a date and the history items belonging to that date.
11 historyDataByDay_: {
12 type: Array,
13 value: function() { return []; }
14 },
15
16 // The time of access of the last element of historyDataByDay_.
17 lastVisitedTime: {
18 type: Number,
19 value: 0
20 },
21
22 menuOpen: {
23 type: Boolean,
24 value: false,
25 reflectToAttribute: true
26 },
27
28 menuIdentifier: {
29 type: Number,
30 value: 0
31 }
32 },
33
34 /** @const @private */
35 X_OFFSET_: 30,
36
37 listeners: {
38 'tap': 'closeMenu',
39 'toggle-menu': 'toggleMenu_'
40 },
41
42 /**
43 * Closes the overflow menu.
44 */
45 closeMenu: function() {
46 this.menuOpen = false;
47 },
48
49 /**
50 * Opens the overflow menu unless the menu is already open and the same button
51 * is pressed.
52 * @param {Event} e The event with details of the menu item that was clicked.
53 * @private
54 */
55 toggleMenu_: function(e) {
56 var menu = this.$['overflow-menu'];
57
58 // Menu closes if the same button is clicked.
59 if (this.menuOpen && this.menuIdentifier == e.detail.accessTime) {
60 this.closeMenu();
61 } else {
62 this.menuOpen = true;
63 this.menuIdentifier = e.detail.accessTime;
64
65 cr.ui.positionPopupAtPoint(e.detail.x + this.X_OFFSET_, e.detail.y, menu,
66 cr.ui.AnchorType.BEFORE);
67
68 menu.focus();
69 }
70 },
71
72 /**
73 * Split the newly updated history results into history items sorted via day
74 * accessed.
75 * @param {!Array<!HistoryEntry>} results The new history results.
76 */
77 addNewResults: function(results) {
78 if (results.length == 0)
79 return;
80
81 var dateSortedData = [];
82 var historyItems = [];
83 var currentDate = results[0].dateRelativeDay;
84
85 for (var i = 0; i < results.length; i++) {
86 if (!currentDate)
87 continue;
88
89 results[i].selected = false;
90 if (results[i].dateRelativeDay != currentDate) {
91 this.appendHistoryData_(currentDate, historyItems);
92 currentDate = results[i].dateRelativeDay;
93 historyItems = [];
94 }
95 historyItems.push(results[i]);
96 }
97
98 if (currentDate)
99 this.appendHistoryData_(currentDate, historyItems);
100
101 this.lastVisitedTime = historyItems[historyItems.length - 1].time;
102 },
103
104 /**
105 * Cycle through each entry in historyDataByDay_ and set all items to be
106 * unselected.
107 */
108 unselectAllItems: function(overallItemCount) {
109 var historyCardData = this.historyDataByDay_;
110
111 for (var i = 0; i < historyCardData.length; i++) {
112 var items = historyCardData[i].historyItems;
113 for (var j = 0; j < items.length; j++) {
114 if (items[j].selected) {
115 this.set('historyDataByDay_.' + i + '.historyItems.' + j +
116 '.selected', false);
117 overallItemCount--;
118 if (overallItemCount == 0)
119 break;
120 }
121 }
122 }
123 },
124
125 /**
126 * Adds the given items into historyDataByDay_. Adds items to the last
127 * existing day if the date matches, creates a new element otherwise.
128 * @param {string} date The date of the history items.
129 * @param {!Array<!HistoryEntry>} historyItems The list of history items for
130 * the current date.
131 * @private
132 */
133 appendHistoryData_: function(date, historyItems) {
134 var lastDay = this.historyDataByDay_.length - 1;
135 if (lastDay > 0 && date == this.historyDataByDay_[lastDay].date) {
136 this.set('historyDataByDay_.' + lastDay + '.historyItems',
137 this.historyDataByDay_[lastDay].historyItems.concat(historyItems));
138 } else {
139 this.push('historyDataByDay_', {
140 date: date,
141 historyItems: historyItems
142 });
143 }
144 },
145
146 /**
147 * Called when the card manager is scrolled.
148 * @private
149 */
150 scrollHandler_: function() {
151 // Close overflow menu on scroll.
152 this.closeMenu();
153
154 // Requests the next list of results when the scrollbar is near the bottom
155 // of the window.
156 var scrollOffset = 10;
157 var scrollElem = this.$['infinite-list'];
158
159 if (scrollElem.scrollHeight <=
160 scrollElem.scrollTop + scrollElem.clientHeight + scrollOffset) {
161 chrome.send('queryHistory',
162 ['', 0, 0, this.lastVisitedTime, RESULTS_PER_PAGE]);
163 }
164 }
165 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698