MD Settings: Internet: Enable SIM unlock with no cellular network

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

 // Copyright 2015 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.
 
 /**
  * @fileoverview Polymer element for displaying the network state for a specific
  * type and a list of networks for that type.
  */
 
 /** @typedef {chrome.networkingPrivate.DeviceStateProperties} */
 var DeviceStateProperties;
 
 Polymer({
   is: 'network-summary-item',
 
+  behaviors: [Polymer.IronA11yKeysBehavior],
+
   properties: {
     /**
      * Device state for the network type.
      * @type {DeviceStateProperties|undefined}
      */
     deviceState: {
       type: Object,
       observer: 'deviceStateChanged_',
     },
 
     /**
      * Network state for the active network.
      * @type {!CrOnc.NetworkStateProperties|undefined}
      */
-    activeNetworkState: {
-      type: Object,
-      observer: 'activeNetworkStateChanged_',
-    },
+    activeNetworkState: Object,
 
     /**
      * List of all network state data for the network type.
      * @type {!Array<!CrOnc.NetworkStateProperties>}
      */
     networkStateList: {
       type: Array,
       value: function() {
         return [];
       },
-      observer: 'networkStateListChanged_',
     },
 
     /** The maximum height in pixels for the list of networks. */
     maxHeight: {
       type: Number,
       value: 200,
     },
 
     /**
+     * Interface for networkingPrivate calls, passed from internet_page.
+     * @type {NetworkingPrivate}
+     */
+    networkingPrivate: Object,
+
+    /**
      * The expanded state of the list of networks.
      * @private
      */
     expanded_: {
       type: Boolean,
       value: false,
       observer: 'expandedChanged_',
     },
 
     /**
      * Whether the list has been expanded. This is used to ensure the
      * iron-collapse section animates correctly.
      * @private
      */
     wasExpanded_: {
       type: Boolean,
       value: false,
     },
   },
 
+  keyBindings: {
+    'enter': 'onDetailsTap_',
+  },
+
   /** @private */
   expandedChanged_: function() {
     var type = this.deviceState ? this.deviceState.Type : '';
     this.fire('expanded', {expanded: this.expanded_, type: type});
   },
 
   /** @private */
   deviceStateChanged_: function() {
-    this.updateSelectable_();
     if (this.expanded_ && !this.deviceIsEnabled_())
       this.expanded_ = false;
   },
 
-  /** @private */
-  activeNetworkStateChanged_: function() {
-    this.updateSelectable_();
-  },
-
-  /** @private */
-  networkStateListChanged_: function() {
-    this.updateSelectable_();
-  },
-
   /**
    * @return {boolean} Whether or not the scanning spinner should be shown.
    * @private
    */
   showScanning_: function() {
     return !!this.expanded_ && !!this.deviceState.Scanning;
   },
 
   /**
+   * Show the <network-siminfo> element if this is a disabled and locked
+   * cellular device.
+   * @return {boolean}
+   * @private
+   */
+  showSimInfo_: function() {
+    let device = this.deviceState;
+    if (device.Type != CrOnc.Type.CELLULAR || this.deviceIsEnabled_())
+      return false;
+    return device.SimPresent === false ||
+        device.SimLockType == CrOnc.LockType.PIN ||
+        device.SimLockType == CrOnc.LockType.PUK;
+  },
+
+  /**
+   * Returns a NetworkProperties object for <network-siminfo> built from
+   * the device properties (since there will be no active network).
+   * @return {!CrOnc.NetworkProperties}
+   * @private
+   */
+  getCellularState_: function() {
+    let device = this.deviceState;
+    return {
+      GUID: '',
+      Type: CrOnc.Type.CELLULAR,
+      Cellular: {
+        SIMLockStatus: {
+          LockType: device.SimLockType || '',
+          LockEnabled: device.SimLockType != CrOnc.LockType.NONE
+        },
+        SIMPresent: device.SimPresent,
+      },
+    };
+  },
+
+  /**
    * @return {boolean} Whether or not the device state is enabled.
    * @private
    */
   deviceIsEnabled_: function() {
     return !!this.deviceState &&
         this.deviceState.State ==
         chrome.networkingPrivate.DeviceStateType.ENABLED;
   },
 
   /**
@@ skipping 21 matching lines @@
    */
   networksIronCollapseIsOpened_() {
     return this.expanded_ && this.wasExpanded_;
   },
 
   /**
    * @return {boolean}
    * @private
    */
   enableIsVisible_: function() {
-    return !!this.deviceState && this.deviceState.Type != CrOnc.Type.ETHERNET &&
+    return this.deviceState.Type != CrOnc.Type.ETHERNET &&
         this.deviceState.Type != CrOnc.Type.VPN;
   },
 
   /**
+   * @return {boolean}
+   * @private
+   */
+  showDetailsIsVisible_: function() {
+    return this.deviceState.Type == CrOnc.Type.CELLULAR &&
+        this.networkStateList.length == 1;
+  },
+
+  /**
    * @return {boolean} Whether or not to show the UI to expand the list.
    * @private
    */
   expandIsVisible_: function() {
     if (!this.deviceIsEnabled_())
       return false;
     let type = this.deviceState.Type;
     var minLength =
         (type == CrOnc.Type.WI_FI || type == CrOnc.Type.VPN) ? 1 : 2;
     return this.networkStateList.length >= minLength;
   },
 
   /**
    * @return {boolean} True if the known networks button should be shown.
    * @private
    */
   knownNetworksIsVisible_: function() {
     return !!this.activeNetworkState &&
         this.activeNetworkState.Type == CrOnc.Type.WI_FI;
   },
 
   /**
    * Event triggered when the details div is tapped.

[michaelpg, 2016/09/06 21:10:38]

document that <Enter> on this element triggers this too

[stevenjb, 2016/09/12 19:46:42]

Done.

    * @param {Event} event The enable button event.

[michaelpg, 2016/09/06 21:10:38]

!Event while you're here

[stevenjb, 2016/09/12 19:46:42]

Done.

    * @private
    */
   onDetailsTap_: function(event) {
-    if ((event.target.id == 'expandListButton') ||
+    if ((event.target && event.target.id == 'expandListButton') ||
         (this.deviceState && !this.deviceIsEnabled_())) {
       // Already handled or disabled, do nothing.
       return;
     }
     if (this.expandIsVisible_()) {
       // Expandable, toggle expand.
       this.expanded_ = !this.expanded_;
       return;
     }
     // Not expandable, fire 'selected' with |activeNetworkState|.
     this.fire('selected', this.activeNetworkState);
   },
 
   /**
+   * @param {Event} event The enable button event.

[michaelpg, 2016/09/06 21:10:38]

!Event

[stevenjb, 2016/09/12 19:46:42]

Done.

+   * @private
+   */
+  onShowDetailsTap_: function(event) {
+    if (this.activeNetworkState.GUID != '') {
+      this.fire('show-detail', this.activeNetworkState);

[michaelpg, 2016/09/06 21:10:38]

optional: early return?

[stevenjb, 2016/09/12 19:46:42]

Done.

+      event.stopPropagation();
+    }
+  },
+
+  /**
    * Event triggered when the known networks button is tapped.
    * @private
    */
   onKnownNetworksTap_: function() {
     this.fire('show-known-networks', {type: CrOnc.Type.WI_FI});
   },
 
   /**
    * Event triggered when the enable button is toggled.
    * @param {!Event} event
    * @private
    */
   onDeviceEnabledTap_: function(event) {
     var deviceIsEnabled = this.deviceIsEnabled_();
     var type = this.deviceState ? this.deviceState.Type : '';
     this.fire(
         'device-enabled-toggled', {enabled: !deviceIsEnabled, type: type});
     // Make sure this does not propagate to onDetailsTap_.
     event.stopPropagation();
   },
 
   /**
-   * Called whenever the 'selectable' state might change.
+   * @return {string}
    * @private
    */
-  updateSelectable_: function() {
-    var selectable = this.deviceIsEnabled_();
-    this.$.details.classList.toggle('selectable', selectable);
+  getTabIndex_: function() {
+    return this.deviceIsEnabled_() ? '0' : '-1';
   },
 });