bluetooth: Add device details page with basic properties to internals page.

chrome/browser/resources/bluetooth_internals/device_table.js

Index: chrome/browser/resources/bluetooth_internals/device_table.js
diff --git a/chrome/browser/resources/bluetooth_internals/device_table.js b/chrome/browser/resources/bluetooth_internals/device_table.js
index be9e4b0ebcea62c9ce6e8a529f8d4b915756de8a..0f3f1e81dd82500fc99dc3257b51973c66a67132 100644
--- a/chrome/browser/resources/bluetooth_internals/device_table.js
+++ b/chrome/browser/resources/bluetooth_internals/device_table.js
@@ -13,7 +13,7 @@ cr.define('device_table', function() {
     RSSI: 2,
     SERVICES: 3,
     CONNECTION_STATE: 4,
-    INSPECT_LINK: 5,
+    LINKS: 5,

[scheib, 2017/01/11 02:16:14]

In screenshot the links column doesn't have a header cell, and looks a bit odd
IMHO without one. Maybe it doesn't need text as a label, but having the top
header row be full width would be visually nicer.

[mbrunson, 2017/01/11 21:22:59]

Done.

   };
 
   /**
@@ -61,18 +61,33 @@ cr.define('device_table', function() {
     },
 
     /**
-     * Updates table row on change event of the device collection.
+     * Fires a forget pressed event for the row |index|.
+     * @param {number} index
      * @private
+     */
+    handleForgetClick_: function(index) {
+      var event = new CustomEvent('forgetpressed', {
+        bubbles: true,
+        detail: {
+          address: this.devices_.item(index).address,
+        }
+      });
+      this.dispatchEvent(event);
+    },
+
+    /**
+     * Updates table row on change event of the device collection.
      * @param {!Event} event
+     * @private
      */
     handleChange_: function(event) {
       this.updateRow_(this.devices_.item(event.index), event.index);
     },
 
     /**
-     * Fires a inspect pressed event for the row |index|.
-     * @private
+     * Fires an inspect pressed event for the row |index|.
      * @param {number} index
+     * @private
      */
     handleInspectClick_: function(index) {
       var event = new CustomEvent('inspectpressed', {
@@ -86,8 +101,8 @@ cr.define('device_table', function() {
 
     /**
      * Updates table row on splice event of the device collection.
-     * @private
      * @param {!Event} event
+     * @private
      */
     handleSplice_: function(event) {
       event.removed.forEach(function() {
@@ -101,9 +116,9 @@ cr.define('device_table', function() {
 
     /**
      * Inserts a new row at |index| and updates it with info from |device|.
-     * @private
      * @param {!interfaces.BluetoothDevice.DeviceInfo} device
      * @param {?number} index
+     * @private
      */
     insertRow_: function(device, index) {
       var row = this.body_.insertRow(index);
@@ -117,11 +132,19 @@ cr.define('device_table', function() {
       var inspectCell = row.insertCell();
 
       var inspectLink = document.createElement('a', 'action-link');
+      inspectLink.textContent = 'Inspect';
       inspectCell.appendChild(inspectLink);
       inspectLink.addEventListener('click', function() {
         this.handleInspectClick_(row.sectionRowIndex);
       }.bind(this));
 
+      var forgetLink = document.createElement('a', 'action-link');
+      forgetLink.textContent = 'Forget';
+      inspectCell.appendChild(forgetLink);
+      forgetLink.addEventListener('click', function() {
+        this.handleForgetClick_(row.sectionRowIndex);
+      }.bind(this));
+
       this.updateRow_(device, row.sectionRowIndex);
     },
 
@@ -142,9 +165,9 @@ cr.define('device_table', function() {
 
     /**
      * Updates the row at |index| with the info from |device|.
-     * @private
      * @param {!interfaces.BluetoothDevice.DeviceInfo} device
      * @param {number} index
+     * @private
      */
     updateRow_: function(device, index) {
       var row = this.body_.rows[index];
@@ -152,20 +175,8 @@ cr.define('device_table', function() {
 
       row.classList.toggle('removed', device.removed);
 
-      var inspectLink = row.cells[COLUMNS.INSPECT_LINK].children[0];
-      inspectLink.disabled = false;
-      switch (device.connectionStatus) {
-        case device_collection.ConnectionStatus.DISCONNECTED:
-          inspectLink.textContent = 'Inspect';
-          break;
-        case device_collection.ConnectionStatus.CONNECTED:
-          inspectLink.textContent = 'Forget';
-          break;
-        case device_collection.ConnectionStatus.CONNECTING:
-          inspectLink.disabled = true;
-          break;
-        default: assert('case not handled');
-      }
+      var forgetLink = row.cells[COLUMNS.LINKS].children[1];
+      forgetLink.disabled = !device.inspecting;
 
       // Update the properties based on the header field path.
       for (var i = 0; i < this.headers_.length; i++) {