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