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

Side by Side Diff: chrome/browser/resources/settings/settings_page/settings_animated_pages.js

Issue 2841873004: MD Settings: Fix subpage navigation focus for bluetooth+internet (Closed)
Patch Set: Fix browser tests Created 3 years, 7 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
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
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
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
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 });
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698