bluetooth: Componentize device list in chrome://bluetooth-internals.

chrome/browser/resources/bluetooth_internals/bluetooth_internals.html

Index: chrome/browser/resources/bluetooth_internals/bluetooth_internals.html
diff --git a/chrome/browser/resources/bluetooth_internals/bluetooth_internals.html b/chrome/browser/resources/bluetooth_internals/bluetooth_internals.html
index 28b85ba406ae71df750552831aa4d12064560a70..2a6760c56dab78ba8eb773549abf7e923a124848 100644
--- a/chrome/browser/resources/bluetooth_internals/bluetooth_internals.html
+++ b/chrome/browser/resources/bluetooth_internals/bluetooth_internals.html
@@ -8,8 +8,17 @@
   <title>Bluetooth Internals</title>
   <link rel="stylesheet" href="chrome://resources/css/text_defaults_md.css">
   <link rel="stylesheet" href="bluetooth_internals.css">
+  <link rel="import" href="chrome://resources/html/cr/ui.html">

[Dan Beam, 2016/11/09 18:00:32]

is there a reason you're importing just one of these as an .html import?  can we
use that for all these <script>s or make new .html files if they don't exist? 
this is a good way to de-duplicate.

followup note: this doesn't need to run on iOS, right?

[mbrunson, 2016/11/10 01:02:13]

It was mainly so others and myself know exactly what I'm importing. It can
change these to html imports though.

It doesn't need to run on iOS as far as I know.

+
   <script src="chrome://resources/js/assert.js"></script>
+  <script src="chrome://resources/js/cr/event_target.js"></script>
+  <script src="chrome://resources/js/cr/ui/array_data_model.js"></script>
   <script src="chrome://resources/js/util.js"></script>
+
+  <script src="interfaces.js"></script>
+  <script src="adapter_broker.js"></script>
+  <script src="device_collection.js"></script>
+  <script src="device_table.js"></script>
   <script src="bluetooth_internals.js"></script>
 </head>
 
@@ -19,25 +28,20 @@
       Bluetooth Internals
     </div>
   </header>
-  <table id="device-table">
+</body>
+
+<template id="table-template">
+  <table>
     <thead>
       <tr>
-        <th>Name</th>
-        <th>Address</th>
-        <th>Latest RSSI</th>
+        <th data-field="name_for_display">Name</th>
+        <th data-field="address">Address</th>
+        <th data-field="rssi.value">Latest RSSI</th>
       </tr>
     </thead>
-    <tbody id="device-list">
+    <tbody class="table-body">
     </tbody>
   </table>
-</body>
-
-<template id="device-row-template">
-  <tr class="device-row">
-    <td class="device-name" data-label="Name"></td>
-    <td class="device-address" data-label="Address"></td>
-    <td class="device-rssi" data-label="Latest RSSI">Unknown</td>
-  </tr>
 </template>
 
 </html>