MD Settings: Bluetooth: Use CrScrollableBehavior

chrome/browser/resources/settings/bluetooth_page/bluetooth_page.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
  * 'settings-bluetooth-page' is the settings page for managing bluetooth
  *  properties and devices.
  *
  * Example:
@@ skipping 14 matching lines @@
   /**
    * Set this to provide a fake implementation for testing.
    * @type {BluetoothPrivate}
    */
   bluetoothPrivateApiForTest: null,
 };
 
 Polymer({
   is: 'settings-bluetooth-page',
 
-  behaviors: [
-    I18nBehavior,
-  ],
+  behaviors: [I18nBehavior, CrScrollableBehavior],
 
   properties: {
     /** Whether bluetooth is enabled. */
     bluetoothEnabled: {
       type: Boolean,
       value: false,
       observer: 'bluetoothEnabledChanged_',
     },
 
     /** Whether the device list is expanded. */
     deviceListExpanded: {
       type: Boolean,
       value: false,
     },
 
     /**
      * The cached bluetooth adapter state.
      * @type {!chrome.bluetooth.AdapterState|undefined}
      */
     adapterState: Object,
 
     /**
      * The ordered list of bluetooth devices.
      * @type {!Array<!chrome.bluetooth.Device>}
      */
     deviceList: {
       type: Array,
-      value: function() { return []; },
+      value: function() {
+        return [];
+      },
     },
 
     /**
+     * Reflects the iron-list selecteditem property.
+     * @type {!chrome.bluetooth.Device}
+     */
+    selectedItem: {
+      type: Object,
+      observer: 'selectedItemChanged_',
+    },
+
+    /**
      * Set to the name of the dialog to show. This page uses a single
      * paper-dialog to host one of three dialog elements, 'addDevice',
      * 'pairDevice', or 'connectError'. This allows a seamless transition
      * between dialogs. Note: This property should be set before opening the
      * dialog and setting the property will not itself cause the dialog to open.
      */
     dialogId: String,
 
     /**
      * Current Pairing device.
@@ skipping 105 matching lines @@
           this.bluetoothDeviceUpdatedListener_);
       this.bluetooth.onDeviceChanged.removeListener(
           this.bluetoothDeviceUpdatedListener_);
     }
     if (this.bluetoothDeviceRemovedListener_) {
       this.bluetooth.onDeviceRemoved.removeListener(
           this.bluetoothDeviceRemovedListener_);
     }
   },
 
+  /** @private */
   bluetoothEnabledChanged_: function() {
     // When bluetooth is enabled, auto-expand the device list.
     if (this.bluetoothEnabled)
       this.deviceListExpanded = true;
   },
 
+  /** @private */
+  selectedItemChanged_: function() {
+    if (this.selectedItem)
+      this.connectDevice_(this.selectedItem);
+  },
+
   /**
    * @param {boolean} bluetoothEnabled
    * @param {boolean} deviceListExpanded
    * @return {boolean} Whether the <iron-collapse> can be shown.
    * @private
    */
   canShowDeviceList_: function(bluetoothEnabled, deviceListExpanded) {
     return bluetoothEnabled && deviceListExpanded;
   },
 
   /**
    * If bluetooth is enabled, request the complete list of devices and update
    * |deviceList|.
    * @private
    */
   updateDeviceList_: function() {
     if (!this.bluetoothEnabled) {
       this.deviceList = [];
       return;
     }
     this.bluetooth.getDevices(function(devices) {
       this.deviceList = devices;
+      this.updateScrollableContents();
     }.bind(this));
   },
 
   /**
    * Event called when a user action changes the bluetoothEnabled state.
    * @private
    */
   onBluetoothEnabledChange_: function() {
     this.bluetoothPrivate.setAdapterState(
         {powered: this.bluetoothEnabled}, function() {
@@ skipping 22 matching lines @@
    * @private
    */
   onBluetoothDeviceUpdated_: function(device) {
     var address = device.address;
     if (this.dialogId && this.pairingDevice &&
         this.pairingDevice.address == address) {
       this.pairingDevice = device;
     }
     var index = this.getDeviceIndex_(address);
     if (index >= 0) {
-      // Use splice to update the item in order to update the dom-repeat lists.
-      // See https://github.com/Polymer/polymer/issues/3254.
-      this.splice('deviceList', index, 1, device);
+      this.set('deviceList.' + index, device);
       return;
     }
     this.push('deviceList', device);
   },
 
   /**
    * Process bluetooth.onDeviceRemoved events.
    * @param {!chrome.bluetooth.Device} device
    * @private
    */
@@ skipping 62 matching lines @@
     if (e.pairing == chrome.bluetoothPrivate.PairingEventType.KEYS_ENTERED &&
         e.passkey === undefined && this.pairingEvent) {
       // 'keysEntered' event might not include the updated passkey so preserve
       // the current one.
       e.passkey = this.pairingEvent.passkey;
     }
     this.pairingEvent = e;
   },
 
   /** @private */
-  onAddDeviceTap_: function() { this.openDialog_('addDevice'); },
+  onAddDeviceTap_: function() {
+    this.openDialog_('addDevice');
+  },
 
   /**
    * @param {!{detail: {action: string, device: !chrome.bluetooth.Device}}} e
    * @private
    */
   onDeviceEvent_: function(e) {
     var action = e.detail.action;
     var device = e.detail.device;
     if (action == 'connect')
       this.connectDevice_(device);
@@ skipping 39 matching lines @@
         return i;
     }
     return -1;
   },
 
   /**
    * @param {!chrome.bluetooth.Device} device
    * @return {string} The text to display for |device| in the device list.
    * @private
    */
-  getDeviceName_: function(device) { return device.name || device.address; },
-
-  /**
-   * @param {!chrome.bluetooth.Device} device
-   * @return {boolean}
-   * @private
-   */
-  deviceIsPairedOrConnecting_: function(device) {
-    return !!device.paired || !!device.connecting;
+  getDeviceName_: function(device) {
+    return device.name || device.address;
   },
 
   /**
+   * @return {!Array<!chrome.bluetooth.Device>}
+   * @private
+   */
+  getPairedOrConnecting_: function() {
+    return this.deviceList.filter(function(device) {
+      return !!device.paired || !!device.connecting;
+    });
+  },
+
+  /**
    * @param {Object} deviceListChanges Changes to the deviceList Array.
    * @return {boolean} True if deviceList contains any paired devices.
    * @private
    */
   haveDevices_: function(deviceListChanges) {
-    return this.deviceList.findIndex(function(d) { return !!d.paired; }) != -1;
+    return this.deviceList.findIndex(function(d) {
+      return !!d.paired;
+    }) != -1;
   },
 
   /**
    * @param {!chrome.bluetooth.Device} device
    * @private
    */
   connectDevice_: function(device) {
     // If the device is not paired, show the pairing dialog.
     if (!device.paired) {
       // Set the pairing device and clear any pairing event.
@@ skipping 64 matching lines @@
       this.updateDeviceList_();
     }.bind(this));
   },
 
   /**
    * @param {string} dialogId
    * @param {string} dialogToShow The name of the dialog.
    * @return {boolean}
    * @private
    */
-  dialogIsVisible_(dialogId, dialogToShow) { return dialogToShow == dialogId; },
+  dialogIsVisible_(dialogId, dialogToShow) {
+    return dialogToShow == dialogId;
+  },
 
   /**
    * @param {string} dialogId
    * @private
    */
   openDialog_: function(dialogId) {
     if (this.dialogId) {
       // Dialog already opened, just update the contents.
       this.dialogId = dialogId;
       return;
     }
     this.dialogId = dialogId;
     // Call flush so that the dialog gets sized correctly before it is opened.
     Polymer.dom.flush();
     var dialog = this.$$('#deviceDialog');
     dialog.open();
     this.startDiscovery_();
   },
 
   /** @private */
   onDialogClosed_: function() {
     this.stopDiscovery_();
     this.dialogId = '';
     this.pairingDevice = null;
     this.pairingEvent = null;
   },
 });