OLD | NEW |
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 68 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
79 */ | 79 */ |
80 tilePages: undefined, | 80 tilePages: undefined, |
81 | 81 |
82 /** | 82 /** |
83 * A list of all 'apps-page' elements. | 83 * A list of all 'apps-page' elements. |
84 * @type {!NodeList|undefined} | 84 * @type {!NodeList|undefined} |
85 */ | 85 */ |
86 appsPages: undefined, | 86 appsPages: undefined, |
87 | 87 |
88 /** | 88 /** |
| 89 * The Most Visited page. |
| 90 * @type {!Element|undefined} |
| 91 */ |
| 92 mostVisitedPage: undefined, |
| 93 |
| 94 /** |
89 * The 'dots-list' element. | 95 * The 'dots-list' element. |
90 * @type {!Element|undefined} | 96 * @type {!Element|undefined} |
91 */ | 97 */ |
92 dotList: undefined, | 98 dotList: undefined, |
93 | 99 |
94 /** | 100 /** |
95 * The left and right paging buttons. | 101 * The left and right paging buttons. |
96 * @type {!ntp.PageSwitcher|undefined} | 102 * @type {!ntp.PageSwitcher|undefined} |
97 */ | 103 */ |
98 pageSwitcherStart: undefined, | 104 pageSwitcherStart: undefined, |
(...skipping 62 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
161 if (this.pageSwitcherStart) | 167 if (this.pageSwitcherStart) |
162 ntp.initializePageSwitcher(this.pageSwitcherStart); | 168 ntp.initializePageSwitcher(this.pageSwitcherStart); |
163 | 169 |
164 this.pageSwitcherEnd = opt_pageSwitcherEnd; | 170 this.pageSwitcherEnd = opt_pageSwitcherEnd; |
165 if (this.pageSwitcherEnd) | 171 if (this.pageSwitcherEnd) |
166 ntp.initializePageSwitcher(this.pageSwitcherEnd); | 172 ntp.initializePageSwitcher(this.pageSwitcherEnd); |
167 | 173 |
168 this.shownPage = loadTimeData.getInteger('shown_page_type'); | 174 this.shownPage = loadTimeData.getInteger('shown_page_type'); |
169 this.shownPageIndex = loadTimeData.getInteger('shown_page_index'); | 175 this.shownPageIndex = loadTimeData.getInteger('shown_page_index'); |
170 | 176 |
171 // TODO(dbeam): remove showApps and everything that says if (apps). | 177 if (loadTimeData.getBoolean('showApps')) { |
172 assert(loadTimeData.getBoolean('showApps')); | 178 // Request data on the apps so we can fill them in. |
| 179 // Note that this is kicked off asynchronously. 'getAppsCallback' will |
| 180 // be invoked at some point after this function returns. |
| 181 chrome.send('getApps'); |
| 182 } else { |
| 183 // No apps page. |
| 184 if (this.shownPage == loadTimeData.getInteger('apps_page_id')) { |
| 185 this.setShownPage_( |
| 186 loadTimeData.getInteger('most_visited_page_id'), 0); |
| 187 } |
173 | 188 |
174 // Request data on the apps so we can fill them in. | 189 document.body.classList.add('bare-minimum'); |
175 // Note that this is kicked off asynchronously. 'getAppsCallback' will | 190 } |
176 // be invoked at some point after this function returns. | |
177 chrome.send('getApps'); | |
178 | 191 |
179 document.addEventListener('keydown', this.onDocKeyDown_.bind(this)); | 192 document.addEventListener('keydown', this.onDocKeyDown_.bind(this)); |
180 | 193 |
181 this.tilePages = this.pageList.getElementsByClassName('tile-page'); | 194 this.tilePages = this.pageList.getElementsByClassName('tile-page'); |
182 this.appsPages = this.pageList.getElementsByClassName('apps-page'); | 195 this.appsPages = this.pageList.getElementsByClassName('apps-page'); |
183 | 196 |
184 // Initialize the cardSlider without any cards at the moment. | 197 // Initialize the cardSlider without any cards at the moment. |
185 this.sliderFrame = cardSliderFrame; | 198 this.sliderFrame = cardSliderFrame; |
186 this.cardSlider = new cr.ui.CardSlider(this.sliderFrame, this.pageList, | 199 this.cardSlider = new cr.ui.CardSlider(this.sliderFrame, this.pageList, |
187 this.sliderFrame.offsetWidth); | 200 this.sliderFrame.offsetWidth); |
(...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
239 * the page list. | 252 * the page list. |
240 */ | 253 */ |
241 appendTilePage: function(page, title, titleIsEditable, opt_refNode) { | 254 appendTilePage: function(page, title, titleIsEditable, opt_refNode) { |
242 if (opt_refNode) { | 255 if (opt_refNode) { |
243 var refIndex = this.getTilePageIndex(opt_refNode); | 256 var refIndex = this.getTilePageIndex(opt_refNode); |
244 this.cardSlider.addCardAtIndex(page, refIndex); | 257 this.cardSlider.addCardAtIndex(page, refIndex); |
245 } else { | 258 } else { |
246 this.cardSlider.appendCard(page); | 259 this.cardSlider.appendCard(page); |
247 } | 260 } |
248 | 261 |
| 262 // Remember special MostVisitedPage. |
| 263 if (typeof ntp.MostVisitedPage != 'undefined' && |
| 264 page instanceof ntp.MostVisitedPage) { |
| 265 assert(this.tilePages.length == 1, |
| 266 'MostVisitedPage should be added as first tile page'); |
| 267 this.mostVisitedPage = page; |
| 268 } |
| 269 |
249 // If we're appending an AppsPage and it's a temporary page, animate it. | 270 // If we're appending an AppsPage and it's a temporary page, animate it. |
250 var animate = page instanceof ntp.AppsPage && | 271 var animate = page instanceof ntp.AppsPage && |
251 page.classList.contains('temporary'); | 272 page.classList.contains('temporary'); |
252 // Make a deep copy of the dot template to add a new one. | 273 // Make a deep copy of the dot template to add a new one. |
253 var newDot = new ntp.NavDot(page, title, titleIsEditable, animate); | 274 var newDot = new ntp.NavDot(page, title, titleIsEditable, animate); |
254 page.navigationDot = newDot; | 275 page.navigationDot = newDot; |
255 this.dotList.insertBefore(newDot, | 276 this.dotList.insertBefore(newDot, |
256 opt_refNode ? opt_refNode.navigationDot : null); | 277 opt_refNode ? opt_refNode.navigationDot : null); |
257 // Set a tab index on the first dot. | 278 // Set a tab index on the first dot. |
258 if (this.dotList.dots.length == 1) | 279 if (this.dotList.dots.length == 1) |
(...skipping 202 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
461 * @param {Object} data An object with all the data on available | 482 * @param {Object} data An object with all the data on available |
462 * applications. | 483 * applications. |
463 */ | 484 */ |
464 appsPrefChangedCallback: function(data) { | 485 appsPrefChangedCallback: function(data) { |
465 assert(loadTimeData.getBoolean('showApps')); | 486 assert(loadTimeData.getBoolean('showApps')); |
466 | 487 |
467 for (var i = 0; i < data.apps.length; ++i) { | 488 for (var i = 0; i < data.apps.length; ++i) { |
468 $(data.apps[i].id).appData = data.apps[i]; | 489 $(data.apps[i].id).appData = data.apps[i]; |
469 } | 490 } |
470 | 491 |
471 // Set the App dot names. | 492 // Set the App dot names. Skip the first dot (Most Visited). |
472 var dots = this.dotList.getElementsByClassName('dot'); | 493 var dots = this.dotList.getElementsByClassName('dot'); |
473 for (var i = 0; i < dots.length; ++i) { | 494 var start = this.mostVisitedPage ? 1 : 0; |
474 dots[i].displayTitle = data.appPageNames[i] || ''; | 495 for (var i = start; i < dots.length; ++i) { |
| 496 dots[i].displayTitle = data.appPageNames[i - start] || ''; |
475 } | 497 } |
476 }, | 498 }, |
477 | 499 |
478 /** | 500 /** |
479 * Callback invoked by chrome whenever the app launcher promo pref changes. | 501 * Callback invoked by chrome whenever the app launcher promo pref changes. |
480 * @param {boolean} show Identifies if we should show or hide the promo. | 502 * @param {boolean} show Identifies if we should show or hide the promo. |
481 */ | 503 */ |
482 appLauncherPromoPrefChangeCallback: function(show) { | 504 appLauncherPromoPrefChangeCallback: function(show) { |
483 loadTimeData.overrideValues({showAppLauncherPromo: show}); | 505 loadTimeData.overrideValues({showAppLauncherPromo: show}); |
484 this.updateAppLauncherPromoHiddenState_(); | 506 this.updateAppLauncherPromoHiddenState_(); |
(...skipping 11 matching lines...) Expand all Loading... |
496 | 518 |
497 /** | 519 /** |
498 * Invoked whenever the pages in apps-page-list have changed so that | 520 * Invoked whenever the pages in apps-page-list have changed so that |
499 * the Slider knows about the new elements. | 521 * the Slider knows about the new elements. |
500 */ | 522 */ |
501 updateSliderCards: function() { | 523 updateSliderCards: function() { |
502 var pageNo = Math.max(0, Math.min(this.cardSlider.currentCard, | 524 var pageNo = Math.max(0, Math.min(this.cardSlider.currentCard, |
503 this.tilePages.length - 1)); | 525 this.tilePages.length - 1)); |
504 this.cardSlider.setCards(Array.prototype.slice.call(this.tilePages), | 526 this.cardSlider.setCards(Array.prototype.slice.call(this.tilePages), |
505 pageNo); | 527 pageNo); |
| 528 if (this.shownPage == loadTimeData.getInteger('most_visited_page_id')) { |
| 529 if (this.mostVisitedPage) |
| 530 this.cardSlider.selectCardByValue(this.mostVisitedPage); |
| 531 else |
| 532 this.shownPage = loadTimeData.getInteger('apps_page_id'); |
| 533 } |
506 if (this.shownPage == loadTimeData.getInteger('apps_page_id') && | 534 if (this.shownPage == loadTimeData.getInteger('apps_page_id') && |
507 loadTimeData.getBoolean('showApps')) { | 535 loadTimeData.getBoolean('showApps')) { |
508 this.cardSlider.selectCardByValue( | 536 this.cardSlider.selectCardByValue( |
509 this.appsPages[Math.min(this.shownPageIndex, | 537 this.appsPages[Math.min(this.shownPageIndex, |
510 this.appsPages.length - 1)]); | 538 this.appsPages.length - 1)]); |
| 539 } else if (this.mostVisitedPage) { |
| 540 this.shownPage = loadTimeData.getInteger('most_visited_page_id'); |
| 541 this.cardSlider.selectCardByValue(this.mostVisitedPage); |
511 } | 542 } |
512 }, | 543 }, |
513 | 544 |
514 /** | 545 /** |
515 * Called whenever tiles should be re-arranging themselves out of the way | 546 * Called whenever tiles should be re-arranging themselves out of the way |
516 * of a moving or insert tile. | 547 * of a moving or insert tile. |
517 */ | 548 */ |
518 enterRearrangeMode: function() { | 549 enterRearrangeMode: function() { |
519 if (loadTimeData.getBoolean('showApps')) { | 550 if (loadTimeData.getBoolean('showApps')) { |
520 var tempPage = new ntp.AppsPage(); | 551 var tempPage = new ntp.AppsPage(); |
(...skipping 106 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
627 */ | 658 */ |
628 onCardChanged_: function(e) { | 659 onCardChanged_: function(e) { |
629 var page = e.cardSlider.currentCardValue; | 660 var page = e.cardSlider.currentCardValue; |
630 | 661 |
631 // Don't change shownPage until startup is done (and page changes actually | 662 // Don't change shownPage until startup is done (and page changes actually |
632 // reflect user actions). | 663 // reflect user actions). |
633 if (!this.isStartingUp_()) { | 664 if (!this.isStartingUp_()) { |
634 if (page.classList.contains('apps-page')) { | 665 if (page.classList.contains('apps-page')) { |
635 this.setShownPage_(loadTimeData.getInteger('apps_page_id'), | 666 this.setShownPage_(loadTimeData.getInteger('apps_page_id'), |
636 this.getAppsPageIndex(page)); | 667 this.getAppsPageIndex(page)); |
| 668 } else if (page.classList.contains('most-visited-page')) { |
| 669 this.setShownPage_( |
| 670 loadTimeData.getInteger('most_visited_page_id'), 0); |
637 } else { | 671 } else { |
638 console.error('unknown page selected'); | 672 console.error('unknown page selected'); |
639 } | 673 } |
640 } | 674 } |
641 | 675 |
642 // Update the active dot | 676 // Update the active dot |
643 var curDot = this.dotList.getElementsByClassName('selected')[0]; | 677 var curDot = this.dotList.getElementsByClassName('selected')[0]; |
644 if (curDot) | 678 if (curDot) |
645 curDot.classList.remove('selected'); | 679 curDot.classList.remove('selected'); |
646 page.navigationDot.classList.add('selected'); | 680 page.navigationDot.classList.add('selected'); |
(...skipping 130 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
777 if (page.navigationDot) | 811 if (page.navigationDot) |
778 page.navigationDot.remove(opt_animate); | 812 page.navigationDot.remove(opt_animate); |
779 this.cardSlider.removeCard(page); | 813 this.cardSlider.removeCard(page); |
780 }, | 814 }, |
781 }; | 815 }; |
782 | 816 |
783 return { | 817 return { |
784 PageListView: PageListView | 818 PageListView: PageListView |
785 }; | 819 }; |
786 }); | 820 }); |
OLD | NEW |