bluetooth: Add Device connection logic and accompanying user interface.

chrome/browser/resources/bluetooth_internals/bluetooth_internals.js

Index: chrome/browser/resources/bluetooth_internals/bluetooth_internals.js
diff --git a/chrome/browser/resources/bluetooth_internals/bluetooth_internals.js b/chrome/browser/resources/bluetooth_internals/bluetooth_internals.js
index 4057293273bc1ddaa7726553896bef63b21fd86d..b5650775ec3b74636a7e654f3ebbf8d83cead834 100644
--- a/chrome/browser/resources/bluetooth_internals/bluetooth_internals.js
+++ b/chrome/browser/resources/bluetooth_internals/bluetooth_internals.js
@@ -31,6 +31,28 @@ cr.define('bluetooth_internals', function() {
         response.devices.forEach(devices.addOrUpdate,
                                  devices /* this */);
 
+        // TODO(crbug.com/663470): Move subscribe statements to DevicesView when
+        // it's added.
+        bluetooth_internals.subscribe('connectrequest', function(event) {

[ortuno, 2016/11/09 03:24:03]

I think we want to do this the other way around. DeviceTable shouldn't know
about bluetooth_internals. It should just know that is has an explore button and
that it will notify of the event to whoever is listening. So I would move
publish/subscribe to device_table and subscribe from bluetooth internals:

(Also it would be nice if we could use known concepts like addEventListener; has
there been any progress on using web components? If not then subscribe is fine
for now.)

// bluetooth_internals.js
deviceTable.subscribe('explorerequest', {
  // connect and update DeviceCollection.
});

// device_table.js
handleConnectBtn_: function(index) {
  var event = new CustomEvent('connectrequest', {
    detail: {
      index: index,
    }
  });
  dispatchEvent_(event);
},
dispatchEvent_: funtion(event) {
  // for each subscription
  subscription(event);
},

[mbrunson, 2016/11/09 23:39:37]

We can use addEventListener on DeviceTable since it's an HTMLElement which
inherits from EventTarget. Done.

+          var index = event.detail.index;
+          var device = devices.item(index);
+
+          if (device.proxy) {
+            device.disconnect();
+            devices.updateConnectionStatus(index);
+          } else {
+            device.connect().then(function() {
+              devices.updateConnectionStatus(index);
+
+              device.getServices().then(function() {
+                devices.updateIndex(index);
+              });
+            }).catch(function(error) {
+              devices.updateConnectionStatus(index, error);
+            });
+          }
+        });

[ortuno, 2016/11/09 03:24:03]

Should this be bound to bluetooth_internals?

[mbrunson, 2016/11/09 23:39:37]

It doesn't really need to be.

+
         var deviceTable = new device_table.DeviceTable();
         deviceTable.setDevices(devices);
         document.body.appendChild(deviceTable);
@@ -38,7 +60,26 @@ cr.define('bluetooth_internals', function() {
       .catch(function(error) { console.error(error); });
   }
 
+  var eventHandlersMap = new Map();
+
+  function publish(event) {
+    var handlers = eventHandlersMap.get(event.type);
+    handlers.forEach(function(handler) {
+      handler(event);
+    });
+  }
+
+  function subscribe(eventName, delegate) {
+    if (!eventHandlersMap.has(eventName)) {
+      eventHandlersMap.set(eventName, []);
+    }
+
+    eventHandlersMap.get(eventName).push(delegate);
+  }
+
   return {
+    publish: publish,
+    subscribe: subscribe,
     initializeViews: initializeViews
   };