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

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

Issue 2984843003: MD Settings: Convert all usages of .bind(this) to use ES6 arrow function. (Closed)
Patch Set: Resolve conflicts. Created 3 years, 4 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 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 75 matching lines...) Expand 10 before | Expand all | Expand 10 after
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.
94 if (!oldRoute) { 94 if (!oldRoute) {
95 this.fire('hide-container'); 95 this.fire('hide-container');
96 setTimeout(function() { 96 setTimeout(() => {
97 this.fire('show-container'); 97 this.fire('show-container');
98 this.tryTransitionToSection_(scrollToSection, true); 98 this.tryTransitionToSection_(scrollToSection, true);
99 }.bind(this)); 99 });
100 } else if (this.scrollHeight == 0) { 100 } else if (this.scrollHeight == 0) {
101 setTimeout(this.tryTransitionToSection_.bind(this, scrollToSection)); 101 setTimeout(this.tryTransitionToSection_.bind(this, scrollToSection));
102 } else { 102 } else {
103 this.tryTransitionToSection_(scrollToSection); 103 this.tryTransitionToSection_(scrollToSection);
104 } 104 }
105 }, 105 },
106 106
107 /** 107 /**
108 * When exiting search mode, we need to make another attempt to scroll to 108 * When exiting search mode, we need to make another attempt to scroll to
109 * the correct section, since it has just been re-rendered. 109 * the correct section, since it has just been re-rendered.
(...skipping 59 matching lines...) Expand 10 before | Expand all | Expand 10 after
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
176 // again after the promise resolves. 176 // again after the promise resolves.
177 if (promise) { 177 if (promise) {
178 promise.then(this.tryTransitionToSection_.bind(this, scrollToSection)) 178 promise.then(this.tryTransitionToSection_.bind(this, scrollToSection))
179 .then(function() { 179 .then(() => {
180 this.fire('show-container'); 180 this.fire('show-container');
181 }.bind(this)); 181 });
182 } 182 }
183 }, 183 },
184 184
185 /** 185 /**
186 * If the current animation is inconsistent with the current route, stops the 186 * If the current animation is inconsistent with the current route, stops the
187 * animation by finishing or canceling it so the new route can be animated to. 187 * animation by finishing or canceling it so the new route can be animated to.
188 * @private 188 * @private
189 */ 189 */
190 maybeStopCurrentAnimation_: function() { 190 maybeStopCurrentAnimation_: function() {
191 var currentRoute = settings.getCurrentRoute(); 191 var currentRoute = settings.getCurrentRoute();
(...skipping 60 matching lines...) Expand 10 before | Expand all | Expand 10 after
252 this.origScrollTop_ = this.scroller.scrollTop; 252 this.origScrollTop_ = this.scroller.scrollTop;
253 this.fire('freeze-scroll', true); 253 this.fire('freeze-scroll', true);
254 254
255 // Freeze the section's height so its card can be removed from the flow. 255 // Freeze the section's height so its card can be removed from the flow.
256 section.setFrozen(true); 256 section.setFrozen(true);
257 257
258 this.currentAnimation_ = section.animateExpand(this.scroller); 258 this.currentAnimation_ = section.animateExpand(this.scroller);
259 259
260 return this.currentAnimation_.finished 260 return this.currentAnimation_.finished
261 .then( 261 .then(
262 function() { 262 () => {
263 this.finishedExpanding_(section); 263 this.finishedExpanding_(section);
264 }.bind(this), 264 },
265 function() { 265 () => {
266 // The animation was canceled; restore the section and scroll 266 // The animation was canceled; restore the section and scroll
267 // position. 267 // position.
268 section.setFrozen(false); 268 section.setFrozen(false);
269 this.scroller.scrollTop = this.origScrollTop_; 269 this.scroller.scrollTop = this.origScrollTop_;
270 }.bind(this)) 270 })
271 .then(function() { 271 .then(() => {
272 this.fire('freeze-scroll', false); 272 this.fire('freeze-scroll', false);
273 this.currentAnimation_ = null; 273 this.currentAnimation_ = null;
274 }.bind(this)); 274 });
275 }, 275 },
276 276
277 /** @private */ 277 /** @private */
278 finishedExpanding_: function(section) { 278 finishedExpanding_: function(section) {
279 // Hide other sections and scroll to the top of the subpage. 279 // Hide other sections and scroll to the top of the subpage.
280 this.classList.add('showing-subpage'); 280 this.classList.add('showing-subpage');
281 this.toggleOtherSectionsHidden_(section.section, true); 281 this.toggleOtherSectionsHidden_(section.section, true);
282 this.scroller.scrollTop = 0; 282 this.scroller.scrollTop = 0;
283 section.setFrozen(false); 283 section.setFrozen(false);
284 284
(...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after
317 this.toggleOtherSectionsHidden_(section.section, false); 317 this.toggleOtherSectionsHidden_(section.section, false);
318 this.classList.remove('showing-subpage'); 318 this.classList.remove('showing-subpage');
319 319
320 if (!shouldAnimateCollapse) { 320 if (!shouldAnimateCollapse) {
321 // Finish by restoring the section into the page. 321 // Finish by restoring the section into the page.
322 section.setFrozen(false); 322 section.setFrozen(false);
323 return Promise.resolve(); 323 return Promise.resolve();
324 } 324 }
325 325
326 // Play the actual collapse animation. 326 // Play the actual collapse animation.
327 return new Promise(function(resolve, reject) { 327 return new Promise((resolve, reject) => {
328 // Wait for the other sections to show up so we can scroll properly. 328 // Wait for the other sections to show up so we can scroll properly.
329 setTimeout(function() { 329 setTimeout(() => {
330 var newSection = settings.getCurrentRoute().section && 330 var newSection = settings.getCurrentRoute().section &&
331 this.getSection(settings.getCurrentRoute().section); 331 this.getSection(settings.getCurrentRoute().section);
332 332
333 // Scroll to the new section or the original position. 333 // Scroll to the new section or the original position.
334 if (newSection && !settings.lastRouteChangeWasPopstate() && 334 if (newSection && !settings.lastRouteChangeWasPopstate() &&
335 !settings.getCurrentRoute().isSubpage()) { 335 !settings.getCurrentRoute().isSubpage()) {
336 newSection.scrollIntoView(); 336 newSection.scrollIntoView();
337 } else { 337 } else {
338 this.scroller.scrollTop = this.origScrollTop_; 338 this.scroller.scrollTop = this.origScrollTop_;
339 } 339 }
340 340
341 this.currentAnimation_ = section.animateCollapse( 341 this.currentAnimation_ = section.animateCollapse(
342 /** @type {!HTMLElement} */ (this.scroller)); 342 /** @type {!HTMLElement} */ (this.scroller));
343 343
344 this.currentAnimation_.finished 344 this.currentAnimation_.finished
345 .catch(function() { 345 .catch(() => {
346 // The collapse was canceled, so the page is showing a subpage 346 // The collapse was canceled, so the page is showing a subpage
347 // still. 347 // still.
348 this.fire('subpage-expand'); 348 this.fire('subpage-expand');
349 }.bind(this)) 349 })
350 .then(function() { 350 .then(() => {
351 // Clean up after the animation succeeds or cancels. 351 // Clean up after the animation succeeds or cancels.
352 section.setFrozen(false); 352 section.setFrozen(false);
353 section.classList.remove('collapsing'); 353 section.classList.remove('collapsing');
354 this.fire('freeze-scroll', false); 354 this.fire('freeze-scroll', false);
355 this.currentAnimation_ = null; 355 this.currentAnimation_ = null;
356 resolve(); 356 resolve();
357 }.bind(this)); 357 });
358 }.bind(this)); 358 });
359 }.bind(this)); 359 });
360 }, 360 },
361 361
362 /** 362 /**
363 /** 363 /**
364 * Hides or unhides the sections not being expanded. 364 * Hides or unhides the sections not being expanded.
365 * @param {string} sectionName The section to keep visible. 365 * @param {string} sectionName The section to keep visible.
366 * @param {boolean} hidden Whether the sections should be hidden. 366 * @param {boolean} hidden Whether the sections should be hidden.
367 * @private 367 * @private
368 */ 368 */
369 toggleOtherSectionsHidden_: function(sectionName, hidden) { 369 toggleOtherSectionsHidden_: function(sectionName, hidden) {
(...skipping 13 matching lines...) Expand all
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 ];
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698