From 9c12272846dadbe4bc7400bf0af708528f62f571 Mon Sep 17 00:00:00 2001
From: Tamius Han <tamius.han@gmail.com>
Date: Sun, 5 Jan 2025 00:36:41 +0100
Subject: [PATCH] attept detecting when wrong player element is detected pt 1

---
 src/csui/PlayerOverlay.vue         |  3 +--
 src/csui/src/utils/UIProbeMixin.js | 10 ++++++++
 src/ext/lib/uwui/UI.js             | 40 ++++++++++++++++++++++++++++++
 3 files changed, 51 insertions(+), 2 deletions(-)

diff --git a/src/csui/PlayerOverlay.vue b/src/csui/PlayerOverlay.vue
index d64f541..7b07b01 100644
--- a/src/csui/PlayerOverlay.vue
+++ b/src/csui/PlayerOverlay.vue
@@ -24,7 +24,7 @@
       @mouseleave="allowContextMenuHide()"
     >
       <template v-slot:activator>
-        <div class="context-item uw-clickable">
+        <div class="context-item uw-clickable uw-menu-trigger">
           Ultrawidify
         </div>
         </template>
@@ -300,7 +300,6 @@ export default {
       this.debugDataPrettified = JSON.stringify(this.debugData, null, 2);
     }
   },
-
   async created() {
     this.logger = new Logger();
 
diff --git a/src/csui/src/utils/UIProbeMixin.js b/src/csui/src/utils/UIProbeMixin.js
index 6b825e1..cb3b347 100644
--- a/src/csui/src/utils/UIProbeMixin.js
+++ b/src/csui/src/utils/UIProbeMixin.js
@@ -72,6 +72,7 @@ export default {
       let isClickable = false;
       let isOverTriggerZone = false;
       let isOverUIArea = false;
+      let isOverMenuTrigger = false;
       const elements = document.elementsFromPoint(eventData.coords.x, eventData.coords.y);
 
       for (const element of elements) {
@@ -84,6 +85,9 @@ export default {
         if (element.classList?.contains('uw-ui-area')) {
           isOverUIArea = true;
         }
+        if (element.classList?.contains('uw-menu-trigger')) {
+          isOverMenuTrigger = true;
+        }
       }
 
       this.triggerZoneActive = isOverTriggerZone;
@@ -112,6 +116,12 @@ export default {
         {
           action: 'uwui-clickable',
           clickable: isClickable,
+          hoverStats: {
+            isOverTriggerZone,
+            isOverMenuTrigger,
+            isOverUIArea,
+            hasMouse: !!document.querySelector(':hover'),
+          },
           ts: +new Date()
         },
         origin
diff --git a/src/ext/lib/uwui/UI.js b/src/ext/lib/uwui/UI.js
index b92211d..d195fef 100644
--- a/src/ext/lib/uwui/UI.js
+++ b/src/ext/lib/uwui/UI.js
@@ -19,6 +19,8 @@ const csuiVersions = {
   // 'dark': 'csui-dark'       // csui-overlay-dark.html,   maps to csui-dark.html
 };
 
+const MAX_IFRAME_ERROR_COUNT = 5;
+
 class UI {
   constructor(
     interfaceId,
@@ -43,6 +45,8 @@ class UI {
     this.playerData = uiConfig.playerData;
     this.uiSettings = uiConfig.uiSettings;
 
+    this.iframeErrorCount = 0;
+    this.iframeConfirmed = false;
   }
 
   async init() {
@@ -280,7 +284,43 @@ class UI {
             return;
           }
           this.lastProbeResponseTs = event.data.ts;
+
+          // If iframe returns 'yes, we are clickable' and iframe is currently set to pointerEvents=auto,
+          // but hasMouse is false, then UI is attached to the wrong element. This probably means our
+          // detected player element is wrong. We need to perform this check if we aren't in global UI
+          /**
+           * action: 'uwui-clickable',
+           * clickable: isClickable,
+           * hoverStats: {
+           *   isOverTriggerZone,
+           *   isOverMenuTrigger,
+           *   isOverUIArea,
+           *   hasMouse: !!document.querySelector(':hover'),
+           * },
+           * ts: +new Date()
+           */
+
+          if (!this.global) {
+            if (
+              this.uiIframe.style.pointerEvents === 'auto'
+            ) {
+              if (
+                event.data.hoverStats.isOverTriggerZone
+                && !event.data.hoverStats.hasMouse
+              ) {
+                if (!this.iframeConfirmed) {
+                  if (this.iframeErrorCount++ > MAX_IFRAME_ERROR_COUNT) {
+                    // this.
+                  }
+                }
+              } else {
+                this.iframeConfirmed = true;
+              }
+            }
+          }
+
           this.uiIframe.style.pointerEvents = event.data.clickable ? 'auto' : 'none';
+          this.uiIframe.style.display = event.data.opacity ? '100' : '0';
           break;
         case 'uw-bus-tunnel':
           const busCommand = event.data.payload;