From aee7650d473c4e0a7e0e6e41ceaad946d07155da Mon Sep 17 00:00:00 2001
From: Pawel Urbanek <pawel.urbanek@medvc.eu>
Date: Fri, 24 Mar 2023 15:33:46 +0100
Subject: [PATCH] add  touch events on touch monitor

---
 client/src/components/video.vue | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/client/src/components/video.vue b/client/src/components/video.vue
index 6f13e429..c55f1bf9 100644
--- a/client/src/components/video.vue
+++ b/client/src/components/video.vue
@@ -21,6 +21,9 @@
           @mouseup.stop.prevent="onMouseUp"
           @mouseenter.stop.prevent="onMouseEnter"
           @mouseleave.stop.prevent="onMouseLeave"
+          @touchmove.stop.prevent="onTouchHandler"
+          @touchstart.stop.prevent="onTouchHandler"
+          @touchend.stop.prevent="onTouchHandler"
         />
         <div v-if="!playing && playable" class="player-overlay" @click.stop.prevent="playAndUnmute">
           <i class="fas fa-play-circle" />
@@ -687,6 +690,35 @@
         }, 100)
       }
     }
+    onTouchHandler(event: TouchEvent) {
+      let touches = event.changedTouches
+      let first = touches[0]
+      let type = ''
+      switch (event.type) {
+        case 'touchstart':
+          type = 'mousedown'
+          break
+        case 'touchmove':
+          type = 'mousemove'
+          break
+        case 'touchend':
+          type = 'mouseup'
+          break
+        default:
+          return
+      }
+
+      const simulatedEvent = new MouseEvent(type, {
+        bubbles: true,
+        cancelable: true,
+        view: window,
+        screenX: first.screenX,
+        screenY: first.screenY,
+        clientX: first.clientX,
+        clientY: first.clientY,
+      })
+      first.target.dispatchEvent(simulatedEvent)
+    }
 
     onMouseDown(e: MouseEvent) {
       if (!this.hosting) {