Fix for iframe transparency

src/common/interfaces/SettingsInterface.ts

@@ -332,6 +332,7 @@ export interface SiteSettingsInterface {
   override?: boolean;   // whether settings for this site will be overwritten by extension upgrade script
 
   workarounds?: {
+    iframeTransparencyWarningDismissed?: boolean;
     disableColorSchemeAwareness?: boolean;
     forceColorScheme?: 'normal' | 'light' | 'dark',
     lastColorSchemeAwarenessCheck?: Date;

src/csui/PlayerOverlay.vue

@@ -36,6 +36,17 @@
           </div>
 
           Ultrawidify
+
+          <div
+            v-if="!siteSettings?.data.workarounds?.iframeTransparencyWarningDismissed"
+          class="absolute ui-warning small uw-clickable">
+            If all you see is white or black screen,<br/>disable UI and report your GPU to github.<br/>Open.<br/>
+
+            <br />
+            <br /> You can also <a href="" @click="iframeAutofix()">click here to attempt a fix</a>.
+            <br />
+            <br /> If you experience no issues, <a href="" @click="iframeDismiss()">click here to hide this warning.</a>
+          </div>
         </div>
 
       </template>
@@ -452,6 +463,7 @@ export default {
     this.sendToParentLowLevel('uw-bus-tunnel', {
       action: 'get-player-dimensions'
     });
+    this.sendToParentLowLevel('uw-get-page-stats', null);
   },
 
   destroyed() {
@@ -585,6 +597,22 @@ export default {
 
     handleBusTunnelIn(payload) {
       this.eventBus.send(payload.action, payload.config, payload.routingData);
+    },
+
+    async iframeAutofix() {
+      console.log('site:', this.site, this.siteSettings);
+      if (this.siteSettings?.data.workarounds?.disableColorSchemeAwareness === false) {
+        await this.settings.setProp(['sites', this.site, 'workarounds', 'disableColorSchemeAwareness'], true);
+      } else {
+        await this.settings.setProp(['sites', this.site, 'workarounds', 'disableColorSchemeAwareness'], false);
+      }
+      await this.settings.saveWithoutReload();
+      this.eventBus.sendToTunnel('uw-reload-window');
+    },
+    async iframeDismiss() {
+      await this.settings.setProp(['sites', this.site, 'workarounds', 'iframeTransparencyWarningDismissed'], true);
+      await this.settings.save();
+      this.eventBus.sendToTunnel('uw-reload-window');
     }
   }
 }
@@ -656,10 +684,14 @@ export default {
 .ui-warning {
   position: absolute;
   top: 0;
+  left: 0;
   transform: translateY(-100%);
 
-  max-width: 16rem;
-  width: 16rem;
+  max-width: 20rem;
+  width: 20rem;
+
+  padding: 1rem;
+  box-sizing: border-box;
 
   overflow: hidden;
   overflow-wrap: break-word;
@@ -667,6 +699,17 @@ export default {
   white-space: normal;
   word-break: break-word;
   word-wrap: break-word;
+
+  &.small {
+    font-size: 0.85rem;
+    color: #888;
+    background-color: rgba(0,0,0,0.69);
+
+    a {
+      color: #fa6;
+      opacity: 0.69;
+    }
+  }
 }
 
 

src/csui/src/PlayerUiPanels/ChangelogPanel.vue

@@ -32,7 +32,7 @@
           <li>Half-fixed in-player UI on sites where player is not detected correctly</li>
         </ul>
 
-        <h3>6.2.3</h3>
+        <h3>6.2.3 (current)</h3>
         <ul>
           <li>Fixed default persistent mode</li>
         </ul>

src/ext/lib/uwui/UI.js

@@ -15,8 +15,8 @@ if (process.env.CHANNEL !== 'stable'){
 // As of 1. 1. 2025, 'light' and 'dark' are commented out in order to force 'csui-overlay-normal' everywhere.
 const csuiVersions = {
   'normal': 'csui',         // csui-overlay-normal.html, maps to csui.html
-  // 'light': 'csui-light',    // csui-overlay-light.html,  maps to csui-light.html
-  // 'dark': 'csui-dark'       // csui-overlay-dark.html,   maps to csui-dark.html
+  'light': 'csui-light',    // csui-overlay-light.html,  maps to csui-light.html
+  'dark': 'csui-dark'       // csui-overlay-dark.html,   maps to csui-dark.html
 };
 
 const MAX_IFRAME_ERROR_COUNT = 5;
@@ -72,7 +72,7 @@ class UI {
     if (this.siteSettings?.workarounds?.forceColorScheme) {
       return csuiVersions[this.siteSettings.workarounds.forceColorScheme];
     }
-    if (this.siteSettings?.workarounds?.disableColorSchemeAwareness) {
+    if (this.siteSettings?.data?.workarounds?.disableColorSchemeAwareness !== false) {
       return csuiVersions.normal;
     }
 
@@ -210,6 +210,11 @@ class UI {
 
     this.eventBus.subscribeMulti(
       {
+        'uw-reload-window': {
+          function: () => {
+            window.location.reload();
+          }
+        },
         'uw-config-broadcast': {
           function: (config, routingData) => {
             this.sendToIframe('uw-config-broadcast', config, routingData);
@@ -239,8 +244,21 @@ class UI {
           function: (data, routingData) => {
             console.log('——————————— iframe transparency results are back!', data);
           }
+        },
+        'uw-get-page-stats': {
+            function: (config, routingData) => {
+              console.log('uw:Č Got page stats request')
+              this.sendToIframeLowLevel(
+                'uw-page-stats',
+                {
+                  pcsDark: window.matchMedia('(prefers-color-scheme: dark)').matches,
+                  pcsLight: window.matchMedia('(prefers-color-scheme: light)').matches,
+                  colorScheme: window.getComputedStyle( document.body ,null).getPropertyValue('color-scheme')
+                },
+              );
             }
           },
+      },
       this
     );
   }