bluetooth: Add control for reading/writing of characteristics to internals page.

chrome/browser/resources/bluetooth_internals/characteristic_list.js

Index: chrome/browser/resources/bluetooth_internals/characteristic_list.js
diff --git a/chrome/browser/resources/bluetooth_internals/characteristic_list.js b/chrome/browser/resources/bluetooth_internals/characteristic_list.js
index 7faecdeae781975a62d6ce0832217e8a5884e10a..7fb7708e975a2728bbe57f89e2e6165282b309af 100644
--- a/chrome/browser/resources/bluetooth_internals/characteristic_list.js
+++ b/chrome/browser/resources/bluetooth_internals/characteristic_list.js
@@ -45,14 +45,22 @@ cr.define('characteristic_list', function() {
    * CharacteristicInfo object.
    * @constructor
    * @param {!interfaces.BluetoothDevice.CharacteristicInfo} characteristicInfo
+   * @param {string} deviceAddress
+   * @param {string} serviceId
    */
-  function CharacteristicListItem(characteristicInfo) {
+  function CharacteristicListItem(
+      characteristicInfo, deviceAddress, serviceId) {
     var listItem = new ExpandableListItem();
     listItem.__proto__ = CharacteristicListItem.prototype;
 
+    /** @type {!interfaces.BluetoothDevice.CharacteristicInfo} */
     listItem.info = characteristicInfo;
-    listItem.decorate();
+    /** @private {string} */
+    listItem.deviceAddress_ = deviceAddress;
+    /** @private {string} */
+    listItem.serviceId_ = serviceId;
 
+    listItem.decorate();
     return listItem;
   }
 
@@ -103,6 +111,14 @@ cr.define('characteristic_list', function() {
             Property.WRITE_ENCRYPTED_AUTHENTICATED) > 0,
       });
 
+      /** @private {!value_control.ValueControl} */
+      this.valueControl_ = new value_control.ValueControl();
+      this.valueControl_.load(this.deviceAddress_, this.serviceId_, this.info);
+      this.valueControl_.setValue(this.info.last_known_value);
+
+      /** @private {!descriptor_list.DescriptorList} */
+      this.descriptorList_ = new descriptor_list.DescriptorList();
+
       // Create content for display in brief content container.
       var characteristicHeaderText = document.createElement('div');
       characteristicHeaderText.textContent = 'Characteristic:';
@@ -130,15 +146,32 @@ cr.define('characteristic_list', function() {
       propertiesDiv.classList.add('flex');
       propertiesDiv.appendChild(this.propertiesFieldSet_);
 
+      var descriptorsHeader = document.createElement('h4');
+      descriptorsHeader.textContent = 'Descriptors';
+
       var infoDiv = document.createElement('div');
       infoDiv.classList.add('info-container');
+
+      var valueHeader = document.createElement('h4');
+      valueHeader.textContent = 'Value';
+
       infoDiv.appendChild(characteristicInfoHeader);
       infoDiv.appendChild(characteristicDiv);
       infoDiv.appendChild(propertiesHeader);
       infoDiv.appendChild(propertiesDiv);
+      infoDiv.appendChild(valueHeader);
+      infoDiv.appendChild(this.valueControl_);
+      infoDiv.appendChild(descriptorsHeader);
+      infoDiv.appendChild(this.descriptorList_);
 
       this.expandedContent_.appendChild(infoDiv);
     },
+
+    /** @override */
+    onExpandInternal: function(expanded) {
+      this.descriptorList_.load(
+          this.deviceAddress_, this.serviceId_, this.info.id);
+    },
   };
 
   /**
@@ -154,6 +187,10 @@ cr.define('characteristic_list', function() {
     decorate: function() {
       ExpandableList.prototype.decorate.call(this);
 
+      /** @private {?string} */
+      this.deviceAddress_ = null;
+      /** @private {?string} */
+      this.serviceId_ = null;
       /** @private {boolean} */
       this.characteristicsRequested_ = false;
 
@@ -163,7 +200,8 @@ cr.define('characteristic_list', function() {
 
     /** @override */
     createItem: function(data) {
-      return new CharacteristicListItem(data);
+      return new CharacteristicListItem(
+          data, this.deviceAddress_, this.serviceId_);
     },
 
     /**
@@ -174,16 +212,18 @@ cr.define('characteristic_list', function() {
      * @param {string} serviceId
      */
     load: function(deviceAddress, serviceId) {
-      if (this.characteristicsRequested_ || !this.isLoading())
+      if (this.characteristicsRequested_ || !this.isSpinnerShowing())
         return;
 
+      this.deviceAddress_ = deviceAddress;
+      this.serviceId_ = serviceId;
       this.characteristicsRequested_ = true;
 
       device_broker.connectToDevice(deviceAddress).then(function(device) {
         return device.getCharacteristics(serviceId);
       }.bind(this)).then(function(response) {
         this.setData(new ArrayDataModel(response.characteristics || []));
-        this.setLoading(false);
+        this.setSpinnerShowing(false);
         this.characteristicsRequested_ = false;
       }.bind(this)).catch(function(error) {
         this.characteristicsRequested_ = false;
@@ -200,4 +240,4 @@ cr.define('characteristic_list', function() {
     CharacteristicList: CharacteristicList,
     CharacteristicListItem: CharacteristicListItem,
   };
-});
+});