put hiding overlay on blur behind option

ipc/types.ts

@@ -12,6 +12,7 @@ export interface HostConfig {
   libraryAlpha: boolean;
   libraryOutputPath: string | null;
   initialDelay: number;
+  hideOverlayOnBlur: boolean;
 }
 
 export interface ShortcutAction {

main/src/main.ts

@@ -104,7 +104,11 @@ let tray: AppTray;
         eventPipe.onEventAnyClient(
           "CLIENT->MAIN::update-host-config",
           (cfg) => {
-            overlay.updateOpts(cfg.overlayKey, cfg.windowTitle);
+            overlay.updateOpts(
+              cfg.overlayKey,
+              cfg.windowTitle,
+              cfg.hideOverlayOnBlur,
+            );
             shortcuts.updateActions(
               cfg.shortcuts,
               cfg.stashScroll,

main/src/windowing/OverlayWindow.ts

@@ -15,6 +15,7 @@ export class OverlayWindow {
   private overlayKey: string = "Shift + Space";
   private isOverlayKeyUsed = false;
   private shouldShowOverlay = true;
+  private hideOverlayOnBlur = false;
 
   constructor(
     private server: ServerEvents,
@@ -120,9 +121,14 @@ export class OverlayWindow {
     }
   };
 
-  updateOpts(overlayKey: string, windowTitle: string) {
+  updateOpts(
+    overlayKey: string,
+    windowTitle: string,
+    hideOverlayOnBlur: boolean,
+  ) {
     this.overlayKey = overlayKey;
     this.poeWindow.attach(this.window, windowTitle);
+    this.hideOverlayOnBlur = hideOverlayOnBlur;
   }
 
   private handleExtraCommands = (
@@ -200,7 +206,7 @@ export class OverlayWindow {
   };
 
   private syncWindowVisibility() {
-    if (!this.window) return;
+    if (!this.window || !this.hideOverlayOnBlur) return;
 
     if (
       this.isInteractable ||
@@ -213,7 +219,8 @@ export class OverlayWindow {
   }
 
   private showOverlay() {
-    if (!this.window || this.window.isVisible()) return;
+    if (!this.window || this.window.isVisible() || !this.hideOverlayOnBlur)
+      return;
 
     this.window.showInactive();
     this.window.setAlwaysOnTop(true, "screen-saver");

renderer/public/data/en/app_i18n.json

@@ -394,7 +394,9 @@
     "tips_header": "Cycle Through All Tips:",
     "tip_number_header": "Tip #{0}",
     "read_client_log": "Allow reading of Client.txt file",
-    "client_log_explain": "Client.txt log file contains debugging info and chat logs. This is used to detect zone changes and player level ups."
+    "client_log_explain": "Client.txt log file contains debugging info and chat logs. This is used to detect zone changes and player level ups.",
+    "hide_overlay_on_blur": "Fully hide overlay when it loses focus instead of making it transparent.",
+    "hide_overlay_on_blur_hint": "This may gain performance improvements on some systems, but may induce flickering."
   },
   "price_check": {
     "name": "Price check",

renderer/src/web/Config.ts

@@ -130,6 +130,7 @@ export interface Config {
   overlayKey: string;
   overlayBackground: string;
   overlayBackgroundClose: boolean;
+  hideOverlayOnBlur: boolean;
   restoreClipboard: boolean;
   commands: Array<{
     text: string;
@@ -156,11 +157,12 @@ export interface Config {
 }
 
 export const defaultConfig = (): Config => ({
-  configVersion: 34,
+  configVersion: 35,
   overlayKey: "Shift + Space",
   overlayBackground: "rgba(129, 139, 149, 0.15)",
   overlayBackgroundClose: true,
   overlayAlwaysClose: false,
+  hideOverlayOnBlur: false,
   restoreClipboard: false,
   showAttachNotification: true,
   commands: [
@@ -667,8 +669,15 @@ function upgradeConfig(_config: Config): Config {
     libraryWidget.selectedProfile = "chaos";
     libraryWidget.profiles.chaos!.modOpts.generation = true;
 
+    // why is this one higher?
     config.configVersion = 34;
   }
+
+  if (config.configVersion < 35) {
+    // NOTE: v0.16.0 || poe0.5.5
+    config.hideOverlayOnBlur = false;
+    config.configVersion = 35;
+  }
   /* eslint-enable */
 
   return config as unknown as Config;
@@ -823,5 +832,6 @@ function getConfigForHost(): HostConfig {
     libraryAlpha: config.enableAlphas && config.alphas.includes("library"),
     libraryOutputPath: library.libraryOutputPath,
     initialDelay: priceCheck.initialDelay,
+    hideOverlayOnBlur: config.hideOverlayOnBlur,
   };
 }

renderer/src/web/settings/general.vue

@@ -86,6 +86,12 @@
     <ui-checkbox class="mb-4" v-model="overlayAlwaysClose">{{
       t(":overlay_always_close")
     }}</ui-checkbox>
+    <ui-checkbox class="mb-1" v-model="hideOverlayOnBlur">{{
+      t(":hide_overlay_on_blur")
+    }}</ui-checkbox>
+    <div class="italic text-gray-500 mb-4">
+      {{ t(":hide_overlay_on_blur_hint") }}
+    </div>
     <div class="mb-4">
       <div class="flex-1 mb-1">
         {{ t(":window_title") }}
@@ -218,6 +224,10 @@ export default defineComponent({
         () => props.config,
         "overlayAlwaysClose",
       ),
+      hideOverlayOnBlur: configModelValue(
+        () => props.config,
+        "hideOverlayOnBlur",
+      ),
       windowTitle: configModelValue(() => props.config, "windowTitle"),
       enableAlphas: configModelValue(() => props.config, "enableAlphas"),
       readClientLog: configModelValue(() => props.config, "readClientLog"),