src/chrome/browser/resources/local_ntp/most_visited_util.js

   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
   3 // found in the LICENSE file.
   4
   5
   6 /**
   7  * @fileoverview Utilities for rendering most visited thumbnails and titles.
   8  */
   9
  10 <include src="instant_iframe_validation.js">
  11
  12 /**
  13  * Enum for the different types of events that are logged from the NTP.
  14  * @enum {number}
  15  * @const
  16  */
  17 var NTP_LOGGING_EVENT_TYPE = {
  18   // The user moused over an NTP tile or title.
  19   NTP_MOUSEOVER: 0,
  20   // The page attempted to load a thumbnail image.
  21   NTP_THUMBNAIL_ATTEMPT: 1,
  22   // There was an error in loading both the thumbnail image and the fallback
  23   // (if it was provided), resulting in a grey tile.
  24   NTP_THUMBNAIL_ERROR: 2,
  25   // The page attempted to load a thumbnail URL while a fallback thumbnail was
  26   // provided.
  27   NTP_FALLBACK_THUMBNAIL_REQUESTED: 3,
  28   // The primary thumbnail image failed to load and caused us to use the
  29   // secondary thumbnail as a fallback.
  30   NTP_FALLBACK_THUMBNAIL_USED: 4
  31 };
  32
  33 /**
  34  * Parses query parameters from Location.
  35  * @param {string} location The URL to generate the CSS url for.
  36  * @return {Object} Dictionary containing name value pairs for URL.
  37  */
  38 function parseQueryParams(location) {
  39   var params = Object.create(null);
  40   var query = location.search.substring(1);
  41   var vars = query.split('&');
  42   for (var i = 0; i < vars.length; i++) {
  43     var pair = vars[i].split('=');
  44     var k = decodeURIComponent(pair[0]);
  45     if (k in params) {
  46       // Duplicate parameters are not allowed to prevent attackers who can
  47       // append things to |location| from getting their parameter values to
  48       // override legitimate ones.
  49       return Object.create(null);
  50     } else {
  51       params[k] = decodeURIComponent(pair[1]);
  52     }
  53   }
  54   return params;
  55 }
  56
  57
  58 /**
  59  * Creates a new most visited link element.
  60  * @param {Object} params URL parameters containing styles for the link.
  61  * @param {string} href The destination for the link.
  62  * @param {string} title The title for the link.
  63  * @param {string|undefined} text The text for the link or none.
  64  * @param {string|undefined} ping If specified, a location relative to the
  65  *     referrer of this iframe, to ping when the link is clicked. Only works if
  66  *     the referrer is HTTPS.
  67  * @return {HTMLAnchorElement} A new link element.
  68  */
  69 function createMostVisitedLink(params, href, title, text, ping) {
  70   var styles = getMostVisitedStyles(params, !!text);
  71   var link = document.createElement('a');
  72   link.style.color = styles.color;
  73   link.style.fontSize = styles.fontSize + 'px';
  74   if (styles.fontFamily)
  75     link.style.fontFamily = styles.fontFamily;
  76   link.href = href;
  77   if ('pos' in params && isFinite(params.pos)) {
  78     link.ping = '/log.html?pos=' + params.pos;
  79     // If a ping parameter was specified, add it to the list of pings, relative
  80     // to the referrer of this iframe, which is the default search provider.
  81     if (ping) {
  82       var parentUrl = document.createElement('a');
  83       parentUrl.href = document.referrer;
  84       if (parentUrl.protocol == 'https:') {
  85         link.ping += ' ' + parentUrl.origin + '/' + ping;
  86       }
  87     }
  88   }
  89   link.title = title;
  90   link.target = '_top';
  91   // Exclude links from the tab order.  The tabIndex is added to the thumbnail
  92   // parent container instead.
  93   link.tabIndex = '-1';
  94   if (text)
  95     link.textContent = text;
  96   link.addEventListener('mouseover', function() {
  97     var ntpApiHandle = chrome.embeddedSearch.newTabPage;
  98     ntpApiHandle.logEvent(NTP_LOGGING_EVENT_TYPE.NTP_MOUSEOVER);
  99   });
 100   return link;
 101 }
 102
 103
 104 /**
 105  * Decodes most visited styles from URL parameters.
 106  * - f: font-family
 107  * - fs: font-size as a number in pixels.
 108  * - c: A hexadecimal number interpreted as a hex color code.
 109  * @param {Object.<string, string>} params URL parameters specifying style.
 110  * @param {boolean} isTitle if the style is for the Most Visited Title.
 111  * @return {Object} Styles suitable for CSS interpolation.
 112  */
 113 function getMostVisitedStyles(params, isTitle) {
 114   var styles = {
 115     color: '#777',
 116     fontFamily: '',
 117     fontSize: 11
 118   };
 119   var apiHandle = chrome.embeddedSearch.newTabPage;
 120   var themeInfo = apiHandle.themeBackgroundInfo;
 121   if (isTitle && themeInfo && !themeInfo.usingDefaultTheme) {
 122     styles.color = convertArrayToRGBAColor(themeInfo.textColorRgba) ||
 123         styles.color;
 124   } else if ('c' in params) {
 125     styles.color = convertToHexColor(parseInt(params.c, 16)) || styles.color;
 126   }
 127   if ('f' in params && /^[-0-9a-zA-Z ,]+$/.test(params.f))
 128     styles.fontFamily = params.f;
 129   if ('fs' in params && isFinite(parseInt(params.fs, 10)))
 130     styles.fontSize = parseInt(params.fs, 10);
 131   return styles;
 132 }
 133
 134
 135 /**
 136  * @param {string} location A location containing URL parameters.
 137  * @param {function(Object, Object)} fill A function called with styles and
 138  *     data to fill.
 139  */
 140 function fillMostVisited(location, fill) {
 141   var params = parseQueryParams(document.location);
 142   params.rid = parseInt(params.rid, 10);
 143   if (!isFinite(params.rid) && !params.url)
 144     return;
 145   var data = {};
 146   if (params.url) {
 147     // Means that we get suggestion data from the server. Create data object.
 148     data.url = params.url;
 149     data.thumbnailUrl = params.tu || '';
 150     data.thumbnailUrl2 = params.tu2 || '';
 151     data.title = params.ti || '';
 152     data.direction = params.di || '';
 153     data.domain = params.dom || '';
 154     data.ping = params.ping || '';
 155   } else {
 156     var apiHandle = chrome.embeddedSearch.searchBox;
 157     data = apiHandle.getMostVisitedItemData(params.rid);
 158     if (!data)
 159       return;
 160     delete data.ping;
 161   }
 162   if (/^javascript:/i.test(data.url) ||
 163       /^javascript:/i.test(data.thumbnailUrl) ||
 164       /^javascript:/i.test(data.thumbnailUrl2))
 165     return;
 166   if (data.direction)
 167     document.body.dir = data.direction;
 168   fill(params, data);
 169 }