Cleanup in NTP single-iframe

chrome/browser/resources/local_ntp/most_visited_single.js

 /* Copyright 2015 The Chromium Authors. All rights reserved.
  * Use of this source code is governed by a BSD-style license that can be
  * found in the LICENSE file. */
 
  // Single iframe for NTP tiles.
 (function() {
 'use strict';
 
 
 /**
@@ skipping 311 matching lines @@
   });
 };
 
 
 /**
  * Returns whether the given URL has a known, safe scheme.
  * @param {string} url URL to check.
  */
 var isSchemeAllowed = function(url) {
   return url.startsWith('http://') || url.startsWith('https://') ||
-         url.startsWith('ftp://') || url.startsWith('file://') ||
-         url.startsWith('chrome-extension://');
+         url.startsWith('ftp://') || url.startsWith('chrome-extension://');
 };
 
 
 /**
  * Renders a MostVisited tile to the DOM.
  * @param {object} data Object containing rid, url, title, favicon, thumbnail.
  *     data is null if you want to construct an empty tile.
  */
 var renderTile = function(data) {
   var tile = document.createElement('a');
@@ skipping 73 matching lines @@
   title.style.direction = data.direction || 'ltr';
   if (NUM_TITLE_LINES > 1) {
     title.classList.add('multiline');
   }
 
   // We keep track of the outcome of loading possible thumbnails for this
   // tile. Possible values:
   //   - null: waiting for load/error
   //   - false: error
   //   - a string: URL that loaded correctly.
-  // This is populated by acceptImage/rejectImage and loadBestImage
-  // decides the best one to load.
+  // This is populated by imageLoaded/imageLoadFailed, and selectBestImage
+  // selects the best one to display.
   var results = [];
   var thumb = tile.querySelector('.mv-thumb');
   var img = document.createElement('img');
   var loaded = false;
 
-  var loadBestImage = function() {
+  var selectBestImage = function() {
     if (loaded) {
       return;
     }
+    // |results| is ordered from best candidate to worst.
     for (var i = 0; i < results.length; ++i) {
       if (results[i] === null) {
+        // A better candidate is still waiting to be loaded; defer.
         return;
       }
       if (results[i] != false) {
+        // This is the best (non-failed) candidate. Use it!
         img.src = results[i];
         loaded = true;
         return;
       }
     }
+    // If we get here, then all candidates failed to load.
     thumb.classList.add('failed-img');
     thumb.removeChild(img);
+    // Usually we count the load once the img element gets either a 'load' or
+    // an 'error' event. Since we have removed the img element, instead count
+    // the load here.
     countLoad();
   };
 
-  var acceptImage = function(idx, url) {
+  var imageLoaded = function(idx, url) {
     return function(ev) {
       results[idx] = url;
-      loadBestImage();
+      selectBestImage();
     };
   };
 
-  var rejectImage = function(idx) {
+  var imageLoadFailed = function(idx) {
     return function(ev) {
       results[idx] = false;
-      loadBestImage();
+      selectBestImage();
     };
   };
 
   img.title = data.title;
   img.classList.add('thumbnail');
   loadedCounter += 1;
   img.addEventListener('load', countLoad);
   img.addEventListener('error', countLoad);
   img.addEventListener('error', function(ev) {
     thumb.classList.add('failed-img');
     thumb.removeChild(img);
   });
   thumb.appendChild(img);
 
   if (data.thumbnailUrl) {
     img.src = data.thumbnailUrl;
   } else {
     // Get all thumbnailUrls for the tile.
     // They are ordered from best one to be used to worst.
     for (var i = 0; i < data.thumbnailUrls.length; ++i) {
       results.push(null);
     }
     for (var i = 0; i < data.thumbnailUrls.length; ++i) {
       if (data.thumbnailUrls[i]) {
         var image = new Image();
         image.src = data.thumbnailUrls[i];
-        image.onload = acceptImage(i, data.thumbnailUrls[i]);
-        image.onerror = rejectImage(i);
+        image.onload = imageLoaded(i, data.thumbnailUrls[i]);
+        image.onerror = imageLoadFailed(i);
       } else {
-        rejectImage(i)(null);
+        imageLoadFailed(i)(/*ev=*/null);
       }
     }
   }
 
   var favicon = tile.querySelector('.mv-favicon');
   if (data.faviconUrl) {
     var fi = document.createElement('img');
     fi.src = data.faviconUrl;
     // Set the title to empty so screen readers won't say the image name.
     fi.title = '';
@@ skipping 14 matching lines @@
     blacklistTile(tile);
     ev.preventDefault();
     ev.stopPropagation();
   });
 
   return tile;
 };
 
 
 /**
- * Do some initialization and parses the query arguments passed to the iframe.
+ * Does some initialization and parses the query arguments passed to the iframe.
  */
 var init = function() {
-  // Creates a new DOM element to hold the tiles.
+  // Create a new DOM element to hold the tiles. The tiles will be added
+  // one-by-one via addTile, and the whole thing will be inserted into the page
+  // in showTiles, after the parent has sent us the 'show' message, and all
+  // thumbnails and favicons have loaded.
   tiles = document.createElement('div');
 
   // Parse query arguments.
   var query = window.location.search.substring(1).split('&');
   queryArgs = {};
   for (var i = 0; i < query.length; ++i) {
     var val = query[i].split('=');
     if (val[0] == '') continue;
     queryArgs[decodeURIComponent(val[0])] = decodeURIComponent(val[1]);
   }
@@ skipping 11 matching lines @@
     var html = document.querySelector('html');
     html.dir = 'rtl';
   }
 
   window.addEventListener('message', handlePostMessage);
 };
 
 
 window.addEventListener('DOMContentLoaded', init);
 })();