Update application active state

tuanchauict · Dec 13, 2024 · af5af58 · af5af58
1 parent 4c34a7e
commit af5af58
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/monosketch-svelte/src/lib/mono/window/window-viewmodel.ts b/monosketch-svelte/src/lib/mono/window/window-viewmodel.ts
@@ -2,4 +2,6 @@ import { Flow } from '$libs/flow';
 
 export namespace WindowViewModel {
     export const windowSizeUpdateEventFlow = new Flow<boolean>(true);
+
+    export const applicationActiveStateFlow = new Flow<boolean>(true);
 }
diff --git a/monosketch-svelte/src/main.ts b/monosketch-svelte/src/main.ts
@@ -1,9 +1,9 @@
 import '$assets/fonts/stylesheet.css';
 import '$style/main.scss';
-import App from './App.svelte';
 import { AppContext } from '$app/app-context';
 import { APP_CONTEXT } from '$mono/common/constant';
 import { WindowViewModel } from '$mono/window/window-viewmodel';
+import App from './App.svelte';
 
 const appContext = new AppContext();
 const context = new Map();
@@ -13,6 +13,18 @@ window.onresize = () => {
     WindowViewModel.windowSizeUpdateEventFlow.value = true;
 };
 
+window.onfocus = () => {
+    WindowViewModel.applicationActiveStateFlow.value = true;
+}
+
+window.onblur = () => {
+    WindowViewModel.applicationActiveStateFlow.value = false;
+}
+
+document.addEventListener('visibilitychange', () => {
+    WindowViewModel.applicationActiveStateFlow.value = document['visibilityState'] === 'visible';
+});
+
 const app = new App({
     // @ts-expect-error - Safe to ignore
     target: document.getElementById('app'),