feat/FRO-36: PWA (#25)

Added a PWA for knockoutwhist including a special offline screen.

Co-authored-by: LQ63 <lkhermann@web.de>
Reviewed-on: #25
Reviewed-by: Janis <janis-e@gmx.de>
Co-authored-by: lq64 <lq@blackhole.local>
Co-committed-by: lq64 <lq@blackhole.local>

src/App.vue

@@ -1,5 +1,22 @@
 <script setup lang="ts">
 import { RouterView } from 'vue-router'
+import { onMounted, onUnmounted } from 'vue';
+import { useRoute } from 'vue-router';
+const route = useRoute();
+
+const handleOnlineStatusChange = () => {
+  if (navigator.onLine) {
+    if (route.name === 'offline') {
+      window.location.reload();
+    }
+  }
+};
+onMounted(() => {
+  window.addEventListener('online', handleOnlineStatusChange);
+});
+onUnmounted(() => {
+  window.removeEventListener('online', handleOnlineStatusChange);
+});
 </script>
 
 <template>