Make all break windows fade out at the same time

Author: tom-james-watson

app/global.d.ts

@@ -12,13 +12,15 @@ declare const ipcRenderer: {
   invokeGetAppInitialized: () => Promise<boolean>;
   invokeSetAppInitialized: () => Promise<void>;
   invokeBreakStart: () => Promise<void>;
+  invokeBreakEnd: () => Promise<void>;
   onPlayEndSound: (
     cb: (type: string, volume?: number) => void,
   ) => Promise<void>;
   onPlayStartSound: (
     cb: (type: string, volume?: number) => void,
   ) => Promise<void>;
   onBreakStart: (cb: (breakEndTime: number) => void) => void;
+  onBreakEnd: (cb: () => void) => void;
 };
 
 declare const processEnv: {

app/main/lib/ipc.ts

@@ -53,6 +53,11 @@ ipcMain.handle(IpcChannel.BreakStart, (): void => {
   sendIpc(IpcChannel.BreakStart, breakEndTime);
 });
 
+ipcMain.handle(IpcChannel.BreakEnd, (): void => {
+  log.info(IpcChannel.BreakEnd);
+  sendIpc(IpcChannel.BreakEnd);
+});
+
 ipcMain.handle(
   IpcChannel.SoundStartPlay,
   (event: IpcMainInvokeEvent, type: SoundType, volume: number = 1): void => {

app/renderer/components/break.tsx

@@ -46,7 +46,13 @@ export default function Break() {
       setCountingDown(false);
     };
 
+    // Listen for break end broadcasts from other windows
+    const handleBreakEnd = () => {
+      setClosing(true);
+    };
+
     ipcRenderer.onBreakStart(handleBreakStart);
+    ipcRenderer.onBreakEnd(handleBreakEnd);
 
     // Delay or the window displays incorrectly.
     // FIXME: work out why and how to avoid this.
@@ -100,7 +106,9 @@ export default function Break() {
     if (isPrimary && settings && settings?.soundType !== SoundType.None) {
       ipcRenderer.invokeEndSound(settings.soundType, settings.breakSoundVolume);
     }
-    setClosing(true);
+
+    // Broadcast to all windows to start their closing animations
+    await ipcRenderer.invokeBreakEnd();
   }, [settings]);
 
   if (settings === null || allowPostpone === null) {

app/renderer/preload.js

@@ -53,6 +53,9 @@ process.once("loaded", () => {
     invokeBreakStart: () => {
       return ipcRenderer.invoke("BREAK_START");
     },
+    invokeBreakEnd: () => {
+      return ipcRenderer.invoke("BREAK_END");
+    },
     onPlayStartSound: (cb) => {
       ipcRenderer.on("SOUND_START_PLAY", (_event, type, volume = 1) => {
         cb(type, volume);
@@ -68,5 +71,10 @@ process.once("loaded", () => {
         cb(breakEndTime);
       });
     },
+    onBreakEnd: (cb) => {
+      ipcRenderer.on("BREAK_END", () => {
+        cb();
+      });
+    },
   });
 });

app/types/ipc.ts

@@ -2,6 +2,7 @@ export enum IpcChannel {
   AllowPostponeGet = "ALLOW_POSTPONE_GET",
   AppInitializedSet = "APP_INITIALIZED_SET",
   AppInitializedGet = "APP_INITIALIZED_GET",
+  BreakEnd = "BREAK_END",
   BreakLengthGet = "BREAK_LENGTH_GET",
   BreakPostpone = "BREAK_POSTPONE",
   BreakStart = "BREAK_START",