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 3// found in the LICENSE file. 4 5 6/** 7 * @fileoverview Specifications for NTP design, and an accessor to presets. 8 */ 9 10 var THUMBNAIL_FALLBACK = { 11 DOT: 'dot' // Draw single dot. 12 }; 13 14/** 15 * Specifications for an NTP design (not comprehensive). 16 * 17 * name: A unique identifier for the style. 18 * fontFamily: Font family to use for title and thumbnail <iframe>s. 19 * fontSize: Font size to use for the <iframe>s, in px. 20 * tileWidth: The width of each suggestion tile, in px. 21 * tileMargin: Spacing between successive tiles, in px. 22 * titleColor: The RRGGBBAA color of title text. 23 * titleColorAgainstDark: The RRGGBBAA color of title text against a dark theme. 24 * titleTextAlign: (Optional) The alignment of title text. If unspecified, the 25 * default value is 'center'. 26 * titleTextFade: (Optional) The number of pixels beyond which title 27 * text begins to fade. This overrides the default ellipsis style. 28 * thumbnailTextColor: The RRGGBBAA color that thumbnail <iframe> may use to 29 * display text message in place of missing thumbnail. 30 * thumbnailFallback: (Optional) A value in THUMBNAIL_FALLBACK to specify the 31 * thumbnail fallback strategy. If unassigned, then the thumbnail.html 32 * <iframe> would handle the fallback. 33 * showFakeboxHint: Whether to display text in the fakebox. 34 * 35 * @typedef {{ 36 * name: string, 37 * fontFamily: string, 38 * fontSize: number, 39 * tileWidth: number, 40 * tileMargin: number, 41 * titleColor: string, 42 * titleColorAgainstDark: string, 43 * titleTextAlign: string|null|undefined, 44 * titleTextFade: string|null|undefined, 45 * thumbnailTextColor: string, 46 * thumbnailFallback: string|null|undefined 47 * showFakeboxHint: string|null|undefined 48 * }} 49 */ 50var NtpDesign; 51 52/** 53 * Returns an NTP design corresponding to the given name. 54 * @param {string|undefined} opt_name The name of the design. If undefined, then 55 * the default design is specified. 56 * @return {NtpDesign} The NTP design corresponding to name. 57 */ 58function getNtpDesign(opt_name) { 59 var ntpDesign = null; 60 61 if (opt_name === 'md') { 62 ntpDesign = { 63 name: opt_name, 64 fontFamily: 'arial, sans-serif', 65 fontSize: 12, 66 tileWidth: 156, 67 tileMargin: 16, 68 titleColor: '323232ff', 69 titleColorAgainstDark: 'd2d2d2ff', 70 titleTextAlign: 'inherit', 71 titleTextFade: 122 - 36, // 112px wide title with 32 pixel fade at end. 72 thumbnailTextColor: '323232ff', // Unused. 73 thumbnailFallback: THUMBNAIL_FALLBACK.DOT, 74 showFakeboxHint: true 75 }; 76 } else { 77 ntpDesign = { 78 name: 'classical', 79 fontFamily: 'arial, sans-serif', 80 fontSize: 11, 81 tileWidth: 140, 82 tileMargin: 20, 83 titleColor: '777777ff', 84 titleColorAgainstDark: '777777ff', 85 titleTextAlign: 'center', 86 titleTextFade: null, // Default to ellipsis. 87 thumbnailTextColor: '777777ff', 88 thumbnailFallback: null, // Default to false. 89 showFakeboxHint: false 90 }; 91 } 92 return ntpDesign; 93} 94