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

Side by Side Diff: chrome/browser/resources/ntp4/page_list_view.js

Issue 1757673002: NTP4/apps page: fix page stickiness (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@remove-promo-cpp
Patch Set: Created 4 years, 9 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 (c) 2012 The Chromium Authors. All rights reserved. 1 // Copyright (c) 2012 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 PageListView implementation. 6 * @fileoverview PageListView implementation.
7 * PageListView manages page list, dot list, switcher buttons and handles apps 7 * PageListView manages page list, dot list, switcher buttons and handles apps
8 * pages callbacks from backend. 8 * pages callbacks from backend.
9 * 9 *
10 * Note that you need to have AppLauncherHandler in your WebUI to use this code. 10 * Note that you need to have AppLauncherHandler in your WebUI to use this code.
(...skipping 90 matching lines...) Expand 10 before | Expand all | Expand 10 after
101 101
102 /** 102 /**
103 * The 'trash' element. Note that technically this is unnecessary, 103 * The 'trash' element. Note that technically this is unnecessary,
104 * JavaScript creates the object for us based on the id. But I don't want 104 * JavaScript creates the object for us based on the id. But I don't want
105 * to rely on the ID being the same, and JSCompiler doesn't know about it. 105 * to rely on the ID being the same, and JSCompiler doesn't know about it.
106 * @type {!Element|undefined} 106 * @type {!Element|undefined}
107 */ 107 */
108 trash: undefined, 108 trash: undefined,
109 109
110 /** 110 /**
111 * The type of page that is currently shown. The value is a numerical ID. 111 * The index of the page that is currently shown. For example if the third
112 * @type {number} 112 * page is showing, this will be 2.
113 */
114 shownPage: 0,
115
116 /**
117 * The index of the page that is currently shown, within the page type.
118 * For example if the third Apps page is showing, this will be 2.
119 * @type {number} 113 * @type {number}
120 */ 114 */
121 shownPageIndex: 0, 115 shownPageIndex: 0,
122 116
123 /** 117 /**
124 * EventTracker for managing event listeners for page events. 118 * EventTracker for managing event listeners for page events.
125 * @type {!EventTracker} 119 * @type {!EventTracker}
126 */ 120 */
127 eventTracker: new EventTracker, 121 eventTracker: new EventTracker,
128 122
(...skipping 30 matching lines...) Expand all
159 new ntp.Trash(this.trash); 153 new ntp.Trash(this.trash);
160 154
161 this.pageSwitcherStart = opt_pageSwitcherStart; 155 this.pageSwitcherStart = opt_pageSwitcherStart;
162 if (this.pageSwitcherStart) 156 if (this.pageSwitcherStart)
163 ntp.initializePageSwitcher(this.pageSwitcherStart); 157 ntp.initializePageSwitcher(this.pageSwitcherStart);
164 158
165 this.pageSwitcherEnd = opt_pageSwitcherEnd; 159 this.pageSwitcherEnd = opt_pageSwitcherEnd;
166 if (this.pageSwitcherEnd) 160 if (this.pageSwitcherEnd)
167 ntp.initializePageSwitcher(this.pageSwitcherEnd); 161 ntp.initializePageSwitcher(this.pageSwitcherEnd);
168 162
169 this.shownPage = loadTimeData.getInteger('shown_page_type');
170 this.shownPageIndex = loadTimeData.getInteger('shown_page_index'); 163 this.shownPageIndex = loadTimeData.getInteger('shown_page_index');
171 164
172 // TODO(dbeam): remove showApps and everything that says if (apps). 165 // TODO(dbeam): remove showApps and everything that says if (apps).
Dan Beam 2016/03/03 21:09:41 ^
173 assert(loadTimeData.getBoolean('showApps')); 166 assert(loadTimeData.getBoolean('showApps'));
174 167
175 // Request data on the apps so we can fill them in. 168 // Request data on the apps so we can fill them in.
176 // Note that this is kicked off asynchronously. 'getAppsCallback' will 169 // Note that this is kicked off asynchronously. 'getAppsCallback' will
177 // be invoked at some point after this function returns. 170 // be invoked at some point after this function returns.
178 chrome.send('getApps'); 171 chrome.send('getApps');
179 172
180 document.addEventListener('keydown', this.onDocKeyDown_.bind(this)); 173 document.addEventListener('keydown', this.onDocKeyDown_.bind(this));
181 174
182 this.tilePages = this.pageList.getElementsByClassName('tile-page'); 175 this.tilePages = this.pageList.getElementsByClassName('tile-page');
(...skipping 260 matching lines...) Expand 10 before | Expand all | Expand 10 after
443 } 436 }
444 this.updateSliderCards(); 437 this.updateSliderCards();
445 } 438 }
446 439
447 var page = this.appsPages[pageIndex]; 440 var page = this.appsPages[pageIndex];
448 var app = $(appData.id); 441 var app = $(appData.id);
449 if (app) { 442 if (app) {
450 app.replaceAppData(appData); 443 app.replaceAppData(appData);
451 } else if (opt_highlight) { 444 } else if (opt_highlight) {
452 page.insertAndHighlightApp(appData); 445 page.insertAndHighlightApp(appData);
453 this.setShownPage_(loadTimeData.getInteger('apps_page_id'), 446 this.setShownPage_(appData.page_index);
454 appData.page_index);
455 } else { 447 } else {
456 page.insertApp(appData, false); 448 page.insertApp(appData, false);
457 } 449 }
458 }, 450 },
459 451
460 /** 452 /**
461 * Callback invoked by chrome whenever an app preference changes. 453 * Callback invoked by chrome whenever an app preference changes.
462 * @param {Object} data An object with all the data on available 454 * @param {Object} data An object with all the data on available
463 * applications. 455 * applications.
464 */ 456 */
(...skipping 16 matching lines...) Expand all
481 * @param {boolean} show Identifies if we should show or hide the promo. 473 * @param {boolean} show Identifies if we should show or hide the promo.
482 */ 474 */
483 appLauncherPromoPrefChangeCallback: function(show) { 475 appLauncherPromoPrefChangeCallback: function(show) {
484 loadTimeData.overrideValues({showAppLauncherPromo: show}); 476 loadTimeData.overrideValues({showAppLauncherPromo: show});
485 this.updateAppLauncherPromoHiddenState_(); 477 this.updateAppLauncherPromoHiddenState_();
486 }, 478 },
487 479
488 /** 480 /**
489 * Updates the hidden state of the app launcher promo based on the page 481 * Updates the hidden state of the app launcher promo based on the page
490 * shown and load data content. 482 * shown and load data content.
483 * @private
491 */ 484 */
492 updateAppLauncherPromoHiddenState_: function() { 485 updateAppLauncherPromoHiddenState_: function() {
493 $('app-launcher-promo').hidden = 486 $('app-launcher-promo').hidden =
494 !loadTimeData.getBoolean('showAppLauncherPromo') || 487 !loadTimeData.getBoolean('showAppLauncherPromo');
495 this.shownPage != loadTimeData.getInteger('apps_page_id');
496 }, 488 },
497 489
498 /** 490 /**
499 * Invoked whenever the pages in apps-page-list have changed so that 491 * Invoked whenever the pages in apps-page-list have changed so that
500 * the Slider knows about the new elements. 492 * the Slider knows about the new elements.
501 */ 493 */
502 updateSliderCards: function() { 494 updateSliderCards: function() {
503 var pageNo = Math.max(0, Math.min(this.cardSlider.currentCard, 495 var pageNo = Math.max(0, Math.min(this.cardSlider.currentCard,
504 this.tilePages.length - 1)); 496 this.tilePages.length - 1));
505 this.cardSlider.setCards(Array.prototype.slice.call(this.tilePages), 497 this.cardSlider.setCards(Array.prototype.slice.call(this.tilePages),
506 pageNo); 498 pageNo);
507 if (this.shownPage == loadTimeData.getInteger('apps_page_id') && 499 if (loadTimeData.getBoolean('showApps')) {
Dan Beam 2016/03/02 00:02:53 yeah, I know, this is probably never false...
Evan Stade 2016/03/03 19:59:53 todo?
Dan Beam 2016/03/03 21:09:41 Done. (previously)
508 loadTimeData.getBoolean('showApps')) {
509 this.cardSlider.selectCardByValue( 500 this.cardSlider.selectCardByValue(
510 this.appsPages[Math.min(this.shownPageIndex, 501 this.appsPages[Math.min(this.shownPageIndex,
511 this.appsPages.length - 1)]); 502 this.appsPages.length - 1)]);
512 } 503 }
513 }, 504 },
514 505
515 /** 506 /**
516 * Called whenever tiles should be re-arranging themselves out of the way 507 * Called whenever tiles should be re-arranging themselves out of the way
517 * of a moving or insert tile. 508 * of a moving or insert tile.
518 */ 509 */
(...skipping 106 matching lines...) Expand 10 before | Expand all | Expand 10 after
625 * Handler for cardSlider:card_changed events from this.cardSlider. 616 * Handler for cardSlider:card_changed events from this.cardSlider.
626 * @param {Event} e The cardSlider:card_changed event. 617 * @param {Event} e The cardSlider:card_changed event.
627 * @private 618 * @private
628 */ 619 */
629 onCardChanged_: function(e) { 620 onCardChanged_: function(e) {
630 var page = e.cardSlider.currentCardValue; 621 var page = e.cardSlider.currentCardValue;
631 622
632 // Don't change shownPage until startup is done (and page changes actually 623 // Don't change shownPage until startup is done (and page changes actually
633 // reflect user actions). 624 // reflect user actions).
634 if (!this.isStartingUp_()) { 625 if (!this.isStartingUp_()) {
635 if (page.classList.contains('apps-page')) { 626 if (page.classList.contains('apps-page'))
Dan Beam 2016/03/02 00:02:53 and this is probably never false either...
Evan Stade 2016/03/03 19:59:53 todo
Dan Beam 2016/03/03 21:09:41 Done.
636 this.setShownPage_(loadTimeData.getInteger('apps_page_id'), 627 this.setShownPage_(this.getAppsPageIndex(page));
637 this.getAppsPageIndex(page)); 628 else
638 } else {
639 console.error('unknown page selected'); 629 console.error('unknown page selected');
640 }
641 } 630 }
642 631
643 // Update the active dot 632 // Update the active dot
644 var curDot = this.dotList.getElementsByClassName('selected')[0]; 633 var curDot = this.dotList.getElementsByClassName('selected')[0];
645 if (curDot) 634 if (curDot)
646 curDot.classList.remove('selected'); 635 curDot.classList.remove('selected');
647 page.navigationDot.classList.add('selected'); 636 page.navigationDot.classList.add('selected');
648 this.updatePageSwitchers(); 637 this.updatePageSwitchers();
649 }, 638 },
650 639
651 /** 640 /**
652 * Saves/updates the newly selected page to open when first loading the NTP. 641 * Saves/updates the newly selected page to open when first loading the NTP.
653 * @param {number} shownPage The new shown page type.
654 * @param {number} shownPageIndex The new shown page index. 642 * @param {number} shownPageIndex The new shown page index.
655 * @private 643 * @private
656 */ 644 */
657 setShownPage_: function(shownPage, shownPageIndex) { 645 setShownPage_: function(shownPageIndex) {
658 assert(shownPageIndex >= 0); 646 assert(shownPageIndex >= 0);
659 this.shownPage = shownPage;
660 this.shownPageIndex = shownPageIndex; 647 this.shownPageIndex = shownPageIndex;
661 chrome.send('pageSelected', [this.shownPage, this.shownPageIndex]); 648 chrome.send('pageSelected', [this.shownPageIndex]);
662 this.updateAppLauncherPromoHiddenState_(); 649 this.updateAppLauncherPromoHiddenState_();
663 }, 650 },
664 651
665 /** 652 /**
666 * Listen for card additions to update the page switchers or the current 653 * Listen for card additions to update the page switchers or the current
667 * card accordingly. 654 * card accordingly.
668 * @param {Event} e A card removed or added event. 655 * @param {Event} e A card removed or added event.
669 */ 656 */
670 onCardAdded_: function(e) { 657 onCardAdded_: function(e) {
671 // When the second arg passed to insertBefore is falsey, it acts just like 658 // When the second arg passed to insertBefore is falsey, it acts just like
(...skipping 106 matching lines...) Expand 10 before | Expand all | Expand 10 after
778 if (page.navigationDot) 765 if (page.navigationDot)
779 page.navigationDot.remove(opt_animate); 766 page.navigationDot.remove(opt_animate);
780 this.cardSlider.removeCard(page); 767 this.cardSlider.removeCard(page);
781 }, 768 },
782 }; 769 };
783 770
784 return { 771 return {
785 PageListView: PageListView 772 PageListView: PageListView
786 }; 773 };
787 }); 774 });
OLDNEW
« no previous file with comments | « no previous file | chrome/browser/ui/webui/ntp/app_launcher_handler.h » ('j') | chrome/browser/ui/webui/ntp/app_launcher_handler.cc » ('J')

Powered by Google App Engine
This is Rietveld 408576698