src/common/interfaces/EventBusMessage.interface.ts

@@ -17,14 +17,11 @@ export interface EventBusContext {
   stopPropagation?: boolean;
 
   origin?: CommsOrigin;
-  frameUrl?: string;
 
   // tab?: number;
   // frame?: number;
   // port?: string;
 
-  visitedBusses?: string[];
-
   comms?: {
     forwardTo?: 'all' | 'active' | 'popup' | 'contentScript' | 'all-frames';
     sender?: Runtime.MessageSender;

src/common/interfaces/HostData.interface.ts

@@ -1,8 +0,0 @@
-import { ExtensionEnvironment } from '@src/common/interfaces/SettingsInterface';
-
-export interface HostInfo {
-  host: string,
-  hasVideo: boolean,
-  minEnvironment: ExtensionEnvironment,
-  maxEnvironment: ExtensionEnvironment
-};

src/common/interfaces/IframeTunnelPayload.interface.ts

@@ -1,6 +0,0 @@
-import { EventBusMessage } from '@src/common/interfaces/EventBusMessage.interface';
-
-export interface IframeTunnelPayload {
-  action: string,
-  payload: EventBusMessage,
-}

src/common/js/utils.ts

@@ -1,3 +1,7 @@
+export async function sleep(timeout) {
+  return new Promise<void>( (resolve, reject) => setTimeout(() => resolve(), timeout));
+}
+
 /**
  * Creates deep copy of an object
  * @param obj

src/ext/UWContent.ts

@@ -8,7 +8,7 @@ import Settings from '@src/ext/module/settings/Settings';
 import { SiteSettings } from '@src/ext/module/settings/SiteSettings';
 import UI from '@src/ext/module/uwui/UI';
 import PageInfo from '@src/ext/module/video-data/PageInfo';
-import { getIframeParentHost, setupHostnameReporting } from '@src/common/utils/getHost';
+import { getIframeParentHost, setupHostnameReporting } from '@src/ext/util/getHost';
 
 export default class UWContent {
   pageInfo: PageInfo;

src/ext/UWServer.ts

@@ -4,9 +4,6 @@ import Settings from '@src/ext/module/settings/Settings';
 import { ComponentLogger } from '@src/ext/module/logging/ComponentLogger';
 import { BLANK_LOGGER_CONFIG, LogAggregator } from '@src/ext/module/logging/LogAggregator';
 import CommsServer from '@src/ext/module/comms/CommsServer';
-import BrowserDetect from '@src/ext/conf/BrowserDetect';
-import { HostInfo } from '@src/common/interfaces/HostData.interface';
-import { ExtensionEnvironment } from '@src/common/interfaces/SettingsInterface';
 
 
 const BASE_LOGGING_STYLES = {
@@ -266,7 +263,6 @@ export default class UWServer {
 
     const tabHostname = await this.getCurrentTabHostname();
     this.logger.info('getCurrentSite', 'Returning data:', {site, tabHostname});
-    console.info('get-current-site : returning data:', {site, tabHostname});
 
     this.eventBus.send(
       'set-current-site',
@@ -287,36 +283,6 @@ export default class UWServer {
   }
 
 
-  private populateFrameVideoStatus(tabId: number, hostnames: string[]) {
-    const out: HostInfo[] = [];
-
-    for (const host of hostnames) {
-      let video = {hasVideo: false, minEnvironment: ExtensionEnvironment.Normal, maxEnvironment: ExtensionEnvironment.Fullscreen};
-
-      for (const frameKey in this.videoTabs[tabId].frames) {
-        const frame = this.videoTabs[tabId].frames[frameKey];
-
-        if (frame.host === host) {
-          video.hasVideo = true;
-          if (frame.environment > video.maxEnvironment) {
-            video.maxEnvironment = frame.environment;
-          }
-          if (frame.environment < video.minEnvironment) {
-            video.minEnvironment = frame.environment;
-          }
-        }
-      }
-
-      out.push({
-        host,
-        ...video,
-      })
-    }
-
-    return out;
-  }
-
-  private _lastVideoTabData: any | undefined;
   async getVideoTab() {
     // friendly reminder: if current tab doesn't have a video,
     // there won't be anything in this.videoTabs[this.currentTabId]
@@ -333,52 +299,41 @@ export default class UWServer {
 
     const hostnames = await this.comms.listUniqueFrameHosts();
 
-    // this probably means we're inside a problematic page
+    if (this.videoTabs[ctab.id]) {
-    if (!this.videoTabs[ctab.id]) {
+      // if video is older than PageInfo's video rescan period (+ 4000ms of grace),
-      return this._lastVideoTabData ??  {
+      // we clean it up from videoTabs[tabId].frames array.
-        host: 'INVALID SITE',
+      const ageLimit = Date.now() - this.settings.active.pageInfo.timeouts.rescan - 4000;
-        frames: [],
+      try {
-        hostnames: [],
+        for (const key in this.videoTabs[ctab.id].frames) {
-      }
+          if (this.videoTabs[ctab.id].frames[key].registerTime < ageLimit) {
-    }
+            delete this.videoTabs[ctab.id].frames[key];
-
+          }
-    // if video is older than PageInfo's video rescan period (+ 4000ms of grace),
+        }
-    // we clean it up from videoTabs[tabId].frames array.
+      } catch (e) {
-    const ageLimit = Date.now() - this.settings.active.pageInfo.timeouts.rescan - 4000;
+        // something went wrong. There's prolly no frames.
-    try {
+        return {
-      for (const key in this.videoTabs[ctab.id].frames) {
+          host: this.extractHostname(ctab.url),
-        if (this.videoTabs[ctab.id].frames[key].registerTime < ageLimit) {
+          frames: [],
-          delete this.videoTabs[ctab.id].frames[key];
+          selected: this.selectedSubitem
         }
       }
-    } catch (e) {
+
-      // something went wrong. There's prolly no frames.
-      // this probably shouldn't ever run.
       return {
+        ...this.videoTabs[ctab.id],
         host: this.extractHostname(ctab.url),
-        hostnames: [],
+        hostnames,
-        frames: [],
         selected: this.selectedSubitem
-      }
+      };
     }
 
-    // Ensure hostnames with videos come before hostnames without videos
+    // return something more or less empty if this tab doesn't have
-    // Also ensure hostnames are sorted alphabetically
+    // a video registered for it
-    const populatedHostnames = this.populateFrameVideoStatus(ctab.id, hostnames);
+    return {
-    populatedHostnames.sort((a: HostInfo, b: HostInfo) => {
-      return a.hasVideo === b.hasVideo
-        ? a.host === b.host ? 0 : a.host < b.host ? -1 : 1
-        : a.hasVideo < b.hasVideo ? 1 : -1;
-    });
-
-    this._lastVideoTabData = {
       host: this.extractHostname(ctab.url),
-      hostnames: populatedHostnames.map(x => x.host), // todo: try eliminating this
+      frames: [],
-      populatedHostnames: populatedHostnames,
+      hostnames,
-      selected: this.selectedSubitem
+      selected: this.selectedSubitem,
-    };
+    }
-
-    return this._lastVideoTabData;
   }
 
   async getCurrentTabHostname() {

src/ext/module/EventBus.ts

@@ -1,19 +1,34 @@
-import { EventBusCommand, EventBusContext, EventBusMessage } from '@src/common/interfaces/EventBusMessage.interface';
+import { IframeData } from './video-data/IframeManager';
-import { IframeTunnelPayload } from '@src/common/interfaces/IframeTunnelPayload.interface';
+import CommsClient, { CommsOrigin } from './comms/CommsClient';
-import Comms from '@src/ext/module/comms/Comms';
+import CommsServer from './comms/CommsServer';
-import CommsClient, { CommsOrigin } from '@src/ext/module/comms/CommsClient';
+import { EventBusCommand, EventBusContext } from '@src/common/interfaces/EventBusMessage.interface';
-import CommsServer from '@src/ext/module/comms/CommsServer';
 
 
+
+// export interface EventBusContext {
+//   stopPropagation?: boolean,
+
+//   // Context stuff added by Comms
+//   origin?: CommsOrigin,
+//   comms?: {
+//     sender?: chrome.runtime.MessageSender,
+//     port?: chrome.runtime.Port,
+//     frame?: any,
+//     sourceFrame?: IframeData
+//     forwardTo?: 'all' | 'active' | 'contentScript' | 'server' | 'sameOrigin' | 'popup' | 'all-frames',
+//   };
+//   borderCrossings?: {
+//     commsServer?: boolean,
+//     iframe?: boolean,
+//   }
+// }
+
 export default class EventBus {
 
   private name: string;
-  private uuid = crypto.randomUUID();
 
   private commands: { [x: string]: EventBusCommand[]} = {};
   private comms?: CommsClient | CommsServer;
-  private commsOrigin: CommsOrigin;
-
 
   private disableTunnel: boolean = false;
   private popupContext: any = {};
@@ -22,12 +37,11 @@ export default class EventBus {
 
   // private uiUri = window.location.href;
 
-  constructor(options?: {isUWServer?: boolean, name?: string, commsOrigin?: CommsOrigin}) {
+  constructor(options?: {isUWServer?: boolean, name?: string}) {
     if (!options?.isUWServer) {
       this.setupIframeTunnelling();
     }
-    this.name = options?.name ?? '(unnamed EventBus)';
+    this.name = options?.name;
-    this.commsOrigin = options?.commsOrigin;
   }
 
   setupPopupTunnelWorkaround(context: EventBusContext): void {
@@ -88,7 +102,8 @@ export default class EventBus {
     }
   }
 
-  send(command: string, commandData: any, context: EventBusContext = {}) {
+  send(command: string, commandData: any, context?: EventBusContext) {
+    console.info('sending eventBus command:', this.name, 'command:', {command, commandData, context});
     // execute commands we have subscriptions for
 
     if (this.commands?.[command]) {
@@ -131,9 +146,7 @@ export default class EventBus {
           }
         );
       }
-      this.sendToTunnel(command, commandData, context);
+      this.sendToTunnel(command, commandData);
-    } else {
-      console.warn('message was already sent to iframe, doing nothing ...')
     }
 
     if (context?.stopPropagation) {
@@ -147,14 +160,12 @@ export default class EventBus {
    * @param command
    * @param config
    */
-  sendToTunnel(command: string, config: any, context: EventBusContext = {}) {
+  sendToTunnel(command: string, config: any) {
-    context.visitedBusses = [...context.visitedBusses ?? [], this.uuid];
+    if (!this.disableTunnel) {
-
-    if (!this.disableTunnel && typeof window !== 'undefined') {
       window.parent.postMessage(
         {
           action: 'uw-bus-tunnel',
-          payload: {command, config, context} as EventBusMessage
+          payload: {action: command, config}
         },
         '*'
       );
@@ -164,20 +175,10 @@ export default class EventBus {
       // in the popup
       if (this.comms) {
         try {
-          this.comms.sendMessage(
+          this.comms.sendMessage({command, config, context: this.popupContext}, this.popupContext);
-            {
-              command,
-              config,
-              context: {
-                ...this.popupContext,
-                ...context
-              }
-            },
-            this.popupContext
-          );
         } catch (e) {
           if (command !== 'reload-required') {
-            this.send('reload-required', {}, context);
+            this.send('reload-required', {});
           }
         }
       }
@@ -187,34 +188,17 @@ export default class EventBus {
   //#region iframe tunnelling
   private setupIframeTunnelling() {
     // forward messages coming from iframe tunnels
-    window.addEventListener('message', this);
+    window.addEventListener('message', this.handleIframeMessage);
   }
   private destroyIframeTunnelling() {
-    window.removeEventListener('message', this);
+    window.removeEventListener('message', this.handleIframeMessage);
   }
-  /**
+  private handleIframeMessage(event: any) {
-   * Handles 'message' events (formerly handleIframeMessage)
-   * @param event
-   * @returns
-   */
-  handleEvent(event: any) {
     if (event.data?.action !== 'uw-bus-tunnel') {
       return;
     }
-
+    console.info(this.name, 'received message from iframe. command:', event.data.payload);
-    const payload = event.data.payload as EventBusMessage;
+    this.send(event.data.payload.command, event.data.payload.config);
-
-    console.info(this.name, 'received message from iframe. command:', payload);
-    if (!payload.context) {
-      console.warn('Received iframe message without context. Doing nothing in order to avoid infinite loop. Event:', event);
-      return;
-    }
-
-    if (payload.context?.visitedBusses?.includes(this.uuid)) {
-      return;
-    }
-
-    this.send(payload.command, payload.config, payload.context);
   }
 
   //#endregion

src/ext/module/Interface.js

@@ -0,0 +1,12 @@
+class Interface {
+  constructor(videoData) {
+    this.conf = videoData;
+    this.player = videoData.player;
+  }
+
+  injectUi() {
+    this.detectorDiv = document.createElement('div');
+    this.uiRoot = document.createElement('div');
+    this.detectorDiv.appendChild(this.uiRoot);
+  }
+}

src/ext/module/ObjectCopy.ts

@@ -1,8 +1,8 @@
-import Debug from '../../ext/conf/Debug';
+import Debug from '../conf/Debug';
 
 class ObjectCopy {
   static addNew(current, newValues){
-
+    
     // clone target
     let out = JSON.parse(JSON.stringify(newValues));
 
@@ -20,7 +20,7 @@ class ObjectCopy {
 
         // Types and constructors of objects must match. If they don't, we always use the new value.
         if(typeof out[k] === typeof current[k] && out[k].constructor === current[k].constructor) {
-
+          
           // objects are special, we need to check them recursively.
           if(out[k] && typeof out[k] === 'object' && out[k].constructor === Object ) {
             if(Debug.debug && Debug.settings) {
@@ -29,7 +29,7 @@ class ObjectCopy {
 
             out[k] = this.addNew(current[k], out[k]);
           } else {
-            out[k] = current[k];
+            out[k] = current[k];       
           }
         }
       }
@@ -52,7 +52,7 @@ class ObjectCopy {
       if (current[k] !== undefined) {
         // Types and constructors of objects must match. If they don't, we always use the new value.
         if (typeof newValues[k] === typeof current[k] && newValues[k].constructor === current[k].constructor) {
-
+          
           // objects are special, we need to check them recursively.
           if(current[k] && typeof current[k] === 'object' && current[k].constructor === Object ) {
             if(Debug.debug && Debug.settings) {
@@ -61,7 +61,7 @@ class ObjectCopy {
 
             current[k] = this.overwrite(current[k], newValues[k]);
           } else {
-            current[k] = newValues[k];
+            current[k] = newValues[k];       
           }
         } else {
           current[k] = newValues[k];
@@ -82,4 +82,4 @@ class ObjectCopy {
   }
 }
 
-export default ObjectCopy;
+export default ObjectCopy;

src/ext/module/comms/CommsClient.ts

@@ -65,8 +65,7 @@ if (process.env.CHANNEL !== 'stable'){
 export enum CommsOrigin {
   ContentScript = 1,
   Popup = 2,
-  Server = 3,
+  Server = 3
-  Ui = 4,     // in-player UI
 }
 
 class CommsClient {
@@ -149,7 +148,7 @@ class CommsClient {
 
     // send to server
     if (!context?.borderCrossings?.commsServer) {
-      return chrome?.runtime?.sendMessage(null, message, null);
+      return chrome.runtime.sendMessage(null, message, null);
     }
   }
 

src/ext/module/comms/CommsServer.ts

@@ -1,10 +1,8 @@
-import { ExtensionEnvironment } from './../../../common/interfaces/SettingsInterface';
 import { ComponentLogger } from '@src/ext/module/logging/ComponentLogger';
 import Settings from '@src/ext/module/settings/Settings';
 import EventBus from '@src/ext/module/EventBus';
 import { CommsOrigin } from './CommsClient';
 import UWServer from '@src/ext/UWServer';
-import { HostInfo } from '@src/common/interfaces/HostData.interface';
 
 const BASE_LOGGING_STYLES = {
   log: "background-color: #11D; color: #aad",
@@ -153,15 +151,6 @@ class CommsServer {
     return hosts;
   }
 
-  async getUniqueFrameHosts() {
-    const aTab = await this.activeTab;
-
-    const tabPort = this.ports[aTab.id];
-    const hosts:  HostInfo[] = [];
-
-
-  }
-
   sendMessage(message, context?) {
     this.logger.debug('sendMessage', `preparing to send message ${message.command ?? ''} ...`, {message, context});
     // stop messages from returning where they came from, and prevent

src/ext/module/settings/Settings.ts

@@ -1,13 +1,14 @@
-import AspectRatioType from '@src/common/enums/AspectRatioType.enum';
+import Debug from '../../conf/Debug';
-import StretchType from '@src/common/enums/StretchType.enum';
+import ExtensionConf from '../../conf/ExtensionConf';
-import SettingsInterface from '@src/common/interfaces/SettingsInterface';
+import ObjectCopy from '../ObjectCopy';
-import Debug from '@src/ext/conf/Debug';
+import StretchType from '../../../common/enums/StretchType.enum';
-import ExtensionConfPatch from '@src/ext/conf/ExtConfPatches';
+import ExtensionConfPatch from '../../conf/ExtConfPatches';
-import ExtensionConf from '@src/ext/conf/ExtensionConf';
+import SettingsInterface from '../../../common/interfaces/SettingsInterface';
-import { ComponentLogger } from '@src/ext/module/logging/ComponentLogger';
+import AspectRatioType from '../../../common/enums/AspectRatioType.enum';
-import { LogAggregator } from '@src/ext/module/logging/LogAggregator';
+import { GetSiteSettingsOptions, SiteSettings } from './SiteSettings';
-import { SettingsSnapshot, SettingsSnapshotManager } from '@src/ext/module/settings/SettingsSnapshotManager';
+import { SettingsSnapshot, SettingsSnapshotManager } from './SettingsSnapshotManager';
-import { GetSiteSettingsOptions, SiteSettings } from '@src/ext/module/settings/SiteSettings';
+import { ComponentLogger } from '../logging/ComponentLogger';
+import { LogAggregator } from '../logging/LogAggregator';
 import { getDiff } from 'json-difference'
 
 if(process.env.CHANNEL !== 'stable'){

src/ext/module/settings/SiteSettings.ts

@@ -1,13 +1,12 @@
-import CropModePersistence from '@src/common/enums/CropModePersistence.enum';
+import CropModePersistence from '../../../common/enums/CropModePersistence.enum';
-import EmbeddedContentSettingsOverridePolicy from '@src/common/enums/EmbeddedContentSettingsOverridePolicy.enum';
+import ExtensionMode from '../../../common/enums/ExtensionMode.enum';
-import ExtensionMode from '@src/common/enums/ExtensionMode.enum';
+import { ExtensionEnvironment, SettingsReloadComponent, SettingsReloadFlags, SiteSettingsInterface } from '../../../common/interfaces/SettingsInterface';
-import { PlayerDetectionMode } from '@src/common/enums/PlayerDetectionMode.enum';
+import { _cp } from '../../../common/js/utils';
-import { SiteSupportLevel } from '@src/common/enums/SiteSupportLevel.enum';
+import Settings from './Settings';
-import StretchType from '@src/common/enums/StretchType.enum';
+import StretchType from '../../../common/enums/StretchType.enum';
-import VideoAlignmentType from '@src/common/enums/VideoAlignmentType.enum';
+import VideoAlignmentType from '../../../common/enums/VideoAlignmentType.enum';
-import { ExtensionEnvironment, SettingsReloadComponent, SettingsReloadFlags, SiteSettingsInterface } from '@src/common/interfaces/SettingsInterface';
+import EmbeddedContentSettingsOverridePolicy from '../../../common/enums/EmbeddedContentSettingsOverridePolicy.enum';
-import { _cp } from '@src/common/utils/_cp';
+import { SiteSupportLevel } from '../../../common/enums/SiteSupportLevel.enum';
-import Settings from '@src/ext/module/settings/Settings';
 
 
 export interface GetSiteSettingsOptions {
@@ -323,10 +322,7 @@ export class SiteSettings {
    * @returns querySelector if possible, undefined otherwise
    */
   getCustomDOMQuerySelector(element: 'video' | 'player'): string | undefined {
-    return (
+    return this.data.currentDOMConfig?.elements?.[element]?.manual && this.data.currentDOMConfig?.elements?.[element]?.querySelectors || undefined;
-      this.data.currentDOMConfig?.elements?.[element]?.detectionMode === PlayerDetectionMode.QuerySelectors
-      && this.data.currentDOMConfig?.elements?.[element]?.querySelectors
-     ) ?? undefined;
   }
 
   /**
@@ -335,8 +331,8 @@ export class SiteSettings {
    * @returns parent element index if possible, undefined otherwise
    */
   getPlayerIndex(): number | undefined {
-    return ( this.data.currentDOMConfig?.elements?.player?.detectionMode === PlayerDetectionMode.AncestorIndex && this.data.currentDOMConfig?.elements?.player?.ancestorIndex )
+    return this.data.currentDOMConfig?.elements?.player?.manual && this.data.currentDOMConfig?.elements?.player?.index
-      || ( this.data.playerAutoConfig?.modified && this.data.playerAutoConfig?.currentIndex )
+      || this.data.playerAutoConfig?.modified && this.data.playerAutoConfig?.currentIndex
       || undefined;
   }
 

src/ext/module/uwui/UI.ts

@@ -97,13 +97,10 @@ class UI {
     window.addEventListener('message', (event: MessageEvent) => {
       const data = event.data;
 
-      if (data?.action !== 'uw-bus-tunnel') {
+      if (data?.action !== 'uw-bus-tunnel') return;
-        return;
-      }
 
-      const payload = data.payload;
+      const command = data.payload.command;
-
+      const config = data.payload.config;
-      console.log('forwarding from tunnel to event bus. payload', payload);
 
       // Forward to all iframes except the source
       (UwuiWindow as any).instances?.forEach(win => {
@@ -112,7 +109,7 @@ class UI {
           iframe.contentWindow?.postMessage(
             {
               action: 'uw-bus-tunnel',
-              payload,
+              payload: { command, config }
             },
             '*'
           );
@@ -457,9 +454,9 @@ class UI {
       }
     });
 
-    this.eventBus.forwardToIframe(iframe, (command, config, context) => {
+    this.eventBus.forwardToIframe(iframe, (cmd, payload, context) => {
       iframe.contentWindow?.postMessage(
-        { action: 'uw-bus-tunnel', payload: { command, config, context } },
+        { action: 'uw-bus-tunnel', payload: { command: cmd, config: payload } },
         '*'
       );
     });

src/ext/module/uwui/UwuiWindow.ts

@@ -50,11 +50,7 @@ export class UwuiWindow {
     this.background = options.background ?? 'blur';
     this.extraStyles = options.extraStyles;
 
-    if (document.fullscreenElement) {
+    document.body.appendChild(this.host);
-      document.fullscreenElement.appendChild(this.host);
-    } else {
-      document.body.appendChild(this.host);
-    }
 
     this.shadow = this.host.attachShadow({ mode: 'closed' });
     this.shadow.innerHTML = this.template(options);

src/ext/module/video-data/PageInfo.ts

@@ -255,13 +255,7 @@ class PageInfo {
       //
       // no but honestly fuck Chrome.
       if (videosDetected || this.hasVideo()) {
-        this.eventBus.send(
+        this.eventBus.send('has-video', null);
-          'has-video',
-          {
-            site: window.location.host,
-            isIframe: window.self !== window.top,
-          }
-        );
       } else {
         this.eventBus.send('noVideo', null);
       }

src/ext/module/video-data/PlayerData.ts

@@ -1,15 +1,17 @@
-import ExtensionMode from '@src/common/enums/ExtensionMode.enum';
+import Debug from '../../conf/Debug';
-import { PlayerDetectionMode } from '@src/common/enums/PlayerDetectionMode.enum';
+import ExtensionMode from '../../../common/enums/ExtensionMode.enum'
-import { ExtensionEnvironment } from '@src/common/interfaces/SettingsInterface';
+import PlayerNotificationUi from '../uwui/PlayerNotificationUI';
-import { collectionHas, equalish } from '@src/common/utils/comparators';
-import { RunLevel } from '@src/ext/enum/run-level.enum';
-import EventBus from '@src/ext/module/EventBus';
-import { ComponentLogger } from '@src/ext/module/logging/ComponentLogger';
-import { SiteSettings } from '@src/ext/module/settings/SiteSettings';
-import UI from '@src/ext/module/uwui/UI';
-import PageInfo from '@src/ext/module/video-data/PageInfo';
-import VideoData from '@src/ext/module/video-data/VideoData';
 import * as _ from 'lodash';
+import { sleep } from '../../../common/js/utils';
+import VideoData from './VideoData';
+import EventBus from '../EventBus';
+import UI from '../uwui/UI';
+import { SiteSettings } from '../settings/SiteSettings';
+import PageInfo from './PageInfo';
+import { RunLevel } from '../../enum/run-level.enum';
+import { ExtensionEnvironment } from '../../../common/interfaces/SettingsInterface';
+import { ComponentLogger } from '../logging/ComponentLogger';
+import { collectionHas, equalish } from '../../util/comparators';
 
 if (process.env.CHANNEL !== 'stable'){
   console.info("Loading: PlayerData.js");
@@ -75,7 +77,7 @@ class PlayerData {
   videoData: VideoData;
   pageInfo: PageInfo;
   siteSettings: SiteSettings;
-  notificationService: any; // TODO: implement this
+  notificationService: PlayerNotificationUi;
   eventBus: EventBus;
   //#endregion
 
@@ -598,8 +600,6 @@ class PlayerData {
    * Finds and returns HTML element of the player
    */
   private getPlayer(options?: {verbose?: boolean}): HTMLElement {
-    const detectionMode = this.siteSettings.data.currentDOMConfig?.elements?.player?.detectionMode;
-
     const videoWidth = this.videoElement.offsetWidth;
     const videoHeight = this.videoElement.offsetHeight;
     let playerCandidate;
@@ -619,16 +619,31 @@ class PlayerData {
       }
     }
 
-    if (detectionMode === PlayerDetectionMode.AncestorIndex) {
+    // if mode is given, we follow the preference
-      playerCandidate = elementStack[playerIndex];
+    if (this.siteSettings.data.currentDOMConfig?.elements?.player?.manual && this.siteSettings.data.currentDOMConfig?.elements?.player?.mode) {
-      playerCandidate.heuristics['manualElementByParentIndex'] = true;
+      if (this.siteSettings.data.currentDOMConfig?.elements?.player?.mode === 'qs') {
-    } else if (detectionMode === PlayerDetectionMode.QuerySelectors) {
+        playerCandidate = this.getPlayerQs(playerQs, elementStack, videoWidth, videoHeight);
-      playerCandidate = this.getPlayerQs(playerQs, elementStack, videoWidth, videoHeight);
+      } else {
+        playerCandidate = elementStack[playerIndex];
+        playerCandidate.heuristics['manualElementByParentIndex'] = true;
+      }
+    } else {
+      // try to figure it out based on what we have, with playerQs taking priority
+      if (playerQs) {
+        playerCandidate = this.getPlayerQs(playerQs, elementStack, videoWidth, videoHeight);
+      } else if (playerIndex) { // btw 0 is not a valid index for player
+        playerCandidate = elementStack[playerIndex];
+        playerCandidate.heuristics['manualElementByParentIndex'] = true;
+      }
     }
 
-    // we fall back to automatic player detection even if detectionMode is
+    if (playerCandidate) {
-    // not set to auto.
+      if (options?.verbose) {
-    if (detectionMode === PlayerDetectionMode.Auto || !playerCandidate) {
+        this.getPlayerAuto(elementStack, videoWidth, videoHeight);
+        playerCandidate.heuristics['activePlayer'] = true;
+      }
+      return playerCandidate.element;
+    } else {
       const playerCandidate = this.getPlayerAuto(elementStack, videoWidth, videoHeight);
       if (playerCandidate === null) {
         console.warn('[uw::getPlayer] getPlayerAuto returned null — no player detected?');
@@ -636,12 +651,6 @@ class PlayerData {
         playerCandidate.heuristics['activePlayer'] = true;
         return playerCandidate.element;
       }
-    } else {
-      if (options?.verbose) {
-        this.getPlayerAuto(elementStack, videoWidth, videoHeight);
-        playerCandidate.heuristics['activePlayer'] = true;
-      }
-      return playerCandidate.element;
     }
   }
 
@@ -694,15 +703,6 @@ class PlayerData {
         continue;
       }
 
-      // when in full screen, we need to worry about top-layer shenanigans
-      if (!!fullscreenElement) {
-        console.log('we are in full screen — checking for top layer shenanigans. Is this element visible from top layer?', fullscreenElement.contains(elementData.element))
-        if (!fullscreenElement.contains(elementData.element)) {
-          elementData.heuristics['notVisibleInTopLayer'] = true;
-          continue;
-        }
-      }
-
       if (elementData.element === fullscreenElement) {
         // reset penalty multiplier if current element is full screen element
         // penaltyMultiplier here must be smaller than initial penalty multiplier,

src/ext/module/video-data/VideoData.ts

@@ -1,22 +1,23 @@
-import { Ar } from '@src/common/interfaces/ArInterface';
+import PlayerData from './PlayerData';
-import { ExtensionEnvironment } from '@src/common/interfaces/SettingsInterface';
+import Resizer from '../video-transform/Resizer';
-import { Stretch } from '@src/common/interfaces/StretchInterface';
-import { sleep } from '@src/common/utils/sleep';
-import BrowserDetect from '@src/ext/conf/BrowserDetect';
-import { RunLevel } from '@src/ext/enum/run-level.enum';
-import { Aard } from '@src/ext/module/aard/Aard';
-import { AardLegacy } from '@src/ext/module/aard/AardLegacy';
-import { hasDrm } from '@src/ext/module/ar-detect/DrmDetector';
-import EventBus from '@src/ext/module/EventBus';
-import { ComponentLogger } from '@src/ext/module/logging/ComponentLogger';
-import { LogAggregator } from '@src/ext/module/logging/LogAggregator';
-import Settings from '@src/ext/module/settings/Settings';
-import { SiteSettings } from '@src/ext/module/settings/SiteSettings';
-import { ExtensionStatus } from '@src/ext/module/video-data/ExtensionStatus';
-import PageInfo from '@src/ext/module/video-data/PageInfo';
-import PlayerData from '@src/ext/module/video-data/PlayerData';
-import Resizer from '@src/ext/module/video-transform/Resizer';
 import * as _ from 'lodash';
+import BrowserDetect from '../../conf/BrowserDetect';
+import Settings from '../settings/Settings';
+import PageInfo from './PageInfo';
+import { sleep } from '../../../common/js/utils';
+import EventBus from '../EventBus';
+import { SiteSettings } from '../settings/SiteSettings';
+import { Ar } from '../../../common/interfaces/ArInterface';
+import { ExtensionStatus } from './ExtensionStatus';
+import { RunLevel } from '../../enum/run-level.enum';
+import { Aard } from '../aard/Aard';
+import { Stretch } from '../../../common/interfaces/StretchInterface';
+import ExtensionMode from '../../../common/enums/ExtensionMode.enum';
+import { ExtensionEnvironment } from '../../../common/interfaces/SettingsInterface';
+import { LogAggregator } from '../logging/LogAggregator';
+import { ComponentLogger } from '../logging/ComponentLogger';
+import { AardLegacy } from '../aard/AardLegacy';
+import { hasDrm } from '@src/ext/module/ar-detect/DrmDetector';
 
 /**
  * VideoData — handles CSS for the video element.
@@ -105,11 +106,6 @@ class VideoData {
       function: () => {
         this.onEnvironmentChanged();
       }
-    },
-    'get-current-site': {
-      function: () => {
-        console.warn('received get current site!');
-      }
     }
   }
 

src/ext/module/video-transform/Resizer.ts

@@ -1,20 +1,21 @@
-import AspectRatioType from '@src/common/enums/AspectRatioType.enum';
+import { SiteSettings } from '../settings/SiteSettings';
-import StretchType from '@src/common/enums/StretchType.enum';
+import Debug from '../../conf/Debug';
-import VideoAlignmentType from '@src/common/enums/VideoAlignmentType.enum';
+import Scaler, { CropStrategy, VideoDimensions } from './Scaler';
-import { Ar, ArVariant } from '@src/common/interfaces/ArInterface';
+import Stretcher from './Stretcher';
-import { Stretch } from '@src/common/interfaces/StretchInterface';
+import Zoom from './Zoom';
-import getElementStyles from '@src/common/utils/getElementStyles';
+import StretchType from '../../../common/enums/StretchType.enum';
-import Debug from '@src/ext/conf/Debug';
+import VideoAlignmentType from '../../../common/enums/VideoAlignmentType.enum';
-import { RunLevel } from '@src/ext/enum/run-level.enum';
+import AspectRatioType from '../../../common/enums/AspectRatioType.enum';
-import EventBus from '@src/ext/module/EventBus';
+import VideoData from '../video-data/VideoData';
-import { ComponentLogger } from '@src/ext/module/logging/ComponentLogger';
+import EventBus from '../EventBus';
-import Settings from '@src/ext/module/settings/Settings';
+import { _cp } from '../../../common/js/utils';
-import { SiteSettings } from '@src/ext/module/settings/SiteSettings';
+import Settings from '../settings/Settings';
-import VideoData from '@src/ext/module/video-data/VideoData';
+import { Ar, ArVariant } from '../../../common/interfaces/ArInterface';
-import Scaler, { VideoDimensions } from '@src/ext/module/video-transform/Scaler';
+import { RunLevel } from '../../enum/run-level.enum';
-import Stretcher from '@src/ext/module/video-transform/Stretcher';
-import Zoom from '@src/ext/module/video-transform/Zoom';
 import * as _ from 'lodash';
+import getElementStyles from '../../util/getElementStyles';
+import { Stretch } from '../../../common/interfaces/StretchInterface';
+import { ComponentLogger } from '../logging/ComponentLogger';
 
 if(Debug.debug) {
   console.log("Loading: Resizer.js");

src/ui/components/segments/Debugging/Debugging.vue

@@ -201,7 +201,7 @@ import UploadJsonFileButton from '@components/common/UploadJsonFileButton.vue';
 import { LogAggregator, BLANK_LOGGER_CONFIG } from '@src/ext/module/logging/LogAggregator';
 import { SettingsSnapshot } from '@src/ext/module/settings/SettingsSnapshotManager';
 import SettingsInterface from '@src/common/interfaces/SettingsInterface';
-import { _cp } from '@src/common/utils/_cp';
+import { _cp } from '@src/common/js/utils';
 
 export default defineComponent({
   components: {

src/ui/components/segments/PlayerElementSelection/Panels/PlayerSelectorAdvancedForm.vue

@@ -305,7 +305,7 @@ import SupportLevelIndicator from '@components/common/SupportLevelIndicator.vue'
 import ConfirmButton from '@components/common/ConfirmButton.vue';
 
 import Popup from '@components/common/Popup.vue';
-import { _cp } from '@src/common/utils/_cp';
+import { _cp } from '@src/common/js/utils';
 import { SiteDOMSettingsInterface } from '@src/common/interfaces/SettingsInterface';
 import { SiteSupportLevel } from '../../../../../common/enums/SiteSupportLevel.enum';
 

src/ui/pages/settings/App.vue

@@ -263,12 +263,36 @@ export default defineComponent({
           this.selectedTab = this.defaultTab;
         }
 
-        console.log('does event bus exist yet?', this.eventBus);
         if (!this.eventBus) {
-          // inter-frame communication should be set up by eventBus for free
           this.eventBus = new EventBus({name: 'ui-window'});
         }
 
+        /**
+         * SETUP CROSS-FRAME COMMUNICATION
+         *
+         * 1. We need to allow eventBus to send messages to the parent page
+         * 2. We need to plug messages we receive from parent page into the event bus
+         */
+        this.eventBus.sendToTunnel = (command: string, config: any) => {
+          window.parent.postMessage(
+            {
+              action: 'uw-bus-tunnel',
+              payload: { command, config }
+            },
+            '*'
+          );
+        };
+
+        window.addEventListener('message', (event: MessageEvent) => {
+          const data = event.data;
+          if (data?.action === 'uw-bus-tunnel') {
+            // prevent double-crossing by marking borderCrossings
+            this.eventBus.send(data.payload.command, data.payload.config, {
+              borderCrossings: { iframe: true }
+            });
+          }
+        });
+
         /**
          * Subscribe to event bus commands.
          * Note that showing and hiding of the settings window is no longer handled by iframe
@@ -312,34 +336,8 @@ export default defineComponent({
               this.loadFrames();
             }
           },
-          'has-video': {
-            function: (config, context) => {
-
-              console.log('has video received.', config, context);
-              console.log('———————— building site:', !config.isIFrame, this.site?.host, config.site, this.site?.host !== config.site);
-
-              // update site data.
-              // If we're here, then the settings page is being opened from the in-player popup.
-              // This means that config.isIframe can generally be ignored.
-              // However, we absolutely cannot accept iframes as source for this.site when we
-              // open settings window from the extension popup. This needs to be TODO:
-              if (this.site?.host !== config.site) {
-                this.site = {
-                  host: config.site,
-                  frames: [],
-                  hostnames: [],
-                };
-
-                this.siteSettings = this.settings.getSiteSettings({site: this.site.host});
-                this.loadHostnames();
-                this.loadFrames();
-              }
-
-            }
-          },
         });
 
-        console.log('—————————————————————— polling from iframe window!!!!')
         this.startSitePolling();
         // this.eventBus.subscribe(
         //   'uw-show-ui',

src/ui/res/styles/player-window.css

@@ -167,13 +167,3 @@
     }
   }
 }
-
-.warning-box, .info-box {
-  @apply px-4 py-2 flex flex-row gap-4 border;
-}
-.warning-box {
-  @apply border-amber-500 text-amber-300 bg-amber-950/75;
-}
-.info-box {
-  @apply border-blue-500 text-blue-300 bg-blue-950/75;
-}