From 41bb9a7e38df79a92a314d66bdeff1c77e2f6250 Mon Sep 17 00:00:00 2001
From: qiang <guoshengqiang@live.com>
Date: Tue, 18 Feb 2020 12:21:12 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20touchtrack=20=E5=85=BC=E5=AE=B9?=
 =?UTF-8?q?=E9=BC=A0=E6=A0=87=E4=BA=8B=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/core/view/mixins/touchtrack.js | 60 ++++++++++++++++++++++++------
 1 file changed, 49 insertions(+), 11 deletions(-)

diff --git a/src/core/view/mixins/touchtrack.js b/src/core/view/mixins/touchtrack.js
index f4762d525..621e088ae 100644
--- a/src/core/view/mixins/touchtrack.js
+++ b/src/core/view/mixins/touchtrack.js
@@ -1,5 +1,5 @@
-var addListenerToElement = function (element, type, callback, r) {
-  // 暂时忽略capture
+const addListenerToElement = function (element, type, callback, capture) {
+  // 暂时忽略 capture
   element.addEventListener(type, $event => {
     if (typeof callback === 'function') {
       if (callback($event) === false) {
@@ -13,14 +13,18 @@ var addListenerToElement = function (element, type, callback, r) {
 }
 
 export default {
+  beforeDestroy () {
+    document.removeEventListener('mousemove', this.__mouseMoveEventListener)
+    document.removeEventListener('mouseup', this.__mouseUpEventListener)
+  },
   methods: {
     touchtrack: function (element, method, useCancel) {
-      var self = this
-      var x0 = 0
-      var y0 = 0
-      var x1 = 0
-      var y1 = 0
-      var fn = function ($event, state, x, y) {
+      const self = this
+      let x0 = 0
+      let y0 = 0
+      let x1 = 0
+      let y1 = 0
+      const fn = function ($event, state, x, y) {
         if (self[method]({
           target: $event.target,
           currentTarget: $event.currentTarget,
@@ -43,32 +47,66 @@ export default {
         }
       }
 
-      var $eventOld = null
+      let $eventOld = null
+      let hasTouchStart
+      let hasMouseDown
       addListenerToElement(element, 'touchstart', function ($event) {
         if ($event.touches.length === 1 && !$eventOld) {
+          hasTouchStart = true
           $eventOld = $event
           x0 = x1 = $event.touches[0].pageX
           y0 = y1 = $event.touches[0].pageY
           return fn($event, 'start', x0, y0)
         }
       })
+      addListenerToElement(element, 'mousedown', function ($event) {
+        hasMouseDown = true
+        if (!hasTouchStart) {
+          // TODO touches changedTouches
+          $eventOld = $event
+          x0 = x1 = $event.pageX
+          y0 = y1 = $event.pageY
+          return fn($event, 'start', x0, y0)
+        }
+      })
       addListenerToElement(element, 'touchmove', function ($event) {
         if ($event.touches.length === 1 && $eventOld) {
-          var res = fn($event, 'move', $event.touches[0].pageX, $event.touches[0].pageY)
+          const res = fn($event, 'move', $event.touches[0].pageX, $event.touches[0].pageY)
           x1 = $event.touches[0].pageX
           y1 = $event.touches[0].pageY
           return res
         }
       })
+      const mouseMoveEventListener = this.__mouseMoveEventListener = function ($event) {
+        if (!hasTouchStart && hasMouseDown) {
+          // TODO target currentTarget touches changedTouches
+          const res = fn($event, 'move', $event.pageX, $event.pageY)
+          x1 = $event.pageX
+          y1 = $event.pageY
+          return res
+        }
+      }
+      document.addEventListener('mousemove', mouseMoveEventListener)
       addListenerToElement(element, 'touchend', function ($event) {
         if ($event.touches.length === 0 && $eventOld) {
+          hasTouchStart = false
           $eventOld = null
           return fn($event, 'end', $event.changedTouches[0].pageX, $event.changedTouches[0].pageY)
         }
       })
+      const mouseUpEventListener = this.__mouseUpEventListener = function ($event) {
+        hasMouseDown = false
+        if (!hasTouchStart) {
+          // TODO target currentTarget touches changedTouches
+          $eventOld = null
+          return fn($event, 'end', $event.pageX, $event.pageY)
+        }
+      }
+      document.addEventListener('mouseup', mouseUpEventListener)
       addListenerToElement(element, 'touchcancel', function ($event) {
         if ($eventOld) {
-          var $eventTemp = $eventOld
+          hasTouchStart = false
+          const $eventTemp = $eventOld
           $eventOld = null
           return fn($event, useCancel ? 'cancel' : 'end', $eventTemp.touches[0].pageX, $eventTemp.touches[0].pageY)
         }
-- 
GitLab