OLD | NEW |
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 Loading... |
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 Loading... |
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 Loading... |
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 Loading... |
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 Loading... |
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), |
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 Loading... |
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.src = getMostVisitedTitleIframeUrl(rid, position); |
633 MOST_VISITED_TITLE_IFRAME, rid, MOST_VISITED_COLOR, | |
634 MOST_VISITED_FONT_FAMILY, MOST_VISITED_FONT_SIZE, position); | |
635 tileElement.appendChild(titleElement); | 622 tileElement.appendChild(titleElement); |
636 | 623 |
637 // The iframe which renders either a thumbnail or domain element. | 624 // The iframe which renders either a thumbnail or domain element. |
638 var thumbnailElement = document.createElement('iframe'); | 625 var thumbnailElement = document.createElement('iframe'); |
639 thumbnailElement.tabIndex = '-1'; | 626 thumbnailElement.tabIndex = '-1'; |
640 // Keep this ID here. See comment above. | 627 // Keep this ID here. See comment above. |
641 thumbnailElement.id = 'thumb-' + rid; | 628 thumbnailElement.id = 'thumb-' + rid; |
642 thumbnailElement.className = CLASSES.THUMBNAIL; | 629 thumbnailElement.className = CLASSES.THUMBNAIL; |
643 thumbnailElement.hidden = true; | 630 thumbnailElement.hidden = true; |
644 thumbnailElement.src = getMostVisitedIframeUrl( | 631 thumbnailElement.src = getMostVisitedThumbnailIframeUrl(rid, position); |
645 MOST_VISITED_THUMBNAIL_IFRAME, rid, MOST_VISITED_COLOR, | |
646 MOST_VISITED_FONT_FAMILY, MOST_VISITED_FONT_SIZE, position); | |
647 tileElement.appendChild(thumbnailElement); | 632 tileElement.appendChild(thumbnailElement); |
648 | 633 |
649 // A mask to darken the thumbnail on focus. | 634 // A mask to darken the thumbnail on focus. |
650 var maskElement = createAndAppendElement( | 635 var maskElement = createAndAppendElement( |
651 tileElement, 'div', CLASSES.THUMBNAIL_MASK); | 636 tileElement, 'div', CLASSES.THUMBNAIL_MASK); |
652 | 637 |
653 // The button used to blacklist this page. | 638 // The button used to blacklist this page. |
654 var blacklistButton = createAndAppendElement( | 639 var blacklistButton = createAndAppendElement( |
655 tileElement, 'div', CLASSES.BLACKLIST_BUTTON); | 640 tileElement, 'div', CLASSES.BLACKLIST_BUTTON); |
656 var blacklistFunction = generateBlacklistFunction(rid); | 641 var blacklistFunction = generateBlacklistFunction(rid); |
(...skipping 79 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
736 ntpApiHandle.undoAllMostVisitedDeletions(); | 721 ntpApiHandle.undoAllMostVisitedDeletions(); |
737 } | 722 } |
738 | 723 |
739 | 724 |
740 /** | 725 /** |
741 * Resizes elements because the number of tile columns may need to change in | 726 * 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 | 727 * response to resizing. Also shows or hides extra tiles tiles according to the |
743 * new width of the page. | 728 * new width of the page. |
744 */ | 729 */ |
745 function onResize() { | 730 function onResize() { |
| 731 var tileRequiredWidth = NTP_DESIGN.tileWidth + NTP_DESIGN.tileMargin; |
746 // If innerWidth is zero, then use the maximum snap size. | 732 // If innerWidth is zero, then use the maximum snap size. |
747 var innerWidth = window.innerWidth || 820; | 733 var maxSnapSize = MAX_NUM_COLUMNS * tileRequiredWidth - |
748 // Each tile has left and right margins that sum to TILE_MARGIN. | 734 NTP_DESIGN.tileMargin + MIN_TOTAL_HORIZONTAL_PADDING; |
749 var tileRequiredWidth = TILE_WIDTH + TILE_MARGIN; | 735 var innerWidth = window.innerWidth || maxSnapSize; |
750 var availableWidth = innerWidth + TILE_MARGIN - MIN_TOTAL_HORIZONTAL_PADDING; | 736 // Each tile has left and right margins that sum to NTP_DESIGN.tileMargin. |
| 737 var availableWidth = innerWidth + NTP_DESIGN.tileMargin - |
| 738 MIN_TOTAL_HORIZONTAL_PADDING; |
751 var newNumColumns = Math.floor(availableWidth / tileRequiredWidth); | 739 var newNumColumns = Math.floor(availableWidth / tileRequiredWidth); |
752 if (newNumColumns < MIN_NUM_COLUMNS) | 740 if (newNumColumns < MIN_NUM_COLUMNS) |
753 newNumColumns = MIN_NUM_COLUMNS; | 741 newNumColumns = MIN_NUM_COLUMNS; |
754 else if (newNumColumns > MAX_NUM_COLUMNS) | 742 else if (newNumColumns > MAX_NUM_COLUMNS) |
755 newNumColumns = MAX_NUM_COLUMNS; | 743 newNumColumns = MAX_NUM_COLUMNS; |
756 | 744 |
757 if (numColumnsShown != newNumColumns) { | 745 if (numColumnsShown != newNumColumns) { |
758 numColumnsShown = newNumColumns; | 746 numColumnsShown = newNumColumns; |
759 var tilesContainerWidth = numColumnsShown * tileRequiredWidth; | 747 var tilesContainerWidth = numColumnsShown * tileRequiredWidth; |
760 tilesContainer.style.width = tilesContainerWidth + 'px'; | 748 tilesContainer.style.width = tilesContainerWidth + 'px'; |
761 if (fakebox) // -2 to account for border. | 749 if (fakebox) { |
762 fakebox.style.width = (tilesContainerWidth - TILE_MARGIN - 2) + 'px'; | 750 // -2 to account for border. |
| 751 fakebox.style.width = |
| 752 (tilesContainerWidth - NTP_DESIGN.tileMargin - 2) + 'px'; |
| 753 } |
763 // Render without clearing tiles. | 754 // Render without clearing tiles. |
764 renderAndShowTiles(); | 755 renderAndShowTiles(); |
765 } | 756 } |
766 } | 757 } |
767 | 758 |
768 | 759 |
769 /** | 760 /** |
770 * Returns the tile corresponding to the specified page RID. | 761 * Returns the tile corresponding to the specified page RID. |
771 * @param {number} rid The page RID being looked up. | 762 * @param {number} rid The page RID being looked up. |
772 * @return {Tile} The corresponding tile. | 763 * @return {Tile} The corresponding tile. |
(...skipping 179 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
952 | 943 |
953 ntpContents.insertBefore(fakebox, ntpContents.firstChild); | 944 ntpContents.insertBefore(fakebox, ntpContents.firstChild); |
954 ntpContents.insertBefore(logo, ntpContents.firstChild); | 945 ntpContents.insertBefore(logo, ntpContents.firstChild); |
955 } else { | 946 } else { |
956 document.body.classList.add(CLASSES.NON_GOOGLE_PAGE); | 947 document.body.classList.add(CLASSES.NON_GOOGLE_PAGE); |
957 } | 948 } |
958 | 949 |
959 var notificationMessage = $(IDS.NOTIFICATION_MESSAGE); | 950 var notificationMessage = $(IDS.NOTIFICATION_MESSAGE); |
960 notificationMessage.textContent = | 951 notificationMessage.textContent = |
961 configData.translatedStrings.thumbnailRemovedNotification; | 952 configData.translatedStrings.thumbnailRemovedNotification; |
| 953 |
962 var undoLink = $(IDS.UNDO_LINK); | 954 var undoLink = $(IDS.UNDO_LINK); |
963 undoLink.addEventListener('click', onUndo); | 955 undoLink.addEventListener('click', onUndo); |
964 registerKeyHandler(undoLink, KEYCODE.ENTER, onUndo); | 956 registerKeyHandler(undoLink, KEYCODE.ENTER, onUndo); |
965 undoLink.textContent = configData.translatedStrings.undoThumbnailRemove; | 957 undoLink.textContent = configData.translatedStrings.undoThumbnailRemove; |
| 958 |
966 var restoreAllLink = $(IDS.RESTORE_ALL_LINK); | 959 var restoreAllLink = $(IDS.RESTORE_ALL_LINK); |
967 restoreAllLink.addEventListener('click', onRestoreAll); | 960 restoreAllLink.addEventListener('click', onRestoreAll); |
968 registerKeyHandler(restoreAllLink, KEYCODE.ENTER, onUndo); | 961 registerKeyHandler(restoreAllLink, KEYCODE.ENTER, onUndo); |
969 restoreAllLink.textContent = | 962 restoreAllLink.textContent = |
970 configData.translatedStrings.restoreThumbnailsShort; | 963 configData.translatedStrings.restoreThumbnailsShort; |
| 964 |
971 $(IDS.ATTRIBUTION_TEXT).textContent = | 965 $(IDS.ATTRIBUTION_TEXT).textContent = |
972 configData.translatedStrings.attributionIntro; | 966 configData.translatedStrings.attributionIntro; |
973 | 967 |
974 var notificationCloseButton = $(IDS.NOTIFICATION_CLOSE_BUTTON); | 968 var notificationCloseButton = $(IDS.NOTIFICATION_CLOSE_BUTTON); |
975 notificationCloseButton.addEventListener('click', hideNotification); | 969 notificationCloseButton.addEventListener('click', hideNotification); |
976 | 970 |
977 window.addEventListener('resize', onResize); | 971 window.addEventListener('resize', onResize); |
978 onResize(); | 972 onResize(); |
979 | 973 |
980 var topLevelHandle = getEmbeddedSearchApiHandle(); | 974 var topLevelHandle = getEmbeddedSearchApiHandle(); |
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1025 setFakeboxDragFocus(false); | 1019 setFakeboxDragFocus(false); |
1026 }; | 1020 }; |
1027 } | 1021 } |
1028 | 1022 |
1029 // Update the fakebox style to match the current key capturing state. | 1023 // Update the fakebox style to match the current key capturing state. |
1030 setFakeboxFocus(searchboxApiHandle.isKeyCaptureEnabled); | 1024 setFakeboxFocus(searchboxApiHandle.isKeyCaptureEnabled); |
1031 } | 1025 } |
1032 | 1026 |
1033 if (searchboxApiHandle.rtl) { | 1027 if (searchboxApiHandle.rtl) { |
1034 $(IDS.NOTIFICATION).dir = 'rtl'; | 1028 $(IDS.NOTIFICATION).dir = 'rtl'; |
| 1029 document.body.setAttribute('dir', 'rtl'); |
1035 // Add class for setting alignments based on language directionality. | 1030 // Add class for setting alignments based on language directionality. |
1036 document.body.classList.add(CLASSES.RTL); | 1031 document.body.classList.add(CLASSES.RTL); |
1037 $(IDS.TILES).dir = 'rtl'; | 1032 $(IDS.TILES).dir = 'rtl'; |
1038 } | 1033 } |
1039 } | 1034 } |
1040 | 1035 |
1041 | 1036 |
1042 /** | 1037 /** |
1043 * Binds event listeners. | 1038 * Binds event listeners. |
1044 */ | 1039 */ |
1045 function listen() { | 1040 function listen() { |
1046 document.addEventListener('DOMContentLoaded', init); | 1041 document.addEventListener('DOMContentLoaded', init); |
1047 } | 1042 } |
1048 | 1043 |
1049 return { | 1044 return { |
1050 init: init, | 1045 init: init, |
1051 listen: listen | 1046 listen: listen |
1052 }; | 1047 }; |
1053 } | 1048 } |
1054 | 1049 |
1055 if (!window.localNTPUnitTest) { | 1050 if (!window.localNTPUnitTest) { |
1056 LocalNTP().listen(); | 1051 LocalNTP().listen(); |
1057 } | 1052 } |
OLD | NEW |