MD Settings: Internet: Move network lists to a subpage

chrome/browser/resources/settings/internet_page/internet_page.js

Index: chrome/browser/resources/settings/internet_page/internet_page.js
diff --git a/chrome/browser/resources/settings/internet_page/internet_page.js b/chrome/browser/resources/settings/internet_page/internet_page.js
index af8d9511171748813369fa50ec50be6261adef9d..b56e94b0caaa87c50cefc8313a757a97824ea6a9 100644
--- a/chrome/browser/resources/settings/internet_page/internet_page.js
+++ b/chrome/browser/resources/settings/internet_page/internet_page.js
@@ -10,7 +10,7 @@
 Polymer({
   is: 'settings-internet-page',
 
-  behaviors: [I18nBehavior],
+  behaviors: [I18nBehavior, settings.RouteObserverBehavior],
 
   properties: {
     /**
@@ -48,6 +48,21 @@ Polymer({
     },
 
     /**
+     * Set by internet-subpage. Controls spinner visibility in subpage header.
+     * @private
+     */
+    showSpinner_: {
+      type: Boolean,
+      notify: true,

[michaelpg, 2017/03/01 23:27:59]

notify: true means it should propagate upwards; internet-subpage needs this but
not internet-page

as a rule of thumb it doesn't make sense on @private: it's encapsulated, and not
part of the contract our element has with its users

[stevenjb, 2017/03/02 00:25:17]

Done.

+    },
+
+    /**
+     * The network type for the networks subpage. Used in the subpage header.
+     * @private
+     */
+    subpageType_: String,
+
+    /**
      * The network type for the known networks subpage.
      * @private
      */
@@ -83,6 +98,7 @@ Polymer({
     'device-enabled-toggled': 'onDeviceEnabledToggled_',
     'show-detail': 'onShowDetail_',
     'show-known-networks': 'onShowKnownNetworks_',
+    'show-networks': 'onShowNetworks_',
   },
 
   // chrome.networkingPrivate listeners
@@ -131,6 +147,22 @@ Polymer({
   },
 
   /**
+   * settings.RouteObserverBehavior
+   * @param {!settings.Route} route
+   * @protected
+   */
+  currentRouteChanged: function(route) {
+    if (route == settings.Route.INTERNET_NETWORKS) {
+      // Handle direct navigation to the networks page,
+      // e.g. chrome://settings/internet/networks?type=WiFi
+      var queryParams = settings.getQueryParameters();
+      var type = queryParams.get('type');

[michaelpg, 2017/03/01 23:27:59]

nit: instead of creating a variable, use queryParams.has('type')

[stevenjb, 2017/03/02 00:25:17]

But.... that requires two lookups! I know it's probably a hash, but the C++
developer in me bristles at the notion :)

+      if (type)
+        this.subpageType_ = type;
+    }
+  },
+
+  /**
    * Event triggered by a device state enabled toggle.
    * @param {!{detail: {enabled: boolean,
    *                    type: chrome.networkingPrivate.NetworkType}}} event
@@ -160,6 +192,25 @@ Polymer({
    * @param {!{detail: {type: string}}} event
    * @private
    */
+  onShowNetworks_: function(event) {
+    var params = new URLSearchParams;
+    params.append('type', event.detail.Type);
+    this.subpageType_ = event.detail.Type;
+    settings.navigateTo(settings.Route.INTERNET_NETWORKS, params);
+  },
+
+  /**
+   * @return {string}
+   * @private
+   */
+  getNetworksPageTitle_: function() {
+    return this.i18n('OncType' + this.subpageType_);
+  },
+
+  /**
+   * @param {!{detail: {type: string}}} event
+   * @private
+   */
   onShowKnownNetworks_: function(event) {
     this.knownNetworksType_ = event.detail.type;
     settings.navigateTo(settings.Route.KNOWN_NETWORKS);