Bug 1009327 - Add "manual connect" to Android about:devices page. r=mfinkle

mobile/android/chrome/content/aboutDevices.js

@@ -36,6 +36,11 @@ var Devices = {
       this.updateDeviceList();
     }, false);
 
+    let manual = document.getElementById("connect");
+    manual.addEventListener("click", (evt) => {
+      this.connectManually(evt);
+    }, false);
+
     this._savedSearchInterval = SimpleServiceDiscovery.search(SEARCH_INTERVAL_IN_MILLISECONDS);
 
     this.updateDeviceList();
@@ -87,6 +92,46 @@ var Devices = {
       this.updateDeviceList();
     }
   },
+
+  _fixedTargetForType: function(type, ip) {
+    let fixedTarget = {};
+    if (type == "roku") {
+      fixedTarget.target = "roku:ecp";
+      fixedTarget.location = "http://" + ip + ":8060";
+    } else if (type == "chromecast") {
+      fixedTarget.target = "urn:dial-multiscreen-org:service:dial:1";
+      fixedTarget.location = "http://" + ip + ":8008";
+    }
+    return fixedTarget;
+  },
+
+  connectManually: function(evt) {
+    // Since there is no form submit event, this is not validated. However,
+    // after we process this event, the element's validation state is updated.
+    let ip = document.getElementById("ip");
+    if (!ip.checkValidity()) {
+      dump("Manually entered IP address is not valid!");
+      return;
+    }
+
+    let fixedTargets = [];
+    try {
+      fixedTargets = JSON.parse(Services.prefs.getCharPref("browser.casting.fixedTargets"));
+    } catch (e) {}
+
+    let type = document.getElementById("type").value;
+    let fixedTarget = this._fixedTargetForType(type, ip.value);
+
+    // Early abort if we're already looking for this target.
+    if (fixedTargets.indexOf(fixedTarget) > -1)
+      return;
+
+    fixedTargets.push(fixedTarget);
+    Services.prefs.setCharPref("browser.casting.fixedTargets", JSON.stringify(fixedTargets));
+
+    // The backend does not yet listen for pref changes, so we trigger a scan.
+    this.updateDeviceList();
+  },
 };
 
 window.addEventListener("load", Devices.init.bind(Devices), false);

mobile/android/chrome/content/aboutDevices.xhtml

@@ -30,6 +30,20 @@
 
   <button id="refresh">&aboutDevices.refresh;</button>
 
+  <h1>&aboutDevices.addDeviceHeader;</h1>
+
+  <div id="manual">
+    <select id="type">
+      <option value="roku">&aboutDevices.roku;</option>
+      <option value="chromecast">&aboutDevices.chromecast;</option>
+    </select>
+
+    <input id="ip" type="text" required="required"
+           pattern="((^|\.)((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]?\d))){4}$"
+           placeholder="&aboutDevices.placeholder;" />
+    <button id="connect">&aboutDevices.connectManually;</button>
+  </div>
+
   <script type="text/javascript;version=1.8" src="chrome://browser/content/aboutDevices.js"></script>
 </body>
 </html>

mobile/android/locales/en-US/chrome/aboutDevices.dtd

@@ -5,3 +5,10 @@
 <!ENTITY aboutDevices.title              "Devices">
 <!ENTITY aboutDevices.header             "Your devices">
 <!ENTITY aboutDevices.refresh            "Refresh">
+<!ENTITY aboutDevices.addDeviceHeader    "Add a device">
+<!ENTITY aboutDevices.roku               "Roku">
+<!ENTITY aboutDevices.chromecast         "Chromecast">
+<!-- Localization note (aboutDevices.placeholder): this is the hint shown to the
+     user prompting them to input the IP address of a casting device. -->
+<!ENTITY aboutDevices.placeholder        "IP address">
+<!ENTITY aboutDevices.connectManually    "Connect manually">