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

   1 // Copyright 2015 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  * @fileoverview Polymer element for displaying a summary of network states
   7  * by type: Ethernet, WiFi, Cellular, WiMAX, and VPN.
   8  */
   9 (function() {
  10
  11 /** @typedef {chrome.networkingPrivate.DeviceStateProperties} */
  12 var DeviceStateProperties;
  13
  14 /**
  15  * @typedef {{
  16  *   Ethernet: (DeviceStateProperties|undefined),
  17  *   WiFi: (DeviceStateProperties|undefined),
  18  *   Cellular: (DeviceStateProperties|undefined),
  19  *   WiMAX: (DeviceStateProperties|undefined),
  20  *   VPN: (DeviceStateProperties|undefined)
  21  * }}
  22  */
  23 var DeviceStateObject;
  24
  25 /**
  26  * @typedef {{
  27  *   Ethernet: (?CrOnc.NetworkStateProperties|undefined),
  28  *   WiFi: (?CrOnc.NetworkStateProperties|undefined),
  29  *   Cellular: (?CrOnc.NetworkStateProperties|undefined),
  30  *   WiMAX: (?CrOnc.NetworkStateProperties|undefined),
  31  *   VPN: (?CrOnc.NetworkStateProperties|undefined)
  32  * }}
  33  */
  34 var NetworkStateObject;
  35
  36 /**
  37  * @typedef {{
  38  *   Ethernet: (Array<CrOnc.NetworkStateProperties>|undefined),
  39  *   WiFi: (Array<CrOnc.NetworkStateProperties>|undefined),
  40  *   Cellular: (Array<CrOnc.NetworkStateProperties>|undefined),
  41  *   WiMAX: (Array<CrOnc.NetworkStateProperties>|undefined),
  42  *   VPN: (Array<CrOnc.NetworkStateProperties>|undefined)
  43  * }}
  44  */
  45 var NetworkStateListObject;
  46
  47 /** @const {!Array<string>} */
  48 var NETWORK_TYPES = [
  49   CrOnc.Type.ETHERNET,
  50   CrOnc.Type.WIFI,
  51   CrOnc.Type.CELLULAR,
  52   CrOnc.Type.WIMAX,
  53   CrOnc.Type.VPN
  54 ];
  55
  56 Polymer({
  57   is: 'network-summary',
  58
  59   properties: {
  60     /**
  61      * The device state for each network device type.
  62      * @type {DeviceStateObject}
  63      */
  64     deviceStates: {
  65       type: Object,
  66       value: function() { return {}; },
  67     },
  68
  69     /**
  70      * Network state data for each network type.
  71      * @type {NetworkStateObject}
  72      */
  73     networkStates: {
  74       type: Object,
  75       value: function() { return {}; },
  76     },
  77
  78     /**
  79      * List of network state data for each network type.
  80      * @type {NetworkStateListObject}
  81      */
  82     networkStateLists: {
  83       type: Object,
  84       value: function() { return {}; },
  85     }
  86   },
  87
  88   /**
  89    * Listener function for chrome.networkingPrivate.onNetworkListChanged event.
  90    * @type {?function(!Array<string>)}
  91    * @private
  92    */
  93   networkListChangedListener_: null,
  94
  95   /**
  96    * Listener function for chrome.networkingPrivate.onDeviceStateListChanged
  97    * event.
  98    * @type {?function(!Array<string>)}
  99    * @private
 100    */
 101   deviceStateListChangedListener_: null,
 102
 103   /**
 104    * Listener function for chrome.networkingPrivate.onNetworksChanged event.
 105    * @type {?function(!Array<string>)}
 106    * @private
 107    */
 108   networksChangedListener_: null,
 109
 110   /**
 111    * Dictionary of GUIDs identifying primary (active) networks for each type.
 112    * @type {?Object}
 113    * @private
 114    */
 115   networkIds_: null,
 116
 117   /** @override */
 118   attached: function() {
 119     this.networkIds_ = {};
 120
 121     this.getNetworkLists_();
 122
 123     this.networkListChangedListener_ =
 124         this.onNetworkListChangedEvent_.bind(this);
 125     chrome.networkingPrivate.onNetworkListChanged.addListener(
 126         this.networkListChangedListener_);
 127
 128     this.deviceStateListChangedListener_ =
 129         this.onDeviceStateListChangedEvent_.bind(this);
 130     chrome.networkingPrivate.onDeviceStateListChanged.addListener(
 131         this.deviceStateListChangedListener_);
 132
 133     this.networksChangedListener_ = this.onNetworksChangedEvent_.bind(this);
 134     chrome.networkingPrivate.onNetworksChanged.addListener(
 135         this.networksChangedListener_);
 136   },
 137
 138   /** @override */
 139   detached: function() {
 140     chrome.networkingPrivate.onNetworkListChanged.removeListener(
 141         this.networkListChangedListener_);
 142
 143     chrome.networkingPrivate.onDeviceStateListChanged.removeListener(
 144         this.deviceStateListChangedListener_);
 145
 146     chrome.networkingPrivate.onNetworksChanged.removeListener(
 147         this.networksChangedListener_);
 148   },
 149
 150   /**
 151    * Event triggered when the WiFi network-summary-item is expanded.
 152    * @param {!{detail: {expanded: boolean, type: string}}} event
 153    * @private
 154    */
 155   onWiFiExpanded_: function(event) {
 156     this.getNetworkStates_();  // Get the latest network states (only).
 157     if (event.detail.expanded)
 158       chrome.networkingPrivate.requestNetworkScan();
 159   },
 160
 161   /**
 162    * Event triggered when a network-summary-item is selected.
 163    * @param {!{detail: !CrOnc.NetworkStateProperties}} event
 164    * @private
 165    */
 166   onSelected_: function(event) {
 167     var state = event.detail;
 168     if (state.ConnectionState == CrOnc.ConnectionState.NOT_CONNECTED) {
 169       this.connectToNetwork_(state);
 170       return;
 171     }
 172     MoreRouting.navigateTo('internet-detail', {guid: state.GUID});
 173   },
 174
 175   /**
 176    * Event triggered when the enabled state of a network-summary-item is
 177    * toggled.
 178    * @param {!{detail: {enabled: boolean, type: string}}} event
 179    * @private
 180    */
 181   onDeviceEnabledToggled_: function(event) {
 182     if (event.detail.enabled)
 183       chrome.networkingPrivate.enableNetworkType(event.detail.type);
 184     else
 185       chrome.networkingPrivate.disableNetworkType(event.detail.type);
 186   },
 187
 188   /**
 189    * networkingPrivate.onNetworkListChanged event callback.
 190    * @private
 191    */
 192   onNetworkListChangedEvent_: function() { this.getNetworkLists_(); },
 193
 194   /**
 195    * networkingPrivate.onDeviceStateListChanged event callback.
 196    * @private
 197    */
 198   onDeviceStateListChangedEvent_: function() { this.getNetworkLists_(); },
 199
 200   /**
 201    * networkingPrivate.onNetworksChanged event callback.
 202    * @param {!Array<string>} networkIds The list of changed network GUIDs.
 203    * @private
 204    */
 205   onNetworksChangedEvent_: function(networkIds) {
 206     networkIds.forEach(function(id) {
 207       if (id in this.networkIds_) {
 208         chrome.networkingPrivate.getState(
 209             id,
 210             function(state) {
 211               // Async call, ensure id still exists.
 212               if (!this.networkIds_[id])
 213                 return;
 214               if (!state) {
 215                 this.networkIds_[id] = undefined;
 216                 return;
 217               }
 218               this.updateNetworkState_(state.Type, state);
 219             }.bind(this));
 220       }
 221     }, this);
 222   },
 223
 224   /**
 225    * Handles UI requests to connect to a network.
 226    * TODO(stevenjb): Handle Cellular activation, etc.
 227    * @param {!CrOnc.NetworkStateProperties} state The network state.
 228    * @private
 229    */
 230   connectToNetwork_: function(state) {
 231     chrome.networkingPrivate.startConnect(state.GUID);
 232   },
 233
 234   /**
 235    * Requests the list of device states and network states from Chrome.
 236    * Updates deviceStates, networkStates, and networkStateLists once the
 237    * results are returned from Chrome.
 238    * @private
 239    */
 240   getNetworkLists_: function() {
 241     // First get the device states.
 242     chrome.networkingPrivate.getDeviceStates(
 243       function(states) {
 244         this.getDeviceStatesCallback_(states);
 245         // Second get the network states.
 246         this.getNetworkStates_();
 247       }.bind(this));
 248   },
 249
 250   /**
 251    * Requests the list of network states from Chrome. Updates networkStates and
 252    * networkStateLists once the results are returned from Chrome.
 253    * @private
 254    */
 255   getNetworkStates_: function() {
 256     var filter = {
 257       networkType: 'All',
 258       visible: true,
 259       configured: false
 260     };
 261     chrome.networkingPrivate.getNetworks(
 262         filter, this.getNetworksCallback_.bind(this));
 263   },
 264
 265   /**
 266    * networkingPrivate.getDeviceStates callback.
 267    * @param {!Array<!DeviceStateProperties>} states The state properties for all
 268    *     available devices.
 269    * @private
 270    */
 271   getDeviceStatesCallback_: function(states) {
 272     /** @type {!DeviceStateObject} */ var newStates = {};
 273     states.forEach(function(state) { newStates[state.Type] = state; });
 274     this.deviceStates = newStates;
 275   },
 276
 277   /**
 278    * networkingPrivate.getNetworksState callback.
 279    * @param {!Array<!CrOnc.NetworkStateProperties>} states The state properties
 280    *     for all visible networks.
 281    * @private
 282    */
 283   getNetworksCallback_: function(states) {
 284     // Clear any current networks.
 285     this.networkIds_ = {};
 286
 287     // Track the first (active) state for each type.
 288     var foundTypes = {};
 289
 290     // Complete list of states by type.
 291     /** @type {!NetworkStateListObject} */ var networkStateLists = {
 292       Ethernet: [],
 293       WiFi: [],
 294       Cellular: [],
 295       WiMAX: [],
 296       VPN: []
 297     };
 298
 299     states.forEach(function(state) {
 300       var type = state.Type;
 301       if (!foundTypes[type]) {
 302         foundTypes[type] = true;
 303         this.updateNetworkState_(type, state);
 304       }
 305       networkStateLists[type].push(state);
 306     }, this);
 307
 308     // Set any types with a deviceState and no network to a default state,
 309     // and any types not found to null.
 310     NETWORK_TYPES.forEach(function(type) {
 311       if (!foundTypes[type]) {
 312         /** @type {CrOnc.NetworkStateProperties} */ var defaultState = null;
 313         if (this.deviceStates[type])
 314           defaultState = { GUID: '', Type: type };
 315         this.updateNetworkState_(type, defaultState);
 316       }
 317     }, this);
 318
 319     this.networkStateLists = networkStateLists;
 320
 321     // Create a VPN entry in deviceStates if there are any VPN networks.
 322     if (networkStateLists.VPN && networkStateLists.VPN.length > 0) {
 323       var vpn = { Type: CrOnc.Type.VPN, State: 'Enabled' };
 324       this.set('deviceStates.VPN', vpn);
 325     }
 326   },
 327
 328   /**
 329    * Sets 'networkStates[type]' which will update the network-list-item
 330    * associated with 'type'.
 331    * @param {string} type The network type.
 332    * @param {?CrOnc.NetworkStateProperties} state The state properties for the
 333    *     network to associate with |type|. May be null if there are no networks
 334    *     matching |type|.
 335    * @private
 336    */
 337   updateNetworkState_: function(type, state) {
 338     this.set('networkStates.' + type, state);
 339     if (state)
 340       this.networkIds_[state.GUID] = true;
 341   },
 342 });
 343 })();