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 the NTP design, and an accessor to presets. | 7 * @fileoverview Specifications for NTP design, and an acessor to presets. |
Mathieu
2014/08/13 20:09:30
*accessor
huangs
2014/08/13 21:34:08
Done.
| |
8 */ | 8 */ |
9 | 9 |
10 var THUMBNAIL_FALLBACK = { | |
11 DOT: 'dot' // Draw single dot. | |
12 }; | |
10 | 13 |
11 /** | 14 /** |
12 * Specifications for an NTP design (not comprehensive). | 15 * Specifications for an NTP design (not comprehensive). |
13 * | 16 * |
14 * name: A unique identifier for the style. | 17 * name: A unique identifier for the style. |
18 * classToAdd: A list of classes to be added to #ntp-contents, so the | |
15 * appropriate CSS will take effect. | 19 * appropriate CSS will take effect. |
16 * fontFamily: Font family to use for title and thumbnail <iframe>s. | 20 * fontFamily: Font family to use for title and thumbnail <iframe>s. |
17 * fontSize: Font size to use for the <iframe>s, in px. | 21 * fontSize: Font size to use for the <iframe>s, in px. |
18 * tileWidth: The width of each suggestion tile, in px. | 22 * tileWidth: The width of each suggestion tile, in px. |
19 * tileMargin: Spacing between successive tiles, in px. | 23 * tileMargin: Spacing between successive tiles, in px. |
20 * titleColor: The RRGGBB color of title text. | 24 * titleColor: The RRGGBB color of title text. |
25 * titleColorAgainstDark: The RRGGBB color of title text against a dark theme. | |
21 * titleTextAlign: (Optional) The alignment of title text. If unspecified, the | 26 * titleTextAlign: (Optional) The alignment of title text. If unspecified, the |
22 * default value is 'center'. | 27 * default value is 'center'. |
23 * titleTextFade: (Optional) The number of pixels beyond which title | 28 * titleTextFade: (Optional) The number of pixels beyond which title |
24 * text begins to fade. This overrides the default ellipsis style. | 29 * text begins to fade. This overrides the default ellipsis style. |
25 * thumbnailTextColor: The RRGGBB color that thumbnail <iframe> may use to | 30 * thumbnailTextColor: The RRGGBB color that thumbnail <iframe> may use to |
26 * display text message in place of missing thumbnail. | 31 * display text message in place of missing thumbnail. |
32 * thumbnailFallback: (Optional) Specifies how to do fallback should be handled | |
Mathieu
2014/08/13 20:09:29
rephrase comment
huangs
2014/08/13 21:34:09
Done.
| |
33 * handled if thumbnails are emissing. If assigned, then thumbnail <iframe> | |
34 * will let local NTP handle fallbacks. | |
35 * showFakeboxHint: Whether to display text in the fakebox. | |
27 * | 36 * |
28 * @typedef {{ | 37 * @typedef {{ |
29 * name: string, | 38 * name: string, |
39 * classToAdd: Array.{string}, | |
30 * fontFamily: string, | 40 * fontFamily: string, |
31 * fontSize: number, | 41 * fontSize: number, |
32 * tileWidth: number, | 42 * tileWidth: number, |
33 * tileMargin: number, | 43 * tileMargin: number, |
34 * titleColor: string, | 44 * titleColor: string, |
45 * titleColorAgainstDark: string, | |
35 * titleTextAlign: string|null|undefined, | 46 * titleTextAlign: string|null|undefined, |
36 * titleTextFade: string|null|undefined, | 47 * titleTextFade: string|null|undefined, |
37 * thumbnailTextColor: string | 48 * thumbnailTextColor: string, |
49 * thumbnailFallback: string|null|undefined | |
50 * showFakeboxHint: string|null|undefined | |
38 * }} | 51 * }} |
39 */ | 52 */ |
40 var NtpDesign; | 53 var NtpDesign; |
41 | 54 |
42 /** | 55 /** |
43 * Returns an NTP design corresponding to the given name. | 56 * Returns an NTP design corresponding to the given name. |
44 * @param {string|undefined} opt_name The name of the design. If undefined, then | 57 * @param {string|undefined} opt_name The name of the design. If undefined, then |
45 * the default design is specified. | 58 * the default design is specified. |
46 * @return {NtpDesign} The NTP design corresponding to name. | 59 * @return {NtpDesign} The NTP design corresponding to name. |
47 */ | 60 */ |
48 function getNtpDesign(opt_name) { | 61 function getNtpDesign(opt_name) { |
49 // TODO(huangs): Add new style. | 62 var ntpDesign = null; |
50 return { | 63 |
51 name: 'classical', | 64 if (opt_name === 'md' || opt_name === 'smallScreen1' || |
52 fontFamily: 'arial, sans-serif', | 65 opt_name === 'smallScreen2') { |
Mathieu
2014/08/13 20:09:29
you don't seem to be using smallScreen2, remove?
huangs
2014/08/13 21:34:08
Done.
| |
53 fontSize: 11, | 66 ntpDesign = { |
54 tileWidth: 140, | 67 name: opt_name, |
55 tileMargin: 20, | 68 classToAdd: ['md'], |
56 titleColor: '777777', | 69 fontFamily: 'Roboto2, arial, sans-serif', |
57 // No titleTextAlign: defaults to 'center'. | 70 fontSize: 12, |
58 // No titleTextFade: by default we have ellipsis. | 71 tileWidth: 146, |
59 thumbnailTextColor: '777777' | 72 tileMargin: 12, |
60 }; | 73 titleColor: '000000', |
74 titleColorAgainstDark: 'd2d2d2', | |
75 titleTextAlign: 'inherit', | |
76 titleTextFade: 112 - 24, // 24 pixel fade. | |
77 thumbnailTextColor: '777777', | |
78 thumbnailFallback: THUMBNAIL_FALLBACK.DOT, | |
79 showFakeboxHint: true | |
80 }; | |
81 | |
Mathieu
2014/08/13 20:09:29
remove extra newline
huangs
2014/08/13 21:34:09
Done.
| |
82 } else { | |
83 ntpDesign = { | |
84 name: 'classical', | |
85 classToAdd: ['classical'], | |
86 fontFamily: 'arial, sans-serif', | |
87 fontSize: 11, | |
88 tileWidth: 140, | |
89 tileMargin: 20, | |
90 titleColor: '777777', | |
91 titleColorAgainstDark: '777777', | |
92 titleTextAlign: 'center', | |
93 titleTextFade: null, // Default to ellipsis. | |
94 thumbnailTextColor: '777777', | |
95 thumbnailFallback: null, // Default to false. | |
96 showFakeboxHint: false | |
97 }; | |
98 } | |
99 return ntpDesign; | |
61 } | 100 } |
OLD | NEW |