routing requests to appropriate frames

js/lib/Comms.js

@@ -165,7 +165,6 @@ class CommsServer {
 
     var ths = this;
 
-
     if (BrowserDetect.firefox) {
       browser.runtime.onConnect.addListener(p => ths.onConnect(p));
       browser.runtime.onMessage.addListener(m => ths.processReceivedMessage_nonpersistent_ff(m));
@@ -215,6 +214,37 @@ class CommsServer {
     }
   }
 
+  async sendToFrame(message, tab, frame) {
+
+    if(Debug.debug && Debug.comms){
+      console.log(`%c[CommsServer::sendToFrame] attempting to send message to tab ${tab}, frame ${frame}`, "background: #dda; color: #11D", message);
+    }
+
+    if (isNaN(tab)) {
+      if (tab === '__playing') {
+        message['playing'] = true;
+        this.sendToAll(message);
+        return;
+      } else if (tab === '__all') {
+        this.sendToAll(message);
+        return;
+      }
+      [tab, frame] = tab.split('-')
+    }
+
+    if(Debug.debug && Debug.comms){
+      console.log(`%c[CommsServer::sendToFrame] attempting to send message to tab ${tab}, frame ${frame}`, "background: #dda; color: #11D", message);
+    }
+
+    try {
+      this.ports[tab][frame].postMessage(message);
+    } catch (e) {
+      if(Debug.debug && Debug.comms){
+        console.log(`%c[CommsServer::sendToFrame] Sending message failed. Reason:`, "background: #dda; color: #11D", e);
+      }
+    }
+  }
+
   async sendToActive(message) {
     if(Debug.debug && Debug.comms){
       console.log("%c[CommsServer::sendToActive] trying to send a message to active tab. Message:", "background: #dda; color: #11D", message);
@@ -286,16 +316,16 @@ class CommsServer {
       }
       port.postMessage({cmd: "set-config", conf: this.settings.active, site: this.server.currentSite})
     } else if (message.cmd === 'set-stretch') {
-      this.sendToActive(message);
+      this.sendToFrame(message, message.targetFrame);
     } else if (message.cmd === 'set-ar') {
-      this.sendToActive(message);
+      this.sendToFrame(message, message.targetFrame);
     } else if (message.cmd === 'set-custom-ar') {
       this.settings.active.keyboard.shortcuts.q.arg = message.arg;
       this.settings.save();
     } else if (message.cmd === 'set-alignment') {
-      this.sendToActive(message);
+      this.sendToFrame(message, message.targetFrame);
     } else if (message.cmd === 'autoar-start') {
-      this.sendToActive(message);
+      this.sendToFrame(message, message.targetFrame);
     } else if (message.cmd === "autoar-disable") {  // LEGACY - can be removed prolly
       this.settings.active.arDetect.mode = "disabled";
       if(message.reason){
@@ -305,7 +335,7 @@ class CommsServer {
       }
       this.settings.save();
     } else if (message.cmd === 'set-zoom') {
-      this.sendToActive(message);
+      this.sendToFrame(message, message.targetFrame);      
     } else if (message.cmd === 'has-video') {
       this.server.registerVideo(port.sender);
     } else if (message.cmd === 'noVideo') {

js/lib/libghettoui/popup/MenuItem.js

@@ -39,6 +39,7 @@ class MenuItem extends BaseElement {
     }
 
     this.subitemList[0].select();
+    return this.subitemList[0].name;
   }
 
   showSubitems() {

res/popup/js/popup.js

@@ -88,15 +88,19 @@ function loadFrames(videoTab) {
   }
 
   if (! selectedSubitem.siteSettings) {
-    tablist['siteSettings'].selectFirstSubitem();
+    selectedSubitem['siteSettings'] = tablist['siteSettings'].selectFirstSubitem();
   } else {
     tablist['siteSettings'].selectSubitem(selectedSubitem.siteSettings)
+    selectedSubitem['siteSettings'] = selectedSubitem.siteSettings.name;
   }
   if (! selectedSubitem.videoSettings) {
-    tablist['videoSettings'].selectFirstSubitem();
+    selectedSubitem['videoSettings'] = tablist['videoSettings'].selectFirstSubitem();
   } else {
     tablist['videoSettings'].selectSubitem(selectedSubitem.videoSettings);
+    selectedSubitem['videoSettings'] = selectedSubitem.videoSettings.name;
   }
+
+  console.log("SELECTED SUBITEMT:", selectedSubitem)
 }
 
 //#endregion
@@ -202,7 +206,8 @@ function basicCommandHandler(cmdArray) {
   for (cmd of cmdArray) {
     port.postMessage({
       cmd: cmd.action,
-      arg: cmd.arg
+      arg: cmd.arg,
+      targetFrame: selectedSubitem[selectedMenu]
     });
   }
 }
@@ -362,7 +367,8 @@ function configureVideoTab(site) {
     // send the command to bg script
     var command = {
       cmd: 'set-zoom',
-      zoom: newZoom
+      zoom: newZoom,
+      targetFrame: selectedSubitem[selectedMenu]
     };
 
     port.postMessage(command);
@@ -749,6 +755,7 @@ document.addEventListener("click", (e) => {
   }
   
   var command = getcmd(e);
+  command.targetFrame = selectedSubitem[selectedMenu]
 
   if(Debug.debug) {
     console.log("[popup.js] Got command (can be undefined):", command, JSON.stringify(command))