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

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

Issue 1129903008: NTP Zombie Code Slayer Part IV: Most Visited (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: android fix Created 5 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 (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 New tab page 6 * @fileoverview New tab page
7 * This is the main code for the new tab page used by touch-enabled Chrome 7 * This is the main code for the new tab page used by touch-enabled Chrome
8 * browsers. For now this is still a prototype. 8 * browsers. For now this is still a prototype.
9 */ 9 */
10 10
11 /**
12 * @typedef {{direction: string,
13 * filler: (boolean|undefined),
14 * title: string,
15 * url: string}}
16 * @see chrome/browser/ui/webui/ntp/most_visited_handler.cc
17 */
18 var PageData;
19
20 // Use an anonymous function to enable strict mode just for this file (which 11 // Use an anonymous function to enable strict mode just for this file (which
21 // will be concatenated with other files when embedded in Chrome 12 // will be concatenated with other files when embedded in Chrome
22 cr.define('ntp', function() { 13 cr.define('ntp', function() {
23 'use strict'; 14 'use strict';
24 15
25 /** 16 /**
26 * NewTabView instance. 17 * NewTabView instance.
27 * @type {!Object|undefined} 18 * @type {!Object|undefined}
28 */ 19 */
29 var newTabView; 20 var newTabView;
(...skipping 83 matching lines...) Expand 10 before | Expand all | Expand 10 after
113 if (promoBubble) 104 if (promoBubble)
114 window.setTimeout(promoBubble.reposition.bind(promoBubble), 0); 105 window.setTimeout(promoBubble.reposition.bind(promoBubble), 0);
115 } 106 }
116 }; 107 };
117 108
118 /** 109 /**
119 * Invoked at startup once the DOM is available to initialize the app. 110 * Invoked at startup once the DOM is available to initialize the app.
120 */ 111 */
121 function onLoad() { 112 function onLoad() {
122 sectionsToWaitFor = 0; 113 sectionsToWaitFor = 0;
123 if (loadTimeData.getBoolean('showMostvisited'))
124 sectionsToWaitFor++;
125 if (loadTimeData.getBoolean('showApps')) { 114 if (loadTimeData.getBoolean('showApps')) {
126 sectionsToWaitFor++; 115 sectionsToWaitFor++;
127 if (loadTimeData.getBoolean('showAppLauncherPromo')) { 116 if (loadTimeData.getBoolean('showAppLauncherPromo')) {
128 $('app-launcher-promo-close-button').addEventListener('click', 117 $('app-launcher-promo-close-button').addEventListener('click',
129 function() { chrome.send('stopShowingAppLauncherPromo'); }); 118 function() { chrome.send('stopShowingAppLauncherPromo'); });
130 $('apps-promo-learn-more').addEventListener('click', 119 $('apps-promo-learn-more').addEventListener('click',
131 function() { chrome.send('onLearnMore'); }); 120 function() { chrome.send('onLearnMore'); });
132 } 121 }
133 } 122 }
134 measureNavDots(); 123 measureNavDots();
135 124
136 // Load the current theme colors. 125 // Load the current theme colors.
137 themeChanged(); 126 themeChanged();
138 127
139 newTabView = new NewTabView(); 128 newTabView = new NewTabView();
140 129
141 notificationContainer = getRequiredElement('notification-container'); 130 notificationContainer = getRequiredElement('notification-container');
142 notificationContainer.addEventListener( 131 notificationContainer.addEventListener(
143 'webkitTransitionEnd', onNotificationTransitionEnd); 132 'webkitTransitionEnd', onNotificationTransitionEnd);
144 133
145 if (loadTimeData.getBoolean('showMostvisited')) {
146 var mostVisited = new ntp.MostVisitedPage();
147 // Move the footer into the most visited page if we are in "bare minimum"
148 // mode.
149 if (document.body.classList.contains('bare-minimum'))
150 mostVisited.appendFooter(getRequiredElement('footer'));
151 newTabView.appendTilePage(mostVisited,
152 loadTimeData.getString('mostvisited'),
153 false);
154 chrome.send('getMostVisited');
155 }
156
157 if (!loadTimeData.getBoolean('showWebStoreIcon')) { 134 if (!loadTimeData.getBoolean('showWebStoreIcon')) {
158 var webStoreIcon = $('chrome-web-store-link'); 135 var webStoreIcon = $('chrome-web-store-link');
159 // Not all versions of the NTP have a footer, so this may not exist. 136 // Not all versions of the NTP have a footer, so this may not exist.
160 if (webStoreIcon) 137 if (webStoreIcon)
161 webStoreIcon.hidden = true; 138 webStoreIcon.hidden = true;
162 } else { 139 } else {
163 var webStoreLink = loadTimeData.getString('webStoreLink'); 140 var webStoreLink = loadTimeData.getString('webStoreLink');
164 var url = appendParam(webStoreLink, 'utm_source', 'chrome-ntp-launcher'); 141 var url = appendParam(webStoreLink, 'utm_source', 'chrome-ntp-launcher');
165 $('chrome-web-store-link').href = url; 142 $('chrome-web-store-link').href = url;
166 $('chrome-web-store-link').addEventListener('click', 143 $('chrome-web-store-link').addEventListener('click',
(...skipping 152 matching lines...) Expand 10 before | Expand all | Expand 10 after
319 measuringDiv.textContent = loadTimeData.getString(id); 296 measuringDiv.textContent = loadTimeData.getString(id);
320 // The 4 is for border and padding. 297 // The 4 is for border and padding.
321 return Math.max(measuringDiv.clientWidth * 1.15 + 4, 80); 298 return Math.max(measuringDiv.clientWidth * 1.15 + 4, 80);
322 } 299 }
323 300
324 /** 301 /**
325 * Fills in an invisible div with the longest dot title string so that 302 * Fills in an invisible div with the longest dot title string so that
326 * its length may be measured and the nav dots sized accordingly. 303 * its length may be measured and the nav dots sized accordingly.
327 */ 304 */
328 function measureNavDots() { 305 function measureNavDots() {
329 var pxWidth = measureNavDot('appDefaultPageName');
330 if (loadTimeData.getBoolean('showMostvisited'))
331 pxWidth = Math.max(measureNavDot('mostvisited'), pxWidth);
332
333 var styleElement = document.createElement('style'); 306 var styleElement = document.createElement('style');
334 styleElement.type = 'text/css'; 307 styleElement.type = 'text/css';
335 // max-width is used because if we run out of space, the nav dots will be 308 // max-width is used because if we run out of space, the nav dots will be
336 // shrunk. 309 // shrunk.
310 var pxWidth = measureNavDot('appDefaultPageName');
337 styleElement.textContent = '.dot { max-width: ' + pxWidth + 'px; }'; 311 styleElement.textContent = '.dot { max-width: ' + pxWidth + 'px; }';
338 document.querySelector('head').appendChild(styleElement); 312 document.querySelector('head').appendChild(styleElement);
339 } 313 }
340 314
341 /** 315 /**
342 * Layout the footer so that the nav dots stay centered. 316 * Layout the footer so that the nav dots stay centered.
343 */ 317 */
344 function layoutFooter() { 318 function layoutFooter() {
345 // We need the image to be loaded. 319 // We need the image to be loaded.
346 var logo = $('logo-img'); 320 var logo = $('logo-img');
(...skipping 153 matching lines...) Expand 10 before | Expand all | Expand 10 after
500 * When done fading out, set hidden to true so the notification can't be 474 * When done fading out, set hidden to true so the notification can't be
501 * tabbed to or clicked. 475 * tabbed to or clicked.
502 * @param {Event} e The webkitTransitionEnd event. 476 * @param {Event} e The webkitTransitionEnd event.
503 */ 477 */
504 function onNotificationTransitionEnd(e) { 478 function onNotificationTransitionEnd(e) {
505 if (notificationContainer.classList.contains('inactive')) 479 if (notificationContainer.classList.contains('inactive'))
506 notificationContainer.hidden = true; 480 notificationContainer.hidden = true;
507 } 481 }
508 482
509 /** 483 /**
510 * @param {Array<PageData>} data
511 * @param {boolean} hasBlacklistedUrls
512 */
513 function setMostVisitedPages(data, hasBlacklistedUrls) {
514 newTabView.mostVisitedPage.data = data;
515 cr.dispatchSimpleEvent(document, 'sectionready', true, true);
516 }
517
518 /**
519 * Set the dominant color for a node. This will be called in response to 484 * Set the dominant color for a node. This will be called in response to
520 * getFaviconDominantColor. The node represented by |id| better have a setter 485 * getFaviconDominantColor. The node represented by |id| better have a setter
521 * for stripeColor. 486 * for stripeColor.
522 * @param {string} id The ID of a node. 487 * @param {string} id The ID of a node.
523 * @param {string} color The color represented as a CSS string. 488 * @param {string} color The color represented as a CSS string.
524 */ 489 */
525 function setFaviconDominantColor(id, color) { 490 function setFaviconDominantColor(id, color) {
526 var node = $(id); 491 var node = $(id);
527 if (node) 492 if (node)
528 node.stripeColor = color; 493 node.stripeColor = color;
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
567 * Show the sync login UI. 532 * Show the sync login UI.
568 * @param {Event} e The click event. 533 * @param {Event} e The click event.
569 */ 534 */
570 function showSyncLoginUI(e) { 535 function showSyncLoginUI(e) {
571 var rect = e.currentTarget.getBoundingClientRect(); 536 var rect = e.currentTarget.getBoundingClientRect();
572 chrome.send('showSyncLoginUI', 537 chrome.send('showSyncLoginUI',
573 [rect.left, rect.top, rect.width, rect.height]); 538 [rect.left, rect.top, rect.width, rect.height]);
574 } 539 }
575 540
576 /** 541 /**
577 * Logs the time to click for the specified item.
578 * @param {string} item The item to log the time-to-click.
579 */
580 function logTimeToClick(item) {
581 var timeToClick = Date.now() - startTime;
582 chrome.send('logTimeToClick',
583 ['NewTabPage.TimeToClick' + item, timeToClick]);
584 }
585
586 /**
587 * Wrappers to forward the callback to corresponding PageListView member. 542 * Wrappers to forward the callback to corresponding PageListView member.
588 */ 543 */
589 544
590 /** 545 /**
591 * Called by chrome when a new app has been added to chrome or has been 546 * Called by chrome when a new app has been added to chrome or has been
592 * enabled if previously disabled. 547 * enabled if previously disabled.
593 * @param {Object} appData A data structure full of relevant information for 548 * @param {Object} appData A data structure full of relevant information for
594 * the app. 549 * the app.
595 * @param {boolean=} opt_highlight Whether the app about to be added should 550 * @param {boolean=} opt_highlight Whether the app about to be added should
596 * be highlighted. 551 * be highlighted.
(...skipping 102 matching lines...) Expand 10 before | Expand all | Expand 10 after
699 appMoved: appMoved, 654 appMoved: appMoved,
700 appRemoved: appRemoved, 655 appRemoved: appRemoved,
701 appsPrefChangeCallback: appsPrefChangeCallback, 656 appsPrefChangeCallback: appsPrefChangeCallback,
702 appLauncherPromoPrefChangeCallback: appLauncherPromoPrefChangeCallback, 657 appLauncherPromoPrefChangeCallback: appLauncherPromoPrefChangeCallback,
703 enterRearrangeMode: enterRearrangeMode, 658 enterRearrangeMode: enterRearrangeMode,
704 getAppsCallback: getAppsCallback, 659 getAppsCallback: getAppsCallback,
705 getAppsPageIndex: getAppsPageIndex, 660 getAppsPageIndex: getAppsPageIndex,
706 getCardSlider: getCardSlider, 661 getCardSlider: getCardSlider,
707 onLoad: onLoad, 662 onLoad: onLoad,
708 leaveRearrangeMode: leaveRearrangeMode, 663 leaveRearrangeMode: leaveRearrangeMode,
709 logTimeToClick: logTimeToClick,
710 NtpFollowAction: NtpFollowAction, 664 NtpFollowAction: NtpFollowAction,
711 saveAppPageName: saveAppPageName, 665 saveAppPageName: saveAppPageName,
712 setAppToBeHighlighted: setAppToBeHighlighted, 666 setAppToBeHighlighted: setAppToBeHighlighted,
713 setBookmarkBarAttached: setBookmarkBarAttached, 667 setBookmarkBarAttached: setBookmarkBarAttached,
714 setMostVisitedPages: setMostVisitedPages,
715 setFaviconDominantColor: setFaviconDominantColor, 668 setFaviconDominantColor: setFaviconDominantColor,
716 showNotification: showNotification, 669 showNotification: showNotification,
717 themeChanged: themeChanged, 670 themeChanged: themeChanged,
718 updateLogin: updateLogin 671 updateLogin: updateLogin
719 }; 672 };
720 }); 673 });
721 674
722 document.addEventListener('DOMContentLoaded', ntp.onLoad); 675 document.addEventListener('DOMContentLoaded', ntp.onLoad);
723 676
724 var toCssPx = cr.ui.toCssPx; 677 var toCssPx = cr.ui.toCssPx;
OLDNEW
« no previous file with comments | « chrome/browser/resources/ntp4/new_tab.html ('k') | chrome/browser/resources/ntp4/new_tab_theme.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698