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 /** | 5 /** |
6 * Responds to route changes by expanding, collapsing, or scrolling to sections | 6 * Responds to route changes by expanding, collapsing, or scrolling to sections |
7 * on the page. Expanded sections take up the full height of the container. At | 7 * on the page. Expanded sections take up the full height of the container. At |
8 * most one section should be expanded at any given time. | 8 * most one section should be expanded at any given time. |
9 * @polymerBehavior MainPageBehavior | 9 * @polymerBehavior MainPageBehavior |
10 */ | 10 */ |
(...skipping 46 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
57 * @param {!settings.Route} newRoute | 57 * @param {!settings.Route} newRoute |
58 * @param {settings.Route} oldRoute | 58 * @param {settings.Route} oldRoute |
59 */ | 59 */ |
60 currentRouteChanged: function(newRoute, oldRoute) { | 60 currentRouteChanged: function(newRoute, oldRoute) { |
61 var oldRouteWasSection = !!oldRoute && !!oldRoute.parent && | 61 var oldRouteWasSection = !!oldRoute && !!oldRoute.parent && |
62 !!oldRoute.section && oldRoute.parent.section != oldRoute.section; | 62 !!oldRoute.section && oldRoute.parent.section != oldRoute.section; |
63 | 63 |
64 if (this.scroller) { | 64 if (this.scroller) { |
65 // When navigating from a section to the root route, we just need to | 65 // When navigating from a section to the root route, we just need to |
66 // scroll to the top, and can early exit afterwards. | 66 // scroll to the top, and can early exit afterwards. |
67 if (oldRouteWasSection && newRoute == settings.Route.BASIC) { | 67 if (oldRouteWasSection && newRoute == settings.routes.BASIC) { |
68 this.scroller.scrollTop = 0; | 68 this.scroller.scrollTop = 0; |
69 return; | 69 return; |
70 } | 70 } |
71 | 71 |
72 // When navigating to the About page, we need to scroll to the top, and | 72 // When navigating to the About page, we need to scroll to the top, and |
73 // still do the rest of section management. | 73 // still do the rest of section management. |
74 if (newRoute == settings.Route.ABOUT) | 74 if (newRoute == settings.routes.ABOUT) |
75 this.scroller.scrollTop = 0; | 75 this.scroller.scrollTop = 0; |
76 } | 76 } |
77 | 77 |
78 // Scroll to the section except for back/forward. Also scroll for any | 78 // Scroll to the section except for back/forward. Also scroll for any |
79 // in-page back/forward navigations (from a section or the root page). | 79 // in-page back/forward navigations (from a section or the root page). |
80 // Also always scroll when coming from either the About or root page. | 80 // Also always scroll when coming from either the About or root page. |
81 var scrollToSection = !settings.lastRouteChangeWasPopstate() || | 81 var scrollToSection = !settings.lastRouteChangeWasPopstate() || |
82 oldRouteWasSection || oldRoute == settings.Route.BASIC || | 82 oldRouteWasSection || oldRoute == settings.routes.BASIC || |
83 oldRoute == settings.Route.ABOUT; | 83 oldRoute == settings.routes.ABOUT; |
84 | 84 |
85 // TODO(dschuyler): This doesn't set the flag in the case of going to or | 85 // TODO(dschuyler): This doesn't set the flag in the case of going to or |
86 // from the main page. It seems sensible to set the flag in those cases, | 86 // from the main page. It seems sensible to set the flag in those cases, |
87 // unfortunately bug 708465 happens. Figure out why that is and then set | 87 // unfortunately bug 708465 happens. Figure out why that is and then set |
88 // this flag more broadly. | 88 // this flag more broadly. |
89 if (oldRoute && oldRoute.isSubpage() && newRoute.isSubpage()) | 89 if (oldRoute && oldRoute.isSubpage() && newRoute.isSubpage()) |
90 this.isSubpageAnimating = true; | 90 this.isSubpageAnimating = true; |
91 | 91 |
92 // For previously uncreated pages (including on first load), allow the page | 92 // For previously uncreated pages (including on first load), allow the page |
93 // to render before scrolling to or expanding the section. | 93 // to render before scrolling to or expanding the section. |
(...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
154 // Expand the section into a subpage or scroll to it on the main page. | 154 // Expand the section into a subpage or scroll to it on the main page. |
155 if (currentRoute.isSubpage()) { | 155 if (currentRoute.isSubpage()) { |
156 if (immediate) | 156 if (immediate) |
157 this.expandSectionImmediate_(currentSection); | 157 this.expandSectionImmediate_(currentSection); |
158 else | 158 else |
159 promise = this.expandSection_(currentSection); | 159 promise = this.expandSection_(currentSection); |
160 } else if (scrollToSection) { | 160 } else if (scrollToSection) { |
161 currentSection.scrollIntoView(); | 161 currentSection.scrollIntoView(); |
162 } | 162 } |
163 } else if ( | 163 } else if ( |
164 this.tagName == 'SETTINGS-BASIC-PAGE' && | 164 this.tagName == 'SETTINGS-BASIC-PAGE' && settings.routes.ADVANCED && |
165 settings.Route.ADVANCED.contains(currentRoute) && | 165 settings.routes.ADVANCED.contains(currentRoute) && |
166 // Need to exclude routes that correspond to 'non-sectioned' children of | 166 // Need to exclude routes that correspond to 'non-sectioned' children of |
167 // ADVANCED, otherwise tryTransitionToSection_ will recurse endlessly. | 167 // ADVANCED, otherwise tryTransitionToSection_ will recurse endlessly. |
168 !currentRoute.isNavigableDialog) { | 168 !currentRoute.isNavigableDialog) { |
169 assert(currentRoute.section); | 169 assert(currentRoute.section); |
170 // Hide the container again while Advanced Page template is being loaded. | 170 // Hide the container again while Advanced Page template is being loaded. |
171 this.fire('hide-container'); | 171 this.fire('hide-container'); |
172 promise = this.$$('#advancedPageTemplate').get(); | 172 promise = this.$$('#advancedPageTemplate').get(); |
173 } | 173 } |
174 | 174 |
175 // When this animation ends, another may be necessary. Call this function | 175 // When this animation ends, another may be necessary. Call this function |
(...skipping 115 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
291 * @param {!SettingsSectionElement} section | 291 * @param {!SettingsSectionElement} section |
292 * @return {!Promise} Resolved when the transition is finished or canceled. | 292 * @return {!Promise} Resolved when the transition is finished or canceled. |
293 */ | 293 */ |
294 collapseSection_: function(section) { | 294 collapseSection_: function(section) { |
295 assert(this.scroller); | 295 assert(this.scroller); |
296 assert(section.classList.contains('expanded')); | 296 assert(section.classList.contains('expanded')); |
297 | 297 |
298 // Don't animate the collapse if we are transitioning between Basic/Advanced | 298 // Don't animate the collapse if we are transitioning between Basic/Advanced |
299 // and About, since the section won't be visible. | 299 // and About, since the section won't be visible. |
300 var needAnimate = | 300 var needAnimate = |
301 settings.Route.ABOUT.contains(settings.getCurrentRoute()) == | 301 settings.routes.ABOUT.contains(settings.getCurrentRoute()) == |
302 (section.domHost.tagName == 'SETTINGS-ABOUT-PAGE'); | 302 (section.domHost.tagName == 'SETTINGS-ABOUT-PAGE'); |
303 | 303 |
304 // Animate the collapse if the section knows the original height, except | 304 // Animate the collapse if the section knows the original height, except |
305 // when switching between Basic/Advanced and About. | 305 // when switching between Basic/Advanced and About. |
306 var shouldAnimateCollapse = needAnimate && section.canAnimateCollapse(); | 306 var shouldAnimateCollapse = needAnimate && section.canAnimateCollapse(); |
307 if (shouldAnimateCollapse) { | 307 if (shouldAnimateCollapse) { |
308 this.fire('freeze-scroll', true); | 308 this.fire('freeze-scroll', true); |
309 // Do the initial collapse setup, which takes the section out of the flow, | 309 // Do the initial collapse setup, which takes the section out of the flow, |
310 // before showing everything. | 310 // before showing everything. |
311 section.setUpAnimateCollapse(this.scroller); | 311 section.setUpAnimateCollapse(this.scroller); |
(...skipping 71 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
383 return /** @type {?SettingsSectionElement} */ ( | 383 return /** @type {?SettingsSectionElement} */ ( |
384 this.$$('settings-section[section="' + section + '"]')); | 384 this.$$('settings-section[section="' + section + '"]')); |
385 }, | 385 }, |
386 }; | 386 }; |
387 | 387 |
388 /** @polymerBehavior */ | 388 /** @polymerBehavior */ |
389 var MainPageBehavior = [ | 389 var MainPageBehavior = [ |
390 settings.RouteObserverBehavior, | 390 settings.RouteObserverBehavior, |
391 MainPageBehaviorImpl, | 391 MainPageBehaviorImpl, |
392 ]; | 392 ]; |
OLD | NEW |