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

Side by Side Diff: chrome/browser/resources/local_ntp/local_ntp.js

Issue 447243003: [Local NTP] Adding NtpDesign class to parametrizing NTP design specs (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Making titleTextAlign optional; cleanups. Created 6 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 | Annotate | Revision Log
OLDNEW
1 // Copyright 2013 The Chromium Authors. All rights reserved. 1 // Copyright 2013 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 /** 6 /**
7 * @fileoverview The local InstantExtended NTP. 7 * @fileoverview The local InstantExtended NTP.
8 */ 8 */
9 9
10 10
11 /** 11 /**
12 * Controls rendering the new tab page for InstantExtended. 12 * Controls rendering the new tab page for InstantExtended.
13 * @return {Object} A limited interface for testing the local NTP. 13 * @return {Object} A limited interface for testing the local NTP.
14 */ 14 */
15 function LocalNTP() { 15 function LocalNTP() {
16 <include src="../../../../ui/webui/resources/js/assert.js"> 16 <include src="../../../../ui/webui/resources/js/assert.js">
17 <include src="local_ntp_design.js">
17 <include src="local_ntp_util.js"> 18 <include src="local_ntp_util.js">
18 <include src="window_disposition_util.js"> 19 <include src="window_disposition_util.js">
19 20
20 21
21 /** 22 /**
22 * Enum for classnames. 23 * Enum for classnames.
23 * @enum {string} 24 * @enum {string}
24 * @const 25 * @const
25 */ 26 */
26 var CLASSES = { 27 var CLASSES = {
(...skipping 68 matching lines...) Expand 10 before | Expand all | Expand 10 after
95 96
96 /** 97 /**
97 * The JavaScript button event value for a middle click. 98 * The JavaScript button event value for a middle click.
98 * @type {number} 99 * @type {number}
99 * @const 100 * @const
100 */ 101 */
101 var MIDDLE_MOUSE_BUTTON = 1; 102 var MIDDLE_MOUSE_BUTTON = 1;
102 103
103 104
104 /** 105 /**
106 * Specifications for the NTP design.
107 * @const {NtpDesign}
108 */
109 var NTP_DESIGN = getNtpDesign(configData.ntpDesignName);
110
111
112 /**
105 * The container for the tile elements. 113 * The container for the tile elements.
106 * @type {Element} 114 * @type {Element}
107 */ 115 */
108 var tilesContainer; 116 var tilesContainer;
109 117
110 118
111 /** 119 /**
112 * The notification displayed when a page is blacklisted. 120 * The notification displayed when a page is blacklisted.
113 * @type {Element} 121 * @type {Element}
114 */ 122 */
(...skipping 82 matching lines...) Expand 10 before | Expand all | Expand 10 after
197 var omniboxInputBehavior = NTP_DISPOSE_STATE.NONE; 205 var omniboxInputBehavior = NTP_DISPOSE_STATE.NONE;
198 206
199 207
200 /** 208 /**
201 * The state of the NTP when a query is entered into the Fakebox. 209 * The state of the NTP when a query is entered into the Fakebox.
202 * @type {NTP_DISPOSE_STATE} 210 * @type {NTP_DISPOSE_STATE}
203 */ 211 */
204 var fakeboxInputBehavior = NTP_DISPOSE_STATE.HIDE_FAKEBOX_AND_LOGO; 212 var fakeboxInputBehavior = NTP_DISPOSE_STATE.HIDE_FAKEBOX_AND_LOGO;
205 213
206 214
207 /**
208 * Total tile width. Should be equal to mv-tile's width + 2 * border-width.
209 * @private {number}
210 * @const
211 */
212 var TILE_WIDTH = 140;
213
214
215 /**
216 * Margin between tiles. Should be equal to mv-tile's total horizontal margin.
217 * @private {number}
218 * @const
219 */
220 var TILE_MARGIN = 20;
221
222
223 /** @type {number} @const */ 215 /** @type {number} @const */
224 var MAX_NUM_TILES_TO_SHOW = 8; 216 var MAX_NUM_TILES_TO_SHOW = 8;
225 217
226 218
227 /** @type {number} @const */ 219 /** @type {number} @const */
228 var MIN_NUM_COLUMNS = 2; 220 var MIN_NUM_COLUMNS = 2;
229 221
230 222
231 /** @type {number} @const */ 223 /** @type {number} @const */
232 var MAX_NUM_COLUMNS = 4; 224 var MAX_NUM_COLUMNS = 4;
(...skipping 22 matching lines...) Expand all
255 247
256 /** 248 /**
257 * The filename for a most visited iframe src which shows a thumbnail image. 249 * The filename for a most visited iframe src which shows a thumbnail image.
258 * @type {string} 250 * @type {string}
259 * @const 251 * @const
260 */ 252 */
261 var MOST_VISITED_THUMBNAIL_IFRAME = 'thumbnail.html'; 253 var MOST_VISITED_THUMBNAIL_IFRAME = 'thumbnail.html';
262 254
263 255
264 /** 256 /**
265 * The hex color for most visited tile elements.
266 * @type {string}
267 * @const
268 */
269 var MOST_VISITED_COLOR = '777777';
270
271
272 /**
273 * The font family for most visited tile elements.
274 * @type {string}
275 * @const
276 */
277 var MOST_VISITED_FONT_FAMILY = 'arial, sans-serif';
278
279
280 /**
281 * The font size for most visited tile elements.
282 * @type {number}
283 * @const
284 */
285 var MOST_VISITED_FONT_SIZE = 11;
286
287
288 /**
289 * Hide most visited tiles for at most this many milliseconds while painting. 257 * Hide most visited tiles for at most this many milliseconds while painting.
290 * @type {number} 258 * @type {number}
291 * @const 259 * @const
292 */ 260 */
293 var MOST_VISITED_PAINT_TIMEOUT_MSEC = 500; 261 var MOST_VISITED_PAINT_TIMEOUT_MSEC = 500;
294 262
295 263
296 /** 264 /**
297 * A Tile is either a rendering of a Most Visited page or "filler" used to 265 * A Tile is either a rendering of a Most Visited page or "filler" used to
298 * pad out the section when not enough pages exist. 266 * pad out the section when not enough pages exist.
(...skipping 64 matching lines...) Expand 10 before | Expand all | Expand 10 after
363 '}' + 331 '}' +
364 '#mv-notice-links span {' + 332 '#mv-notice-links span {' +
365 ' color: ' + convertToRGBAColor(opt_themeInfo.textColorLightRgba) + ';' + 333 ' color: ' + convertToRGBAColor(opt_themeInfo.textColorLightRgba) + ';' +
366 '}' + 334 '}' +
367 '#mv-notice-x {' + 335 '#mv-notice-x {' +
368 ' -webkit-filter: drop-shadow(0 0 0 ' + 336 ' -webkit-filter: drop-shadow(0 0 0 ' +
369 convertToRGBAColor(opt_themeInfo.textColorRgba) + ');' + 337 convertToRGBAColor(opt_themeInfo.textColorRgba) + ');' +
370 '}' + 338 '}' +
371 '.mv-page-ready {' + 339 '.mv-page-ready {' +
372 ' border: 1px solid ' + 340 ' border: 1px solid ' +
373 convertToRGBAColor(opt_themeInfo.sectionBorderColorRgba) + ';' + 341 convertToRGBAColor(opt_themeInfo.sectionBorderColorRgba) + ';' +
374 '}' + 342 '}' +
375 '.mv-page-ready:hover, .mv-page-ready:focus {' + 343 '.mv-page-ready:hover, .mv-page-ready:focus {' +
376 ' border-color: ' + 344 ' border-color: ' +
377 convertToRGBAColor(opt_themeInfo.headerColorRgba) + ';' + 345 convertToRGBAColor(opt_themeInfo.headerColorRgba) + ';' +
378 '}'; 346 '}';
379 347
380 if (customStyleElement) { 348 if (customStyleElement) {
381 customStyleElement.textContent = themeStyle; 349 customStyleElement.textContent = themeStyle;
382 } else { 350 } else {
383 customStyleElement = document.createElement('style'); 351 customStyleElement = document.createElement('style');
(...skipping 169 matching lines...) Expand 10 before | Expand all | Expand 10 after
553 for (var i = 0; i < numDesired; ++i) 521 for (var i = 0; i < numDesired; ++i)
554 tiles[i].elem.style.display = 'inline-block'; 522 tiles[i].elem.style.display = 'inline-block';
555 // If |numDesired| < |numExisting| then hide extra tiles (e.g., this occurs 523 // If |numDesired| < |numExisting| then hide extra tiles (e.g., this occurs
556 // when window is downsized). 524 // when window is downsized).
557 for (; i < numExisting; ++i) 525 for (; i < numExisting; ++i)
558 tiles[i].elem.style.display = 'none'; 526 tiles[i].elem.style.display = 'none';
559 } 527 }
560 528
561 529
562 /** 530 /**
563 * Builds a URL to display a most visited tile component in an iframe. 531 * Builds a URL to display a most visited tile title in an iframe.
564 * @param {string} filename The desired most visited component filename.
565 * @param {number} rid The restricted ID. 532 * @param {number} rid The restricted ID.
566 * @param {string} color The text color for text in the iframe.
567 * @param {string} fontFamily The font family for text in the iframe.
568 * @param {number} fontSize The font size for text in the iframe.
569 * @param {number} position The position of the iframe in the UI. 533 * @param {number} position The position of the iframe in the UI.
570 * @return {string} An URL to display the most visited component in an iframe. 534 * @return {string} An URL to display the most visited title in an iframe.
571 */ 535 */
572 function getMostVisitedIframeUrl(filename, rid, color, fontFamily, fontSize, 536 function getMostVisitedTitleIframeUrl(rid, position) {
573 position) { 537 var url = 'chrome-search://most-visited/' +
574 return 'chrome-search://most-visited/' + encodeURIComponent(filename) + '?' + 538 encodeURIComponent(MOST_VISITED_TITLE_IFRAME);
575 ['rid=' + encodeURIComponent(rid), 539 var params = [
576 'c=' + encodeURIComponent(color), 540 'rid=' + encodeURIComponent(rid),
Mathieu 2014/08/07 20:50:24 nit: proper indent here and below
huangs 2014/08/07 21:41:19 Done.
577 'f=' + encodeURIComponent(fontFamily), 541 'f=' + encodeURIComponent(NTP_DESIGN.fontFamily),
578 'fs=' + encodeURIComponent(fontSize), 542 'fs=' + encodeURIComponent(NTP_DESIGN.fontSize),
579 'pos=' + encodeURIComponent(position)].join('&'); 543 'c=' + encodeURIComponent(NTP_DESIGN.titleColor),
544 'pos=' + encodeURIComponent(position)];
545 if (NTP_DESIGN.titleTextAlign)
546 params.push('ta=' + encodeURIComponent(NTP_DESIGN.titleTextAlign));
547 if (NTP_DESIGN.titleTextFade)
548 params.push('tf=' + encodeURIComponent(NTP_DESIGN.titleTextFade));
549 return url + '?' + params.join('&');
580 } 550 }
581 551
582 552
553 /**
554 * Builds a URL to display a most visited tile thumbnail in an iframe.
555 * @param {number} rid The restricted ID.
556 * @param {number} position The position of the iframe in the UI.
557 * @return {string} An URL to display the most visited thumbnail in an iframe.
558 */
559 function getMostVisitedThumbnailIframeUrl(rid, position) {
560 var url = 'chrome-search://most-visited/' +
561 encodeURIComponent(MOST_VISITED_THUMBNAIL_IFRAME);
562 var params = [
563 'rid=' + encodeURIComponent(rid),
564 'f=' + encodeURIComponent(NTP_DESIGN.fontFamily),
565 'fs=' + encodeURIComponent(NTP_DESIGN.fontSize),
566 'c=' + encodeURIComponent(NTP_DESIGN.thumbnailTextColor),
567 'pos=' + encodeURIComponent(position)];
568 return url + '?' + params.join('&');
569 }
570
571
583 /** 572 /**
584 * Creates a Tile with the specified page data. If no data is provided, a 573 * Creates a Tile with the specified page data. If no data is provided, a
585 * filler Tile is created. 574 * filler Tile is created.
586 * @param {Object} page The page data. 575 * @param {Object} page The page data.
587 * @param {number} position The position of the tile. 576 * @param {number} position The position of the tile.
588 * @return {Tile} The new Tile. 577 * @return {Tile} The new Tile.
589 */ 578 */
590 function createTile(page, position) { 579 function createTile(page, position) {
591 var tileElement = document.createElement('div'); 580 var tileElement = document.createElement('div');
592 tileElement.classList.add(CLASSES.TILE); 581 tileElement.classList.add(CLASSES.TILE);
(...skipping 29 matching lines...) Expand all
622 // 611 //
623 // Giving iframes distinct ids seems to cause some invalidation and prevent 612 // Giving iframes distinct ids seems to cause some invalidation and prevent
624 // associating the incorrect data. 613 // associating the incorrect data.
625 // 614 //
626 // TODO(jered): Find and fix the root (probably Blink) bug. 615 // TODO(jered): Find and fix the root (probably Blink) bug.
627 616
628 // Keep this ID here. See comment above. 617 // Keep this ID here. See comment above.
629 titleElement.id = 'title-' + rid; 618 titleElement.id = 'title-' + rid;
630 titleElement.className = CLASSES.TITLE; 619 titleElement.className = CLASSES.TITLE;
631 titleElement.hidden = true; 620 titleElement.hidden = true;
632 titleElement.src = getMostVisitedIframeUrl( 621 titleElement.style.width = NTP_DESIGN.titleWidth + 'px';
Mathieu 2014/08/07 20:50:24 We should probably remove width and height in the
huangs 2014/08/07 21:41:18 Going to keep width and height to be set by CSS.
633 MOST_VISITED_TITLE_IFRAME, rid, MOST_VISITED_COLOR, 622 titleElement.style.height = NTP_DESIGN.titleHeight + 'px';
634 MOST_VISITED_FONT_FAMILY, MOST_VISITED_FONT_SIZE, position); 623 titleElement.src = getMostVisitedTitleIframeUrl(rid, position);
635 tileElement.appendChild(titleElement); 624 tileElement.appendChild(titleElement);
636 625
637 // The iframe which renders either a thumbnail or domain element. 626 // The iframe which renders either a thumbnail or domain element.
638 var thumbnailElement = document.createElement('iframe'); 627 var thumbnailElement = document.createElement('iframe');
639 thumbnailElement.tabIndex = '-1'; 628 thumbnailElement.tabIndex = '-1';
640 // Keep this ID here. See comment above. 629 // Keep this ID here. See comment above.
641 thumbnailElement.id = 'thumb-' + rid; 630 thumbnailElement.id = 'thumb-' + rid;
642 thumbnailElement.className = CLASSES.THUMBNAIL; 631 thumbnailElement.className = CLASSES.THUMBNAIL;
643 thumbnailElement.hidden = true; 632 thumbnailElement.hidden = true;
644 thumbnailElement.src = getMostVisitedIframeUrl( 633 thumbnailElement.style.width = NTP_DESIGN.thumbnailWidth + 'px';
645 MOST_VISITED_THUMBNAIL_IFRAME, rid, MOST_VISITED_COLOR, 634 thumbnailElement.style.height = NTP_DESIGN.thumbnailHeight + 'px';
646 MOST_VISITED_FONT_FAMILY, MOST_VISITED_FONT_SIZE, position); 635 thumbnailElement.src = getMostVisitedThumbnailIframeUrl(rid, position);
647 tileElement.appendChild(thumbnailElement); 636 tileElement.appendChild(thumbnailElement);
648 637
649 // A mask to darken the thumbnail on focus. 638 // A mask to darken the thumbnail on focus.
650 var maskElement = createAndAppendElement( 639 var maskElement = createAndAppendElement(
651 tileElement, 'div', CLASSES.THUMBNAIL_MASK); 640 tileElement, 'div', CLASSES.THUMBNAIL_MASK);
652 641
653 // The button used to blacklist this page. 642 // The button used to blacklist this page.
654 var blacklistButton = createAndAppendElement( 643 var blacklistButton = createAndAppendElement(
655 tileElement, 'div', CLASSES.BLACKLIST_BUTTON); 644 tileElement, 'div', CLASSES.BLACKLIST_BUTTON);
656 var blacklistFunction = generateBlacklistFunction(rid); 645 var blacklistFunction = generateBlacklistFunction(rid);
(...skipping 79 matching lines...) Expand 10 before | Expand all | Expand 10 after
736 ntpApiHandle.undoAllMostVisitedDeletions(); 725 ntpApiHandle.undoAllMostVisitedDeletions();
737 } 726 }
738 727
739 728
740 /** 729 /**
741 * Resizes elements because the number of tile columns may need to change in 730 * Resizes elements because the number of tile columns may need to change in
742 * response to resizing. Also shows or hides extra tiles tiles according to the 731 * response to resizing. Also shows or hides extra tiles tiles according to the
743 * new width of the page. 732 * new width of the page.
744 */ 733 */
745 function onResize() { 734 function onResize() {
735 var tileRequiredWidth = NTP_DESIGN.tileWidth + NTP_DESIGN.tileMargin;
746 // If innerWidth is zero, then use the maximum snap size. 736 // If innerWidth is zero, then use the maximum snap size.
737 var maxSnapSize = MAX_NUM_COLUMNS * tileRequiredWidth -
Mathieu 2014/08/07 20:50:24 not used? if so, bring back |tileRequiredWidth| c
huangs 2014/08/07 21:41:19 Nice catch! This was meant to replace the hard-co
738 NTP_DESIGN.tileMargin + MIN_TOTAL_HORIZONTAL_PADDING;
747 var innerWidth = window.innerWidth || 820; 739 var innerWidth = window.innerWidth || 820;
748 // Each tile has left and right margins that sum to TILE_MARGIN. 740 // Each tile has left and right margins that sum to NTP_DESIGN.tileMargin.
749 var tileRequiredWidth = TILE_WIDTH + TILE_MARGIN; 741 var availableWidth = innerWidth + NTP_DESIGN.tileMargin -
750 var availableWidth = innerWidth + TILE_MARGIN - MIN_TOTAL_HORIZONTAL_PADDING; 742 MIN_TOTAL_HORIZONTAL_PADDING;
751 var newNumColumns = Math.floor(availableWidth / tileRequiredWidth); 743 var newNumColumns = Math.floor(availableWidth / tileRequiredWidth);
752 if (newNumColumns < MIN_NUM_COLUMNS) 744 if (newNumColumns < MIN_NUM_COLUMNS)
753 newNumColumns = MIN_NUM_COLUMNS; 745 newNumColumns = MIN_NUM_COLUMNS;
754 else if (newNumColumns > MAX_NUM_COLUMNS) 746 else if (newNumColumns > MAX_NUM_COLUMNS)
755 newNumColumns = MAX_NUM_COLUMNS; 747 newNumColumns = MAX_NUM_COLUMNS;
756 748
757 if (numColumnsShown != newNumColumns) { 749 if (numColumnsShown != newNumColumns) {
758 numColumnsShown = newNumColumns; 750 numColumnsShown = newNumColumns;
759 var tilesContainerWidth = numColumnsShown * tileRequiredWidth; 751 var tilesContainerWidth = numColumnsShown * tileRequiredWidth;
760 tilesContainer.style.width = tilesContainerWidth + 'px'; 752 tilesContainer.style.width = tilesContainerWidth + 'px';
761 if (fakebox) // -2 to account for border. 753 if (fakebox) {
762 fakebox.style.width = (tilesContainerWidth - TILE_MARGIN - 2) + 'px'; 754 // -2 to account for border.
755 fakebox.style.width =
756 (tilesContainerWidth - NTP_DESIGN.tileMargin - 2) + 'px';
757 }
763 // Render without clearing tiles. 758 // Render without clearing tiles.
764 renderAndShowTiles(); 759 renderAndShowTiles();
765 } 760 }
766 } 761 }
767 762
768 763
769 /** 764 /**
770 * Returns the tile corresponding to the specified page RID. 765 * Returns the tile corresponding to the specified page RID.
771 * @param {number} rid The page RID being looked up. 766 * @param {number} rid The page RID being looked up.
772 * @return {Tile} The corresponding tile. 767 * @return {Tile} The corresponding tile.
(...skipping 159 matching lines...) Expand 10 before | Expand all | Expand 10 after
932 * Prepares the New Tab Page by adding listeners, rendering the current 927 * Prepares the New Tab Page by adding listeners, rendering the current
933 * theme, the most visited pages section, and Google-specific elements for a 928 * theme, the most visited pages section, and Google-specific elements for a
934 * Google-provided page. 929 * Google-provided page.
935 */ 930 */
936 function init() { 931 function init() {
937 tilesContainer = $(IDS.TILES); 932 tilesContainer = $(IDS.TILES);
938 notification = $(IDS.NOTIFICATION); 933 notification = $(IDS.NOTIFICATION);
939 attribution = $(IDS.ATTRIBUTION); 934 attribution = $(IDS.ATTRIBUTION);
940 ntpContents = $(IDS.NTP_CONTENTS); 935 ntpContents = $(IDS.NTP_CONTENTS);
941 936
937 NTP_DESIGN.classToAdd.forEach(function(v, idx) {
Mathieu 2014/08/07 20:50:24 reconsider this because we're already putting a cl
huangs 2014/08/07 21:41:19 Removed, since C++ code will take care of setting
938 ntpContents.classList.add(v);
939 });
940
942 if (configData.isGooglePage) { 941 if (configData.isGooglePage) {
943 var logo = document.createElement('div'); 942 var logo = document.createElement('div');
944 logo.id = IDS.LOGO; 943 logo.id = IDS.LOGO;
945 944
946 fakebox = document.createElement('div'); 945 fakebox = document.createElement('div');
947 fakebox.id = IDS.FAKEBOX; 946 fakebox.id = IDS.FAKEBOX;
948 fakebox.innerHTML = 947 fakebox.innerHTML =
949 '<input id="' + IDS.FAKEBOX_INPUT + 948 '<input id="' + IDS.FAKEBOX_INPUT +
950 '" autocomplete="off" tabindex="-1" aria-hidden="true">' + 949 '" autocomplete="off" tabindex="-1" aria-hidden="true">' +
951 '<div id="cursor"></div>'; 950 '<div id="cursor"></div>';
952 951
953 ntpContents.insertBefore(fakebox, ntpContents.firstChild); 952 ntpContents.insertBefore(fakebox, ntpContents.firstChild);
954 ntpContents.insertBefore(logo, ntpContents.firstChild); 953 ntpContents.insertBefore(logo, ntpContents.firstChild);
955 } else { 954 } else {
956 document.body.classList.add(CLASSES.NON_GOOGLE_PAGE); 955 document.body.classList.add(CLASSES.NON_GOOGLE_PAGE);
957 } 956 }
958 957
959 var notificationMessage = $(IDS.NOTIFICATION_MESSAGE); 958 var notificationMessage = $(IDS.NOTIFICATION_MESSAGE);
960 notificationMessage.textContent = 959 notificationMessage.textContent =
961 configData.translatedStrings.thumbnailRemovedNotification; 960 configData.translatedStrings.thumbnailRemovedNotification;
961
962 var undoLink = $(IDS.UNDO_LINK); 962 var undoLink = $(IDS.UNDO_LINK);
963 undoLink.addEventListener('click', onUndo); 963 undoLink.addEventListener('click', onUndo);
964 registerKeyHandler(undoLink, KEYCODE.ENTER, onUndo); 964 registerKeyHandler(undoLink, KEYCODE.ENTER, onUndo);
965 undoLink.textContent = configData.translatedStrings.undoThumbnailRemove; 965 undoLink.textContent = configData.translatedStrings.undoThumbnailRemove;
966
966 var restoreAllLink = $(IDS.RESTORE_ALL_LINK); 967 var restoreAllLink = $(IDS.RESTORE_ALL_LINK);
967 restoreAllLink.addEventListener('click', onRestoreAll); 968 restoreAllLink.addEventListener('click', onRestoreAll);
968 registerKeyHandler(restoreAllLink, KEYCODE.ENTER, onUndo); 969 registerKeyHandler(restoreAllLink, KEYCODE.ENTER, onUndo);
969 restoreAllLink.textContent = 970 restoreAllLink.textContent =
970 configData.translatedStrings.restoreThumbnailsShort; 971 configData.translatedStrings.restoreThumbnailsShort;
972
971 $(IDS.ATTRIBUTION_TEXT).textContent = 973 $(IDS.ATTRIBUTION_TEXT).textContent =
972 configData.translatedStrings.attributionIntro; 974 configData.translatedStrings.attributionIntro;
973 975
974 var notificationCloseButton = $(IDS.NOTIFICATION_CLOSE_BUTTON); 976 var notificationCloseButton = $(IDS.NOTIFICATION_CLOSE_BUTTON);
975 notificationCloseButton.addEventListener('click', hideNotification); 977 notificationCloseButton.addEventListener('click', hideNotification);
976 978
977 window.addEventListener('resize', onResize); 979 window.addEventListener('resize', onResize);
978 onResize(); 980 onResize();
979 981
980 var topLevelHandle = getEmbeddedSearchApiHandle(); 982 var topLevelHandle = getEmbeddedSearchApiHandle();
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
1025 setFakeboxDragFocus(false); 1027 setFakeboxDragFocus(false);
1026 }; 1028 };
1027 } 1029 }
1028 1030
1029 // Update the fakebox style to match the current key capturing state. 1031 // Update the fakebox style to match the current key capturing state.
1030 setFakeboxFocus(searchboxApiHandle.isKeyCaptureEnabled); 1032 setFakeboxFocus(searchboxApiHandle.isKeyCaptureEnabled);
1031 } 1033 }
1032 1034
1033 if (searchboxApiHandle.rtl) { 1035 if (searchboxApiHandle.rtl) {
1034 $(IDS.NOTIFICATION).dir = 'rtl'; 1036 $(IDS.NOTIFICATION).dir = 'rtl';
1037 document.body.setAttribute('dir', 'rtl');
1035 // Add class for setting alignments based on language directionality. 1038 // Add class for setting alignments based on language directionality.
1036 document.body.classList.add(CLASSES.RTL); 1039 document.body.classList.add(CLASSES.RTL);
1037 $(IDS.TILES).dir = 'rtl'; 1040 $(IDS.TILES).dir = 'rtl';
1038 } 1041 }
1039 } 1042 }
1040 1043
1041 1044
1042 /** 1045 /**
1043 * Binds event listeners. 1046 * Binds event listeners.
1044 */ 1047 */
1045 function listen() { 1048 function listen() {
1046 document.addEventListener('DOMContentLoaded', init); 1049 document.addEventListener('DOMContentLoaded', init);
1047 } 1050 }
1048 1051
1049 return { 1052 return {
1050 init: init, 1053 init: init,
1051 listen: listen 1054 listen: listen
1052 }; 1055 };
1053 } 1056 }
1054 1057
1055 if (!window.localNTPUnitTest) { 1058 if (!window.localNTPUnitTest) {
1056 LocalNTP().listen(); 1059 LocalNTP().listen();
1057 } 1060 }
OLDNEW
« no previous file with comments | « chrome/browser/browser_resources.grd ('k') | chrome/browser/resources/local_ntp/local_ntp_design.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698