First cut at UI for saving net_logs data into a temporary file on

chrome/browser/resources/net_export/net_export.js

+// Copyright (c) 2012 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.
+
+var g_mainExportView;
+
+/**
+ * Object to communicate between the renderer and the browser.
+ * @type {!BrowserBridge}
+ */
+var g_exportBrowserBridge = null;
+
+/**
+ * Main entry point called once the page has loaded.
+ */
+function onLoad() {
+  g_exportBrowserBridge = new BrowserBridge();
+  g_mainExportView = new MainView();
+}
+
+document.addEventListener('DOMContentLoaded', onLoad);
+
+
+/**
+ * This class provides a "bridge" for communicating between the javascript and
+ * the browser.
+ */
+var BrowserBridge = (function() {
+  'use strict';
+
+  /**
+   * Delay in milliseconds between updates of certain browser information.
+   */
+  var POLL_INTERVAL_MS = 5000;
+
+  /**
+   * @constructor
+   */
+  function BrowserBridge() {
+  }
+
+  BrowserBridge.prototype = {
+
+    //--------------------------------------------------------------------------
+    // Messages sent to the browser
+    //--------------------------------------------------------------------------
+
+    setPollInterval: function() {
+      window.setInterval(this.sendGetExportNetLogInfo.bind(this),
+                         POLL_INTERVAL_MS);
+    },
+
+    sendGetExportNetLogInfo: function() {
+      chrome.send('getExportNetLogInfo');
+    },
+
+    sendStartNetLog: function() {
+      chrome.send('startNetLog');
+    },
+
+    sendStopNetLog: function() {
+      chrome.send('stopNetLog');
+    },
+
+    sendSendNetLog: function() {
+      chrome.send('sendNetLog');
+    },
+
+    //--------------------------------------------------------------------------
+    // Messages received from the browser.
+    //--------------------------------------------------------------------------
+
+    receivedData: function(data) {
+       g_mainExportView.onExportNetLogInfoChanged(data);
+    }
+  };
+
+  return BrowserBridge;
+})();
+
+/**
+ * This class handles the presentation of our profiler view. Used as a
+ * singleton.
+ */
+var MainView = (function() {
+  'use strict';
+
+  // --------------------------------------------------------------------------
+  // Important IDs in the HTML document
+  // --------------------------------------------------------------------------
+
+  var START_DATA_BUTTON_ID = 'export-view-start-data';
+  var STOP_DATA_BUTTON_ID = 'export-view-stop-data';
+  var SEND_DATA_BUTTON_ID = 'export-view-send-data';
+  var FILE_PATH_TEXT_ID = 'export-view-file-path-text';
+
+  // --------------------------------------------------------------------------
+
+  /**
+   * @constructor
+   */
+  function MainView() {
+    this.init_();
+
+    g_exportBrowserBridge.setPollInterval();
+
+    g_exportBrowserBridge.sendGetExportNetLogInfo();
+  }
+
+  MainView.prototype = {
+    init_: function() {
+      this.startDataButton_ = $(START_DATA_BUTTON_ID);
+      this.startDataButton_.onclick = this.onStartData_.bind(this);
+      this.stopDataButton_ = $(STOP_DATA_BUTTON_ID);
+      this.stopDataButton_.onclick = this.onStopData_.bind(this);
+      this.sendDataButton_ = $(SEND_DATA_BUTTON_ID);
+      this.sendDataButton_.onclick = this.onSendData_.bind(this);
+      this.filePathText_ = $(FILE_PATH_TEXT_ID);

[mmenke, 2013/01/11 18:31:12]

Suggest just inlining this.

[ramant (doing other things), 2013/01/12 04:34:04]

Done.

+    },
+
+    /**
+     * Starts saving NetLog data to a file.
+     */
+    onStartData_: function() {
+      g_exportBrowserBridge.sendStartNetLog();
+      g_exportBrowserBridge.sendGetExportNetLogInfo();
+    },
+
+    /**
+     * Stops saving NetLog data to a file.
+     */
+    onStopData_: function() {
+      g_exportBrowserBridge.sendStopNetLog();
+      g_exportBrowserBridge.sendGetExportNetLogInfo();
+    },
+
+    /**
+     * Sends NetLog data via email from browser.
+     */
+    onSendData_: function() {
+      g_exportBrowserBridge.sendSendNetLog();
+      g_exportBrowserBridge.sendGetExportNetLogInfo();
+    },
+
+    onExportNetLogInfoChanged: function(exportNetLogInfo) {
+      this.filePathText_.textContent = '';

[mmenke, 2013/01/11 18:31:12]

nit:  Not needed.

[ramant (doing other things), 2013/01/12 04:34:04]

Done.

+      if (exportNetLogInfo.file) {
+        var message = '';
+        if (exportNetLogInfo.state == 'ALLOW_STOP') {
+          message = 'NetLog data is collected in: ';
+        } else if (exportNetLogInfo.state == 'ALLOW_START_SEND') {
+          message = 'NetLog data to send is in: ';
+        }
+        this.filePathText_.textContent = message + exportNetLogInfo.file;
+      } else {
+        this.filePathText_.textContent = '';
+      }
+      this.startDataButton_.disabled = false;
+      this.stopDataButton_.disabled = false;
+      this.sendDataButton_.disabled = false;

[mmenke, 2013/01/11 18:31:12]

optional:  Think this would be clearer if you used only one set line per button.
 Makes it easier to reason about which buttont is enabled when.  e.g.:

var state = exportNetLogInfo.state;
this.startDataButton_.disabled = (state != 'ALLOW_START');
...

Alternatively, disable all the buttons by default, and only enable them in each
block of code below.  It's clearer if you set what a state can do, rather than
what it can't do.

[ramant (doing other things), 2013/01/12 04:34:04]

Did the alternative.
Done.

+      if (exportNetLogInfo.state == 'ALLOW_START') {
+        this.stopDataButton_.disabled = true;
+        this.sendDataButton_.disabled = true;
+      } else if (exportNetLogInfo.state == 'ALLOW_STOP') {
+        this.startDataButton_.disabled = true;
+        this.sendDataButton_.disabled = true;
+      } else if (exportNetLogInfo.state == 'ALLOW_START_SEND') {
+        this.stopDataButton_.disabled = true;
+      }
+      return true;

[mmenke, 2013/01/11 18:31:12]

No need to return anything.  net-internals uses it so tabs without valid data
can be hidden when a log file is loaded.  Not an issue here.

[ramant (doing other things), 2013/01/12 04:34:04]

Done.

+    }
+  };
+
+  return MainView;
+})();