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 * @fileoverview | 6 * @fileoverview |
7 * 'settings-animated-pages' is a container for a page and animated subpages. | 7 * 'settings-animated-pages' is a container for a page and animated subpages. |
8 * It provides a set of common behaviors and animations. | 8 * It provides a set of common behaviors and animations. |
9 * | 9 * |
10 * Example: | 10 * Example: |
(...skipping 29 matching lines...) Expand all Loading... |
40 | 40 |
41 /** | 41 /** |
42 * The last "previous" route reported by the router. | 42 * The last "previous" route reported by the router. |
43 * @private {?settings.Route} | 43 * @private {?settings.Route} |
44 */ | 44 */ |
45 previousRoute_: null, | 45 previousRoute_: null, |
46 | 46 |
47 /** @override */ | 47 /** @override */ |
48 created: function() { | 48 created: function() { |
49 // Observe the light DOM so we know when it's ready. | 49 // Observe the light DOM so we know when it's ready. |
50 this.lightDomObserver_ = Polymer.dom(this).observeNodes( | 50 this.lightDomObserver_ = |
51 this.lightDomChanged_.bind(this)); | 51 Polymer.dom(this).observeNodes(this.lightDomChanged_.bind(this)); |
52 }, | 52 }, |
53 | 53 |
54 /** @override */ | 54 /** @override */ |
55 attached: function() { | 55 attached: function() { |
56 this.outline_ = cr.ui.FocusOutlineManager.forDocument(document); | 56 this.outline_ = cr.ui.FocusOutlineManager.forDocument(document); |
57 }, | 57 }, |
58 | 58 |
59 /** | 59 /** |
60 * @param {!Event} e | 60 * @param {!Event} e |
61 * @private | 61 * @private |
62 */ | 62 */ |
63 onIronSelect_: function(e) { | 63 onIronSelect_: function(e) { |
64 if (!this.focusConfig || !this.previousRoute_) | 64 if (!this.focusConfig || !this.previousRoute_) |
65 return; | 65 return; |
66 | 66 |
67 // Don't attempt to focus any anchor element, unless last navigation was a | 67 // Don't attempt to focus any anchor element, unless last navigation was a |
68 // 'pop' (backwards) navigation. | 68 // 'pop' (backwards) navigation. |
69 if (!settings.lastRouteChangeWasPopstate()) | 69 if (!settings.lastRouteChangeWasPopstate()) |
70 return; | 70 return; |
71 | 71 |
72 // Only handle iron-select events from neon-animatable elements and the | 72 // Only handle iron-select events from neon-animatable elements and the |
73 // given whitelist of settings-subpage instances. | 73 // given whitelist of settings-subpage instances. |
74 if (!e.detail.item.matches( | 74 var whitelist = 'settings-subpage#site-settings, ' + |
75 'neon-animatable, ' + | |
76 'settings-subpage#site-settings, ' + | |
77 'settings-subpage[route-path=\"' + | 75 'settings-subpage[route-path=\"' + |
78 settings.Route.SITE_SETTINGS_COOKIES.path + '\"]')) { | 76 settings.Route.SITE_SETTINGS_COOKIES.path + '\"]'; |
| 77 |
| 78 // <if expr="chromeos"> |
| 79 whitelist += ', settings-subpage[route-path=\"' + |
| 80 settings.Route.INTERNET_NETWORKS.path + '\"]'; |
| 81 // </if> |
| 82 |
| 83 if (!e.detail.item.matches('neon-animatable, ' + whitelist)) |
79 return; | 84 return; |
80 } | |
81 | 85 |
82 var selector = this.focusConfig.get(this.previousRoute_.path); | 86 var selector = this.focusConfig.get(this.previousRoute_.path); |
83 if (selector) { | 87 if (selector) { |
84 // neon-animatable has "display: none" until the animation finishes, so | 88 // neon-animatable has "display: none" until the animation finishes, so |
85 // calling focus() on any of its children has no effect until | 89 // calling focus() on any of its children has no effect until |
86 // "display: none" is removed. Therefore can't call focus() from within | 90 // "display: none" is removed. Therefore can't call focus() from within |
87 // the currentRouteChanged callback. Using 'iron-select' listener which | 91 // the currentRouteChanged callback. Using 'iron-select' listener which |
88 // fires after the animation has finished allows focus() to work as | 92 // fires after the animation has finished allows focus() to work as |
89 // expected. | 93 // expected. |
90 var toFocus = this.querySelector(selector); | 94 var toFocus = this.querySelector(selector); |
(...skipping 26 matching lines...) Expand all Loading... |
117 }, | 121 }, |
118 | 122 |
119 /** | 123 /** |
120 * Calls currentRouteChanged with the deferred route change info. | 124 * Calls currentRouteChanged with the deferred route change info. |
121 * @private | 125 * @private |
122 */ | 126 */ |
123 runQueuedRouteChange_: function() { | 127 runQueuedRouteChange_: function() { |
124 if (!this.queuedRouteChange_) | 128 if (!this.queuedRouteChange_) |
125 return; | 129 return; |
126 this.async(this.currentRouteChanged.bind( | 130 this.async(this.currentRouteChanged.bind( |
127 this, | 131 this, this.queuedRouteChange_.newRoute, |
128 this.queuedRouteChange_.newRoute, | |
129 this.queuedRouteChange_.oldRoute)); | 132 this.queuedRouteChange_.oldRoute)); |
130 }, | 133 }, |
131 | 134 |
132 /** @protected */ | 135 /** @protected */ |
133 currentRouteChanged: function(newRoute, oldRoute) { | 136 currentRouteChanged: function(newRoute, oldRoute) { |
134 this.previousRoute_ = oldRoute; | 137 this.previousRoute_ = oldRoute; |
135 | 138 |
136 if (newRoute.section == this.section && newRoute.isSubpage()) { | 139 if (newRoute.section == this.section && newRoute.isSubpage()) { |
137 this.switchToSubpage_(newRoute, oldRoute); | 140 this.switchToSubpage_(newRoute, oldRoute); |
138 } else { | 141 } else { |
(...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
196 var routePath = settings.getCurrentRoute().path; | 199 var routePath = settings.getCurrentRoute().path; |
197 var template = Polymer.dom(this).querySelector( | 200 var template = Polymer.dom(this).querySelector( |
198 'template[route-path="' + routePath + '"]'); | 201 'template[route-path="' + routePath + '"]'); |
199 | 202 |
200 // Nothing to do if the subpage isn't wrapped in a <template> or the | 203 // Nothing to do if the subpage isn't wrapped in a <template> or the |
201 // template is already stamped. | 204 // template is already stamped. |
202 if (!template || template.if) | 205 if (!template || template.if) |
203 return; | 206 return; |
204 | 207 |
205 // Set the subpage's id for use by neon-animated-pages. | 208 // Set the subpage's id for use by neon-animated-pages. |
206 var subpage = /** @type {{_content: DocumentFragment}} */(template)._content | 209 var subpage = /** @type {{_content: DocumentFragment}} */ (template) |
207 .querySelector('settings-subpage'); | 210 ._content.querySelector('settings-subpage'); |
208 subpage.setAttribute('route-path', routePath); | 211 subpage.setAttribute('route-path', routePath); |
209 | 212 |
210 // Carry over the 'no-search' attribute from the template to the stamped | 213 // Carry over the 'no-search' attribute from the template to the stamped |
211 // instance, such that the stamped instance will also be ignored by the | 214 // instance, such that the stamped instance will also be ignored by the |
212 // searching algorithm. | 215 // searching algorithm. |
213 if (template.hasAttribute('no-search')) | 216 if (template.hasAttribute('no-search')) |
214 subpage.setAttribute('no-search', ''); | 217 subpage.setAttribute('no-search', ''); |
215 | 218 |
216 // Render synchronously so neon-animated-pages can select the subpage. | 219 // Render synchronously so neon-animated-pages can select the subpage. |
217 template.if = true; | 220 template.if = true; |
218 template.render(); | 221 template.render(); |
219 }, | 222 }, |
220 }); | 223 }); |
OLD | NEW |