bluetooth: Add sidebar and page manager for chrome://bluetooth-internals.

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 2826f2e4ad0ae6a37db2da5922cda04d730efbc4..fae905b15c3c2c41d86e8f7b8e7d02d1c3a17aa1 100644
--- a/chrome/browser/resources/bluetooth_internals/bluetooth_internals.js
+++ b/chrome/browser/resources/bluetooth_internals/bluetooth_internals.js
@@ -12,81 +12,98 @@ var adapterBroker = null;
 var devices = null;
 
 cr.define('bluetooth_internals', function() {
+  /** @const */ var DevicesPage = devices_page.DevicesPage;
+  /** @const */ var PageManager = cr.ui.pageManager.PageManager;
 
   /** @type {!Map<string, !interfaces.BluetoothDevice.Device.proxyClass>} */
   var deviceAddressToProxy = new Map();
 
+  /** @type {!device_collection.DeviceCollection} */
+  devices = new device_collection.DeviceCollection([]);
+
+  function setupDeviceSystem(response) {
+    // Hook up device collection events.
+    adapterBroker.addEventListener('deviceadded', function(event) {
+      devices.addOrUpdate(event.detail.deviceInfo);
+    });
+    adapterBroker.addEventListener('devicechanged', function(event) {
+      devices.addOrUpdate(event.detail.deviceInfo);
+    });
+    adapterBroker.addEventListener('deviceremoved', function(event) {
+      devices.remove(event.detail.deviceInfo);
+    });
+
+    response.devices.forEach(devices.addOrUpdate, devices /* this */);
+
+    var devicesPage = DevicesPage.getInstance();
+    devicesPage.setDevices(devices);
+    devicesPage.pageDiv.addEventListener('inspectpressed', function() {
+      // TODO(crbug.com/663470): Move connection logic to DeviceDetailsView
+      // when it's added in chrome://bluetooth-internals.
+      var address = event.detail.address;
+      var proxy = deviceAddressToProxy.get(address);
+
+      if (proxy) {
+        // Device is already connected, so disconnect.
+        proxy.disconnect();
+        deviceAddressToProxy.delete(address);
+        devices.updateConnectionStatus(
+            address, device_collection.ConnectionStatus.DISCONNECTED);
+        return;
+      }
+
+      devices.updateConnectionStatus(
+          address, device_collection.ConnectionStatus.CONNECTING);
+
+      adapterBroker.connectToDevice(address).then(function(deviceProxy) {
+        if (!devices.getByAddress(address)) {
+          // Device no longer in list, so drop the connection.
+          deviceProxy.disconnect();
+          return;
+        }
+
+        deviceAddressToProxy.set(address, deviceProxy);
+        devices.updateConnectionStatus(
+            address, device_collection.ConnectionStatus.CONNECTED);
+
+        // Fetch services asynchronously.
+        return deviceProxy.getServices();
+      }).then(function(response) {
+        if (!response) return;
+
+        var deviceInfo = devices.getByAddress(address);
+        deviceInfo.services = response.services;
+        devices.addOrUpdate(deviceInfo);
+      }).catch(function(error) {
+        devices.updateConnectionStatus(
+            address,
+            device_collection.ConnectionStatus.DISCONNECTED,
+            error);
+      });
+    });
+  }
+
+  function setupPages() {
+    var sidebar = new window.sidebar.Sidebar('sidebar', 'overlay');

[ortuno, 2016/12/06 10:16:05]

optional nit: I think passing the element would make this clearer new
window.sidebar.Sidebar($('sidebar'));

[mbrunson, 2016/12/07 01:12:14]

Ah. I agree. Done.

+    PageManager.addObserver(sidebar);
+    $('menu-btn').addEventListener('click', function() { sidebar.open(); });
+
+    var devicesPage = DevicesPage.getInstance();

[ortuno, 2016/12/06 10:16:05]

I think we should ask someone from WebUI if there are any technical reasons why
we have to use the singleton pattern. IMO explicitly initializing the page here
would be clearer.

[mbrunson, 2016/12/07 01:12:14]

There doesn't seem to be a technical reason. It works fine either way and there
are a few places that just use "new". I'll stray away from the singleton pattern
for now.

+
+    PageManager.register(devicesPage);
+    PageManager.initialize(devicesPage);
+    PageManager.showDefaultPage();
+  }
+
   function initializeViews() {
+    setupPages();
+
     adapter_broker.getAdapterBroker()
       .then(function(broker) { adapterBroker = broker; })
       .then(function() { return adapterBroker.getInfo(); })
       .then(function(response) { console.log('adapter', response.info); })
       .then(function() { return adapterBroker.getDevices(); })
-      .then(function(response) {
-        // Hook up device collection events.
-        devices = new device_collection.DeviceCollection([]);
-        adapterBroker.addEventListener('deviceadded', function(event) {
-          devices.addOrUpdate(event.detail.deviceInfo);
-        });
-        adapterBroker.addEventListener('devicechanged', function(event) {
-          devices.addOrUpdate(event.detail.deviceInfo);
-        });
-        adapterBroker.addEventListener('deviceremoved', function(event) {
-          devices.remove(event.detail.deviceInfo);
-        });
-
-        response.devices.forEach(devices.addOrUpdate,
-                                 devices /* this */);
-
-        var deviceTable = new device_table.DeviceTable();
-
-        deviceTable.addEventListener('inspectpressed', function(event) {
-          // TODO(crbug.com/663470): Move connection logic to DeviceDetailsView
-          // when it's added in chrome://bluetooth-internals.
-          var address = event.detail.address;
-          var proxy = deviceAddressToProxy.get(address);
-
-          if (proxy) {
-            // Device is already connected, so disconnect.
-            proxy.disconnect();
-            deviceAddressToProxy.delete(address);
-            devices.updateConnectionStatus(
-                address, device_collection.ConnectionStatus.DISCONNECTED);
-            return;
-          }
-
-          devices.updateConnectionStatus(
-              address, device_collection.ConnectionStatus.CONNECTING);
-          adapterBroker.connectToDevice(address).then(function(deviceProxy) {
-            if (!devices.getByAddress(address)) {
-              // Device no longer in list, so drop the connection.
-              deviceProxy.disconnect();
-              return;
-            }
-
-            deviceAddressToProxy.set(address, deviceProxy);
-            devices.updateConnectionStatus(
-                address, device_collection.ConnectionStatus.CONNECTED);
-
-            // Fetch services asynchronously.
-            return deviceProxy.getServices();
-          }).then(function(response) {
-            var deviceInfo = devices.getByAddress(address);
-            deviceInfo.services = response.services;
-            devices.addOrUpdate(deviceInfo);
-          }).catch(function(error) {
-            devices.updateConnectionStatus(
-                address,
-                device_collection.ConnectionStatus.DISCONNECTED,
-                error);
-          });
-        });
-
-        deviceTable.setDevices(devices);
-        deviceTable.id = 'device-table';
-
-        document.body.appendChild(deviceTable);
-      })
+      .then(setupDeviceSystem)
       .catch(function(error) { console.error(error); });
   }