From 2a32268fb24705fc20f4cd0592ff02f5dc7e9bc4 Mon Sep 17 00:00:00 2001
From: Nicola Carminati <nicola.carminati@cms.it>
Date: Mon, 17 Dec 2018 14:05:11 +0100
Subject: [PATCH] Added touchscreen functions on zoom-image panel

---
 .../modules/base-components/zoom-image.vue    | 37 +++++++++++++++----
 1 file changed, 29 insertions(+), 8 deletions(-)

diff --git a/Step/wwwroot/src/modules/base-components/zoom-image.vue b/Step/wwwroot/src/modules/base-components/zoom-image.vue
index e29d3a27..1182b886 100644
--- a/Step/wwwroot/src/modules/base-components/zoom-image.vue
+++ b/Step/wwwroot/src/modules/base-components/zoom-image.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="imageViewerZoom" >
-    <div ref="container" class="container" @mousemove="move" @mousedown="dw" @wheel="ScaleImage"  >
+    <div ref="container" class="container" @mousemove="move" @mousedown="dw" @wheel="ScaleImage" @touchstart="dw"  @touchmove="move" @dblclick="zoomPlusAnimated"  >
       <img ref="imageChild" :style="{'transform':transImage,'transition':animation}" :src="imageSrc" >
     </div>
     <div class="btngroup_close">
@@ -62,16 +62,37 @@ export default {
       this.$emit("close");
     },  
     dw(event) {   
-        this.startX= event.clientX;
-        this.startY= event.clientY;
+        if(event.touches && event.touches[0])
+        {
+          this.startX= event.touches[0].clientX;
+          this.startY= event.touches[0].clientY;
+        }
+        else
+        {
+          this.startX= event.clientX;
+          this.startY= event.clientY;
+        }
+    },
+    prova(event) {   
+      alert("ciao");
     },
     move(event) {
-      if(event.buttons > 0){
+      if(event.buttons > 0 || event.touches){
         this.animation= "0s"; 
-        this.offX = event.clientX - this.startX;
-        this.offY = event.clientY - this.startY;
-        this.startX= event.clientX;
-        this.startY= event.clientY;
+        if(event.touches && event.touches[0])
+        {          
+          this.offX = event.touches[0].clientX - this.startX;
+          this.offY = event.touches[0].clientY - this.startY;
+          this.startX= event.touches[0].clientX;
+          this.startY= event.touches[0].clientY;
+        }
+        else
+        {
+          this.offX = event.clientX - this.startX;
+          this.offY = event.clientY - this.startY;
+          this.startX= event.clientX;
+          this.startY= event.clientY;
+        }
         this.lastX = this.lastX + this.offX;
         this.lastY = this.lastY + this.offY;
         this.transImage = "translateX("+this.lastX+"px)translateY("+this.lastY+"px)scale("+this.scaleImage+")";