From 9413b96c1a27f8ce55816fc288a573ca954a5907 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=B6rn-Michael=20Miehe?= <jmm@yavook.de>
Date: Sun, 5 Nov 2023 21:57:50 +0000
Subject: [PATCH] "touch mode" improvement

---
 ui/src/components/TouchButton.vue |  4 +++-
 ui/src/plugins/store.ts           | 23 +++++++++++++----------
 2 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/ui/src/components/TouchButton.vue b/ui/src/components/TouchButton.vue
index 621e75d..f356bc3 100644
--- a/ui/src/components/TouchButton.vue
+++ b/ui/src/components/TouchButton.vue
@@ -1,10 +1,12 @@
 <template>
+  <span>Eingabemodus:&nbsp;</span>
   <BulmaButton
+    v-bind="$attrs"
     :icon="
       'fa-solid fa-' +
       (store.is_touch_device ? 'hand-pointer' : 'arrow-pointer')
     "
-    text="Eingabemodus"
+    :text="store.is_touch_device ? 'Touch' : 'Desktop'"
     @click.left="store.toggle_touch_device"
   />
 </template>
diff --git a/ui/src/plugins/store.ts b/ui/src/plugins/store.ts
index 891223a..e96d8c6 100644
--- a/ui/src/plugins/store.ts
+++ b/ui/src/plugins/store.ts
@@ -3,16 +3,23 @@ import { Advent22 } from "@/plugins/advent22";
 import { AxiosBasicCredentials } from "axios";
 import { acceptHMRUpdate, defineStore } from "pinia";
 
-const check_touch_device = () => window.matchMedia("(any-hover: none)").matches;
-const empty_creds = () => ["", ""] as Credentials;
+declare global {
+  interface Navigator {
+    readonly msMaxTouchPoints: number;
+  }
+}
 
 export const advent22Store = defineStore({
   id: "advent22",
 
   state: () => ({
     advent22: {} as Advent22,
-    api_creds: empty_creds(),
-    is_touch_device: check_touch_device(),
+    api_creds: ["", ""] as Credentials,
+    is_touch_device:
+      window.matchMedia("(any-hover: none)").matches ||
+      "ontouchstart" in window ||
+      navigator.maxTouchPoints > 0 ||
+      navigator.msMaxTouchPoints > 0,
     is_admin: false,
     site_config: {
       title: document.title,
@@ -70,7 +77,7 @@ export const advent22Store = defineStore({
         .catch(advent22.alert_user_error);
     },
 
-    login(creds: Credentials = empty_creds()): Promise<boolean> {
+    login(creds: Credentials): Promise<boolean> {
       this.api_creds = creds;
 
       return new Promise<boolean>((resolve, reject) => {
@@ -85,11 +92,7 @@ export const advent22Store = defineStore({
     },
 
     logout(): Promise<boolean> {
-      return this.login();
-    },
-
-    set_touch_device(state: boolean = check_touch_device()): void {
-      this.is_touch_device = state;
+      return this.login(["", ""]);
     },
 
     toggle_touch_device(): void {