From c40601eecba00a682bccabe177dcb2532a78a42c Mon Sep 17 00:00:00 2001
From: Jan Oberhauser <jan.oberhauser@gmail.com>
Date: Fri, 23 Oct 2020 18:15:52 +0200
Subject: [PATCH] :zap: Fix issues with support for touch-devices

---
 packages/editor-ui/src/components/Node.vue    |  2 +-
 .../src/components/mixins/nodeBase.ts         | 30 ++++++++++++-------
 packages/editor-ui/src/views/NodeView.vue     |  9 ++++--
 3 files changed, 26 insertions(+), 15 deletions(-)

diff --git a/packages/editor-ui/src/components/Node.vue b/packages/editor-ui/src/components/Node.vue
index 3f52a14065..28493d1a18 100644
--- a/packages/editor-ui/src/components/Node.vue
+++ b/packages/editor-ui/src/components/Node.vue
@@ -1,6 +1,6 @@
 <template>
 	<div class="node-wrapper" :style="nodePosition">
-		<div class="node-default" :ref="data.name" :style="nodeStyle" :class="nodeClass" @dblclick="setNodeActive" @click.left="mouseLeftClick" v-touch:end="mouseLeftClick">
+		<div class="node-default" :ref="data.name" :style="nodeStyle" :class="nodeClass" @dblclick="setNodeActive" @click.left="mouseLeftClick" v-touch:end="touchEnd">
 			<div v-if="hasIssues" class="node-info-icon node-issues">
 				<el-tooltip placement="top" effect="light">
 					<div slot="content" v-html="nodeIssues"></div>
diff --git a/packages/editor-ui/src/components/mixins/nodeBase.ts b/packages/editor-ui/src/components/mixins/nodeBase.ts
index 753b06b308..830d7ed2e0 100644
--- a/packages/editor-ui/src/components/mixins/nodeBase.ts
+++ b/packages/editor-ui/src/components/mixins/nodeBase.ts
@@ -333,19 +333,27 @@ export const nodeBase = mixins(
 			});
 
 		},
-
-		mouseLeftClick (e: MouseEvent) {
-			if (this.$store.getters.isActionActive('dragActive')) {
-				this.$store.commit('removeActiveAction', 'dragActive');
-			} else {
-				if (this.isCtrlKeyPressed(e) === false) {
-					this.$emit('deselectAllNodes');
+		touchEnd(e: MouseEvent) {
+			if (this.isTouchDevice) {
+				if (this.$store.getters.isActionActive('dragActive')) {
+					this.$store.commit('removeActiveAction', 'dragActive');
 				}
-
-				if (this.$store.getters.isNodeSelected(this.data.name)) {
-					this.$emit('deselectNode', this.name);
+			}
+		},
+		mouseLeftClick (e: MouseEvent) {
+			if (!this.isTouchDevice) {
+				if (this.$store.getters.isActionActive('dragActive')) {
+					this.$store.commit('removeActiveAction', 'dragActive');
 				} else {
-					this.$emit('nodeSelected', this.name);
+					if (this.isCtrlKeyPressed(e) === false) {
+						this.$emit('deselectAllNodes');
+					}
+
+					if (this.$store.getters.isNodeSelected(this.data.name)) {
+						this.$emit('deselectNode', this.name);
+					} else {
+						this.$emit('nodeSelected', this.name);
+					}
 				}
 			}
 		},
diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue
index 207c53d495..b0146a4675 100644
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@@ -7,7 +7,7 @@
 			@touchend="mouseUp"
 			@touchmove="mouseMoveNodeWorkflow"
 			@mousedown="mouseDown"
-			v-touch:tap="mouseDown"
+			v-touch:tap="touchTap"
 			@mouseup="mouseUp"
 			@wheel="wheelScroll"
 			>
@@ -340,9 +340,12 @@ export default mixins(
 
 				await this.addNodes(data.nodes, data.connections);
 			},
+			touchTap (e: MouseEvent | TouchEvent) {
+				if (this.isTouchDevice) {
+					this.mouseDown(e);
+				}
+			},
 			mouseDown (e: MouseEvent | TouchEvent) {
-				console.log('mouseDown');
-
 				// Save the location of the mouse click
 				const position = this.getMousePosition(e);
 				const offsetPosition = this.$store.getters.getNodeViewOffsetPosition;