Show data usage on Site Details (MDSettings)

chrome/browser/resources/settings/site_settings/website_usage_private_api.js

Index: chrome/browser/resources/settings/site_settings/website_usage_private_api.js
diff --git a/chrome/browser/resources/settings/site_settings/website_usage_private_api.js b/chrome/browser/resources/settings/site_settings/website_usage_private_api.js
new file mode 100644
index 0000000000000000000000000000000000000000..bb6ed7df35491b89acc7027e1e64ee5251e51198
--- /dev/null
+++ b/chrome/browser/resources/settings/site_settings/website_usage_private_api.js
@@ -0,0 +1,75 @@
+// Copyright 2016 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.
+
+(function() {
+'use strict';
+
+Polymer({
+  is: 'website-usage-private-api',
+
+  properties: {
+    /**
+     * The amount of data used by the given website.
+     */
+    websiteDataUsage: {
+      type: String,
+      notify: true,
+    },
+  },
+
+  attached: function() {
+    settings.WebsiteUsagePrivateApi.websiteUsagePolymerInstance = this;
+  },
+
+  fetchUsageTotal: function(host) {

[michaelpg, 2016/01/27 18:42:48]

/** @param {string} host */

[Finnur, 2016/01/28 11:17:49]

Done.

+    settings.WebsiteUsagePrivateApi.fetchUsageTotal(host);
+  },
+});
+})();
+
+cr.define('settings.WebsiteUsagePrivateApi', function() {
+  /**
+   * @type {Object} An instance of the polymer object defined above.
+   * All data will be set here.
+   */
+  websiteUsagePolymerInstance = null;

[michaelpg, 2016/01/27 18:42:48]

var

[Finnur, 2016/01/28 11:17:49]

Done.

+
+  /**
+   * @type {string} The host for which the usage total is being fetched.
+   */
+  var host;
+
+  /**
+   * Encapsulates the calls between JS and C++ to fetch how much storage the
+   * host is using.
+   * Will update the data in |websiteUsagePolymerInstance|.
+   */
+  fetchUsageTotal = function(host) {

[michaelpg, 2016/01/27 18:42:48]

var. You're creating global variables, they should be local (and then returned
in the return function at the bottom)

[Finnur, 2016/01/28 11:17:49]

Done, I believe. Happy to do a follow-up if I got it wrong (but it seems to work
fine). :)

+    var instance = settings.WebsiteUsagePrivateApi.websiteUsagePolymerInstance;
+    if (instance != null)
+      instance.websiteDataUsage = '';
+
+    this.host = host;

[michaelpg, 2016/01/27 18:42:48]

do you mean to use the "var host" defined at 41? you could rename it "host_" or
something, and set it instead of using "this":

host_ = host;

[Finnur, 2016/01/28 11:17:49]

Done.

+    chrome.send('fetchUsageTotal', [host]);
+  };
+
+  /**
+   * Callback for when the usage total is known.
+   * @param {string} host The host that the usage was fetched for.
+   * @param {string} usage The string showing how much data the given host
+   *     is using.
+   */
+  returnUsageTotal = function(host, usage) {
+    var instance = settings.WebsiteUsagePrivateApi.websiteUsagePolymerInstance;
+    if (instance == null)
+      return;
+
+    if (this.host == host)
+      instance.websiteDataUsage = usage;
+  };
+
+  return { websiteUsagePolymerInstance: websiteUsagePolymerInstance,
+           fetchUsageTotal: fetchUsageTotal,
+           returnUsageTotal: returnUsageTotal };
+});