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 /** | 5 /** |
6 * @typedef {{about: boolean, basic: boolean, advanced: boolean}} | 6 * @typedef {{about: boolean, settings: boolean}} |
7 */ | 7 */ |
8 var MainPageVisibility; | 8 var MainPageVisibility; |
9 | 9 |
10 /** | 10 /** |
11 * @fileoverview | 11 * @fileoverview |
12 * 'settings-main' displays the selected settings page. | 12 * 'settings-main' displays the selected settings page. |
13 */ | 13 */ |
14 Polymer({ | 14 Polymer({ |
15 is: 'settings-main', | 15 is: 'settings-main', |
16 | 16 |
17 behaviors: [settings.RouteObserverBehavior], | 17 behaviors: [settings.RouteObserverBehavior], |
18 | 18 |
19 properties: { | 19 properties: { |
20 /** | 20 /** |
21 * Preferences state. | 21 * Preferences state. |
22 */ | 22 */ |
23 prefs: { | 23 prefs: { |
24 type: Object, | 24 type: Object, |
25 notify: true, | 25 notify: true, |
26 }, | 26 }, |
27 | 27 |
28 advancedToggleExpanded: { | 28 advancedToggleExpanded: { |
29 type: Boolean, | 29 type: Boolean, |
30 notify: true, | 30 notify: true, |
31 observer: 'updatePagesShown_', | |
32 }, | 31 }, |
33 | 32 |
34 /** | |
35 * True if a section is fully expanded to hide other sections beneath it. | |
36 * Not true otherwise (even while animating a section open/closed). | |
37 * @private | |
38 */ | |
39 hasExpandedSection_: Boolean, | |
40 | |
41 /** @private */ | 33 /** @private */ |
42 overscroll_: { | 34 overscroll_: { |
43 type: Number, | 35 type: Number, |
44 observer: 'overscrollChanged_', | 36 observer: 'overscrollChanged_', |
45 }, | 37 }, |
46 | 38 |
47 /** | 39 /** |
48 * Controls which main pages are displayed via dom-ifs, based on the current | 40 * Controls which main pages are displayed via dom-ifs, based on the current |
49 * route and the Advanced toggle state. | 41 * route. |
50 * @private {!MainPageVisibility} | 42 * @private {!MainPageVisibility} |
51 */ | 43 */ |
52 showPages_: { | 44 showPages_: { |
53 type: Object, | 45 type: Object, |
54 value: function() { | 46 value: function() { |
55 return {about: false, basic: false, advanced: false}; | 47 return {about: false, settings: false}; |
56 }, | 48 }, |
57 }, | 49 }, |
58 | 50 |
59 /** | 51 /** |
60 * Whether a search operation is in progress or previous search results are | 52 * Whether a search operation is in progress or previous search results are |
61 * being displayed. | 53 * being displayed. |
62 * @private {boolean} | 54 * @private {boolean} |
63 */ | 55 */ |
64 inSearchMode_: { | 56 inSearchMode_: { |
65 type: Boolean, | 57 type: Boolean, |
(...skipping 20 matching lines...) Expand all Loading... |
86 type: Object, | 78 type: Object, |
87 value: function() { return {}; }, | 79 value: function() { return {}; }, |
88 }, | 80 }, |
89 | 81 |
90 showAndroidApps: Boolean, | 82 showAndroidApps: Boolean, |
91 }, | 83 }, |
92 | 84 |
93 /** @override */ | 85 /** @override */ |
94 attached: function() { | 86 attached: function() { |
95 this.listen(this, 'freeze-scroll', 'onFreezeScroll_'); | 87 this.listen(this, 'freeze-scroll', 'onFreezeScroll_'); |
96 var currentRoute = settings.getCurrentRoute(); | |
97 this.hasExpandedSection_ = currentRoute && currentRoute.isSubpage(); | |
98 }, | 88 }, |
99 | 89 |
100 /** @override */ | 90 /** @override */ |
101 detached: function() { | 91 detached: function() { |
102 this.unlisten(this, 'freeze-scroll', 'onFreezeScroll_'); | 92 this.unlisten(this, 'freeze-scroll', 'onFreezeScroll_'); |
103 }, | 93 }, |
104 | 94 |
105 /** @private */ | 95 /** @private */ |
106 overscrollChanged_: function() { | 96 overscrollChanged_: function() { |
107 if (!this.overscroll_ && this.boundScroll_) { | 97 if (!this.overscroll_ && this.boundScroll_) { |
(...skipping 47 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
155 this.offsetParent.style.overflow = 'hidden'; | 145 this.offsetParent.style.overflow = 'hidden'; |
156 var scrollbarWidth = this.offsetParent.clientWidth - scrollerWidth; | 146 var scrollbarWidth = this.offsetParent.clientWidth - scrollerWidth; |
157 this.offsetParent.style.width = 'calc(100% - ' + scrollbarWidth + 'px)'; | 147 this.offsetParent.style.width = 'calc(100% - ' + scrollbarWidth + 'px)'; |
158 } else { | 148 } else { |
159 this.ignoreScroll_ = false; | 149 this.ignoreScroll_ = false; |
160 this.offsetParent.style.overflow = ''; | 150 this.offsetParent.style.overflow = ''; |
161 this.offsetParent.style.width = ''; | 151 this.offsetParent.style.width = ''; |
162 } | 152 } |
163 }, | 153 }, |
164 | 154 |
165 /** | |
166 * @param {boolean} opened Whether the menu is expanded. | |
167 * @return {string} Which icon to use. | |
168 * @private | |
169 */ | |
170 arrowState_: function(opened) { | |
171 return opened ? 'settings:arrow-drop-up' : 'cr:arrow-drop-down'; | |
172 }, | |
173 | |
174 /** | |
175 * @return {boolean} | |
176 * @private | |
177 */ | |
178 showAdvancedToggle_: function() { | |
179 return !this.inSearchMode_ && this.showPages_.basic && | |
180 !this.hasExpandedSection_; | |
181 }, | |
182 | |
183 /** | |
184 * @return {boolean} Whether to show the basic page, taking into account both | |
185 * routing and search state. | |
186 * @private | |
187 */ | |
188 showBasicPage_: function() { | |
189 return this.showPages_.basic || ( | |
190 this.inSearchMode_ && !this.hasExpandedSection_); | |
191 }, | |
192 | |
193 /** | |
194 * @return {boolean} Whether to show the advanced page, taking into account | |
195 * both routing and search state. | |
196 * @private | |
197 */ | |
198 showAdvancedPage_: function() { | |
199 return this.showPages_.advanced || ( | |
200 this.inSearchMode_ && !this.hasExpandedSection_); | |
201 }, | |
202 | |
203 /** @param {!settings.Route} newRoute */ | 155 /** @param {!settings.Route} newRoute */ |
204 currentRouteChanged: function(newRoute) { | 156 currentRouteChanged: function(newRoute) { |
205 // When the route changes from a sub-page to the main page, immediately | |
206 // update hasExpandedSection_ to unhide the other sections. | |
207 if (!newRoute.isSubpage()) | |
208 this.hasExpandedSection_ = false; | |
209 | |
210 if (settings.Route.ADVANCED.contains(newRoute)) | |
211 this.advancedToggleExpanded = true; | |
212 | |
213 this.updatePagesShown_(); | 157 this.updatePagesShown_(); |
214 }, | 158 }, |
215 | 159 |
216 /** @private */ | 160 /** @private */ |
217 onSubpageExpand_: function() { | 161 onSubpageExpand_: function() { |
218 // The subpage finished expanding fully. Hide pages other than the current | |
219 // section's parent page. | |
220 this.hasExpandedSection_ = true; | |
221 this.updatePagesShown_(); | 162 this.updatePagesShown_(); |
222 }, | 163 }, |
223 | 164 |
224 /** | 165 /** |
225 * Updates the hidden state of the about, basic and advanced pages, based on | 166 * Updates the hidden state of the about and settings pages based on the |
226 * the current route and the Advanced toggle state. | 167 * current route. |
227 * @private | 168 * @private |
228 */ | 169 */ |
229 updatePagesShown_: function() { | 170 updatePagesShown_: function() { |
230 var currentRoute = settings.getCurrentRoute(); | 171 var inAbout = settings.Route.ABOUT.contains(settings.getCurrentRoute()); |
231 if (settings.Route.ABOUT.contains(currentRoute)) { | 172 this.showPages_ = {about: inAbout, settings: !inAbout}; |
232 this.showPages_ = {about: true, basic: false, advanced: false}; | |
233 } else { | |
234 this.showPages_ = { | |
235 about: false, | |
236 basic: settings.Route.BASIC.contains(currentRoute) || | |
237 !this.hasExpandedSection_, | |
238 advanced: this.hasExpandedSection_ ? | |
239 settings.Route.ADVANCED.contains(currentRoute) : | |
240 this.advancedToggleExpanded, | |
241 }; | |
242 } | |
243 | 173 |
244 // Calculate and set the overflow padding. | 174 // Calculate and set the overflow padding. |
245 this.updateOverscrollForPage_(); | 175 this.updateOverscrollForPage_(); |
246 | 176 |
247 // Wait for any other changes, then calculate the overflow padding again. | 177 // Wait for any other changes, then calculate the overflow padding again. |
248 setTimeout(function() { | 178 setTimeout(function() { |
249 // Ensure any dom-if reflects the current properties. | 179 // Ensure any dom-if reflects the current properties. |
250 Polymer.dom.flush(); | 180 Polymer.dom.flush(); |
251 this.updateOverscrollForPage_(); | 181 this.updateOverscrollForPage_(); |
252 }.bind(this)); | 182 }.bind(this)); |
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
285 if (!section || !section.offsetParent) | 215 if (!section || !section.offsetParent) |
286 return 0; | 216 return 0; |
287 | 217 |
288 // Find the distance from the section's top to the overscroll. | 218 // Find the distance from the section's top to the overscroll. |
289 var sectionTop = section.offsetParent.offsetTop + section.offsetTop; | 219 var sectionTop = section.offsetParent.offsetTop + section.offsetTop; |
290 var distance = this.$.overscroll.offsetTop - sectionTop; | 220 var distance = this.$.overscroll.offsetTop - sectionTop; |
291 | 221 |
292 return Math.max(0, this.offsetParent.clientHeight - distance); | 222 return Math.max(0, this.offsetParent.clientHeight - distance); |
293 }, | 223 }, |
294 | 224 |
295 /** @private */ | |
296 toggleAdvancedPage_: function() { | |
297 this.advancedToggleExpanded = !this.advancedToggleExpanded; | |
298 }, | |
299 | |
300 /** | 225 /** |
301 * Returns the root page (if it exists) for a route. | 226 * Returns the root page (if it exists) for a route. |
302 * @param {!settings.Route} route | 227 * @param {!settings.Route} route |
303 * @return {(?SettingsAboutPageElement|?SettingsAdvancedPageElement| | 228 * @return {(?SettingsAboutPageElement|?SettingsBasicPageElement)} |
304 * ?SettingsBasicPageElement)} | |
305 */ | 229 */ |
306 getPage_: function(route) { | 230 getPage_: function(route) { |
307 if (settings.Route.ABOUT.contains(route)) { | 231 if (settings.Route.ABOUT.contains(route)) { |
308 return /** @type {?SettingsAboutPageElement} */( | 232 return /** @type {?SettingsAboutPageElement} */( |
309 this.$$('settings-about-page')); | 233 this.$$('settings-about-page')); |
310 } | 234 } |
311 if (settings.Route.ADVANCED.contains(route)) { | 235 if (settings.Route.BASIC.contains(route) || |
312 return /** @type {?SettingsAdvancedPageElement} */( | 236 settings.Route.ADVANCED.contains(route)) { |
313 this.$$('settings-advanced-page')); | |
314 } | |
315 if (settings.Route.BASIC.contains(route)) { | |
316 return /** @type {?SettingsBasicPageElement} */( | 237 return /** @type {?SettingsBasicPageElement} */( |
317 this.$$('settings-basic-page')); | 238 this.$$('settings-basic-page')); |
318 } | 239 } |
319 assertNotReached(); | 240 assertNotReached(); |
320 }, | 241 }, |
321 | 242 |
322 /** | 243 /** |
323 * @param {string} query | 244 * @param {string} query |
324 * @return {!Promise} A promise indicating that searching finished. | 245 * @return {!Promise} A promise indicating that searching finished. |
325 */ | 246 */ |
326 searchContents: function(query) { | 247 searchContents: function(query) { |
327 // Trigger rendering of the basic and advanced pages and search once ready. | 248 // Trigger rendering of the basic and advanced pages and search once ready. |
328 this.inSearchMode_ = true; | 249 this.inSearchMode_ = true; |
329 this.toolbarSpinnerActive = true; | 250 this.toolbarSpinnerActive = true; |
330 | 251 |
331 return new Promise(function(resolve, reject) { | 252 return new Promise(function(resolve, reject) { |
332 setTimeout(function() { | 253 setTimeout(function() { |
333 var whenSearchDone = settings.getSearchManager().search( | 254 var whenSearchDone = |
334 query, assert(this.getPage_(settings.Route.BASIC))); | 255 assert(this.getPage_(settings.Route.BASIC)).searchContents(query); |
335 | |
336 if (this.pageVisibility.advancedSettings !== false) { | |
337 assert(whenSearchDone === settings.getSearchManager().search( | |
338 query, assert(this.getPage_(settings.Route.ADVANCED)))); | |
339 } | |
340 | |
341 whenSearchDone.then(function(request) { | 256 whenSearchDone.then(function(request) { |
342 resolve(); | 257 resolve(); |
343 if (!request.finished) { | 258 if (!request.finished) { |
344 // Nothing to do here. A previous search request was canceled | 259 // Nothing to do here. A previous search request was canceled |
345 // because a new search request was issued before the first one | 260 // because a new search request was issued before the first one |
346 // completed. | 261 // completed. |
347 return; | 262 return; |
348 } | 263 } |
349 | 264 |
350 this.toolbarSpinnerActive = false; | 265 this.toolbarSpinnerActive = false; |
351 this.inSearchMode_ = !request.isSame(''); | 266 this.inSearchMode_ = !request.isSame(''); |
352 this.showNoResultsFound_ = | 267 this.showNoResultsFound_ = |
353 this.inSearchMode_ && !request.didFindMatches(); | 268 this.inSearchMode_ && !request.didFindMatches(); |
354 }.bind(this)); | 269 }.bind(this)); |
355 }.bind(this), 0); | 270 }.bind(this), 0); |
356 }.bind(this)); | 271 }.bind(this)); |
357 }, | 272 }, |
358 | |
359 /** | |
360 * @param {(boolean|undefined)} visibility | |
361 * @return {boolean} True unless visibility is false. | |
362 * @private | |
363 */ | |
364 showAdvancedSettings_: function(visibility) { | |
365 return visibility !== false; | |
366 }, | |
367 }); | 273 }); |
OLD | NEW |