Implement local media casting

ext/src/main.js

@@ -80,10 +80,19 @@ browser.menus.create({
   , targetUrlPatterns: [
         "http://*/*"
       , "https://*/*"
+      , "file://*/*"
     ]
   , title: _("context_media_cast")
 });
 
+
+let mediaCastTabId;
+let mediaCastFrameId;
+
+let mirrorCastTabId;
+let mirrorCastFrameId;
+
+
 browser.menus.onClicked.addListener(async (info, tab) => {
     const { frameId } = info;
 
@@ -95,6 +104,9 @@ browser.menus.onClicked.addListener(async (info, tab) => {
 
     switch (info.menuItemId) {
         case "contextCast":
+            mirrorCastTabId = tab.id;
+            mirrorCastFrameId = frameId;
+
             await browser.tabs.executeScript(tab.id, {
                 code: `const selectedMedia = "${info.pageUrl ? "tab" : "screen"}";`
               , frameId
@@ -108,6 +120,9 @@ browser.menus.onClicked.addListener(async (info, tab) => {
             break;
 
         case "contextCastMedia":
+            mediaCastTabId = tab.id;
+            mediaCastFrameId = frameId;
+
             // Pass media URL to media sender app
             await browser.tabs.executeScript(tab.id, {
                 code: `const srcUrl = "${info.srcUrl}";`
@@ -145,6 +160,8 @@ function initBridge (tabId, frameId) {
         // TODO: Integrate into messageRouter
         if (message.subject.startsWith("shim:")) {
             browser.tabs.sendMessage(tabId, message, { frameId });
+        } else {
+            messageRouter.handleMessage(message);
         }
     });
 }
@@ -220,6 +237,7 @@ messageRouter.register("main", async (message, sender) => {
 });
 
 messageRouter.register("bridge", (message, sender) => {
+    console.log(message);
     bridgeMap.get(sender.tab.id).postMessage(message);
 });
 
@@ -238,6 +256,16 @@ messageRouter.register("popup", (message, sender) => {
     }
 });
 
+messageRouter.register("mirrorCast", message => {
+    browser.tabs.sendMessage(mirrorCastTabId, message
+          , { frameId: mirrorCastFrameId });
+});
+messageRouter.register("mediaCast", message => {
+    browser.tabs.sendMessage(mediaCastTabId, message
+          , { frameId: mediaCastFrameId });
+});
+
+
 browser.runtime.onMessage.addListener((message, sender) => {
     messageRouter.handleMessage(message, sender);
 });

ext/src/mediaCast.js

@@ -7,7 +7,35 @@ let logMessage;
 let session;
 let currentMedia;
 
-let mediaElement = document.querySelector(`[src="${srcUrl}"]`);
+
+const isLocalFile = window.location.protocol === "file:";
+
+const mediaElement = isLocalFile
+    ? document.querySelector("video, audio")
+    : document.querySelector(`[src="${srcUrl}"]`);
+
+window.addEventListener("beforeunload", () => {
+    browser.runtime.sendMessage({
+        subject: "bridge:stopHttpServer"
+    });
+});
+
+function getLocalAddress () {
+    const pc = new RTCPeerConnection();
+    pc.createDataChannel(null);
+    pc.createOffer().then(pc.setLocalDescription.bind(pc));
+
+    return new Promise((resolve, reject) => {
+        pc.addEventListener("icecandidate", ev => {
+            if (ev.candidate) {
+                resolve(ev.candidate.candidate.split(" ")[4]);
+            }
+        });
+        pc.addEventListener("error", ev => {
+            reject();
+        });
+    });
+}
 
 // TODO: Fix this broken mess
 let ignoreMediaEvents = false;
@@ -88,12 +116,39 @@ mediaElement.addEventListener("volumechange", () => {
 });
 
 
-function onRequestSessionSuccess (session_) {
+async function onRequestSessionSuccess (session_) {
     logMessage("onRequestSessionSuccess");
 
     session = session_;
 
-    const mediaUrl = new URL(srcUrl);
+    let mediaUrl = new URL(srcUrl);
+
+    // TODO: Get from extension settings
+    const port = 9555;
+
+
+    if (isLocalFile) {
+        await new Promise((resolve, reject) => {
+            browser.runtime.sendMessage({
+                subject: "bridge:startHttpServer"
+              , data: {
+                    filePath: decodeURI(mediaUrl.pathname)
+                  , port
+                }
+            });
+
+            browser.runtime.onMessage.addListener(function onMessage (message) {
+                if (message.subject === "mediaCast:httpServerStarted") {
+                    browser.runtime.onMessage.removeListener(onMessage);
+                    resolve();
+                }
+            });
+        });
+
+        // Address of local HTTP server
+        mediaUrl = new URL(`http://${await getLocalAddress()}:${port}/`);
+    }
+
     const mediaInfo = new chrome.cast.media.MediaInfo(mediaUrl.href);
 
     // Media metadata (title/poster)