| OLD | NEW |
| 1 // Copyright 2014 The Chromium Authors. All rights reserved. | 1 // Copyright 2014 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 Specifications for NTP design. | 7 * @fileoverview Specifications for NTP design. |
| 8 */ | 8 */ |
| 9 | 9 |
| 10 var THUMBNAIL_FALLBACK = { | 10 var THUMBNAIL_FALLBACK = { |
| 11 DOT: 'dot' // Draw single dot. | 11 DOT: 'dot' // Draw single dot. |
| 12 }; | 12 }; |
| 13 | 13 |
| 14 | 14 |
| 15 /** | 15 /** |
| 16 * Specifications for an NTP design (not comprehensive). | 16 * Specifications for an NTP design (not comprehensive). |
| 17 * | 17 * |
| 18 * fakeboxWingSize: Extra distance for fakebox to extend beyond beyond the list | 18 * fakeboxWingSize: Extra distance for fakebox to extend beyond beyond the list |
| 19 * of tiles. | 19 * of tiles. |
| 20 * fontFamily: Font family to use for title and thumbnail iframes. | 20 * fontFamily: Font family to use for title and thumbnail iframes. |
| 21 * fontSize: Font size to use for the iframes, in px. | 21 * fontSize: Font size to use for the iframes, in px. |
| 22 * mainClass: Class applied to #ntp-contents to control CSS. | 22 * mainClass: Class applied to #ntp-contents to control CSS. |
| 23 * numTitleLines: Number of lines to display in titles. |
| 23 * showFavicon: Whether to show favicon. | 24 * showFavicon: Whether to show favicon. |
| 24 * thumbnailTextColor: The 4-component color that thumbnail iframe may use to | 25 * thumbnailTextColor: The 4-component color that thumbnail iframe may use to |
| 25 * display text message in place of missing thumbnail. | 26 * display text message in place of missing thumbnail. |
| 26 * thumbnailFallback: (Optional) A value in THUMBNAIL_FALLBACK to specify the | 27 * thumbnailFallback: (Optional) A value in THUMBNAIL_FALLBACK to specify the |
| 27 * thumbnail fallback strategy. If unassigned, then the thumbnail.html | 28 * thumbnail fallback strategy. If unassigned, then the thumbnail.html |
| 28 * iframe would handle the fallback. | 29 * iframe would handle the fallback. |
| 29 * tileWidth: The width of each suggestion tile, in px. | 30 * tileWidth: The width of each suggestion tile, in px. |
| 30 * tileMargin: Spacing between successive tiles, in px. | 31 * tileMargin: Spacing between successive tiles, in px. |
| 31 * titleColor: The 4-component color of title text. | 32 * titleColor: The 4-component color of title text. |
| 32 * titleColorAgainstDark: The 4-component color of title text against a dark | 33 * titleColorAgainstDark: The 4-component color of title text against a dark |
| 33 * theme. | 34 * theme. |
| 34 * titleTextAlign: (Optional) The alignment of title text. If unspecified, the | 35 * titleTextAlign: (Optional) The alignment of title text. If unspecified, the |
| 35 * default value is 'center'. | 36 * default value is 'center'. |
| 36 * titleTextFade: (Optional) The number of pixels beyond which title | 37 * titleTextFade: (Optional) The number of pixels beyond which title |
| 37 * text begins to fade. This overrides the default ellipsis style. | 38 * text begins to fade. This overrides the default ellipsis style. |
| 38 * | 39 * |
| 39 * @const {{ | 40 * @const {{ |
| 40 * fakeboxWingSize: number, | 41 * fakeboxWingSize: number, |
| 41 * fontFamily: string, | 42 * fontFamily: string, |
| 42 * fontSize: number, | 43 * fontSize: number, |
| 43 * mainClass: string, | 44 * mainClass: string, |
| 45 * numTitleLines: number, |
| 44 * showFavicon: boolean, | 46 * showFavicon: boolean, |
| 45 * thumbnailTextColor: string, | 47 * thumbnailTextColor: string, |
| 46 * thumbnailFallback: string|null|undefined, | 48 * thumbnailFallback: string|null|undefined, |
| 47 * tileWidth: number, | 49 * tileWidth: number, |
| 48 * tileMargin: number, | 50 * tileMargin: number, |
| 49 * titleColor: string, | 51 * titleColor: string, |
| 50 * titleColorAgainstDark: string, | 52 * titleColorAgainstDark: string, |
| 51 * titleTextAlign: string|null|undefined, | 53 * titleTextAlign: string|null|undefined, |
| 52 * titleTextFade: number|null|undefined | 54 * titleTextFade: number|null|undefined |
| 53 * }} | 55 * }} |
| 54 */ | 56 */ |
| 55 var NTP_DESIGN = { | 57 var NTP_DESIGN = { |
| 56 fakeboxWingSize: 0, | 58 fakeboxWingSize: 0, |
| 57 fontFamily: 'arial, sans-serif', | 59 fontFamily: 'arial, sans-serif', |
| 58 fontSize: 12, | 60 fontSize: 12, |
| 59 mainClass: 'thumb-ntp', | 61 mainClass: 'thumb-ntp', |
| 62 numTitleLines: 1, |
| 60 showFavicon: true, | 63 showFavicon: true, |
| 61 thumbnailTextColor: [50, 50, 50, 255], | 64 thumbnailTextColor: [50, 50, 50, 255], |
| 62 thumbnailFallback: THUMBNAIL_FALLBACK.DOT, | 65 thumbnailFallback: THUMBNAIL_FALLBACK.DOT, |
| 63 tileWidth: 156, | 66 tileWidth: 156, |
| 64 tileMargin: 16, | 67 tileMargin: 16, |
| 65 titleColor: [50, 50, 50, 255], | 68 titleColor: [50, 50, 50, 255], |
| 66 titleColorAgainstDark: [210, 210, 210, 255], | 69 titleColorAgainstDark: [210, 210, 210, 255], |
| 67 titleTextAlign: 'inherit', | 70 titleTextAlign: 'inherit', |
| 68 titleTextFade: 122 - 36 // 112px wide title with 32 pixel fade at end. | 71 titleTextFade: 122 - 36 // 112px wide title with 32 pixel fade at end. |
| 69 }; | 72 }; |
| 70 | 73 |
| 71 | 74 |
| 72 /** | 75 /** |
| 73 * Modifies NTP_DESIGN parameters for icon NTP. | 76 * Modifies NTP_DESIGN parameters for icon NTP. |
| 74 */ | 77 */ |
| 75 function modifyNtpDesignForIcons() { | 78 function modifyNtpDesignForIcons() { |
| 76 NTP_DESIGN.fakeboxWingSize = 132; | 79 NTP_DESIGN.fakeboxWingSize = 132; |
| 77 NTP_DESIGN.mainClass = 'icon-ntp'; | 80 NTP_DESIGN.mainClass = 'icon-ntp'; |
| 81 NTP_DESIGN.numTitleLines = 2; |
| 78 NTP_DESIGN.showFavicon = false; | 82 NTP_DESIGN.showFavicon = false; |
| 79 NTP_DESIGN.thumbnailFallback = null; | 83 NTP_DESIGN.thumbnailFallback = null; |
| 80 NTP_DESIGN.tileWidth = 48 + 2 * 18; | 84 NTP_DESIGN.tileWidth = 48 + 2 * 18; |
| 81 NTP_DESIGN.tileMargin = 60 - 18 * 2; | 85 NTP_DESIGN.tileMargin = 60 - 18 * 2; |
| 82 NTP_DESIGN.titleColor = [120, 120, 120, 255]; | 86 NTP_DESIGN.titleColor = [120, 120, 120, 255]; |
| 83 NTP_DESIGN.titleColorAgainstDark = [210, 210, 210, 255]; | 87 NTP_DESIGN.titleColorAgainstDark = [210, 210, 210, 255]; |
| 84 NTP_DESIGN.titleTextAlign = 'center'; | 88 NTP_DESIGN.titleTextAlign = 'center'; |
| 85 delete NTP_DESIGN.titleTextFade; | 89 delete NTP_DESIGN.titleTextFade; |
| 86 } | 90 } |
| OLD | NEW |