fix(xgpalyer): mobile touche修复

bytedance · May 15, 2024 · f7e8b03 · f7e8b03
1 parent 849541d
commit f7e8b03
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/packages/xgplayer/src/plugins/mobile/index.js b/packages/xgplayer/src/plugins/mobile/index.js
@@ -198,6 +198,7 @@ class MobilePlugin extends Plugin {
         });
         ['dragend', 'click'].forEach(key => {
           progressPlugin.addCallBack(key, () => {
+            console.log('>>>changeAction ACTIONS.AUTO progressPlugin')
             this.changeAction(ACTIONS.AUTO)
           })
         })
@@ -357,6 +358,7 @@ class MobilePlugin extends Plugin {
    */
   endLastMove (lastScope) {
     const { pos, player, config } = this
+    console.log('>>>endLastMove', lastScope)
     const time = (pos.time - this.timeOffset) / 1000
     switch (lastScope) {
       case 0:
@@ -370,6 +372,7 @@ class MobilePlugin extends Plugin {
       case 2:
       default:
     }
+    console.log('>>>changeAction ACTIONS.AUTO endLastMove')
     this.changeAction(ACTIONS.AUTO)
   }
 
@@ -379,7 +382,7 @@ class MobilePlugin extends Plugin {
     if (touche && !config.disableGesture && this.duration > 0 && !player.ended) {
       pos.isStart = true
       this.timer && clearTimeout(this.timer)
-      e.cancelable && e.preventDefault()
+      // e.cancelable && e.preventDefault()
       Util.checkIsFunction(playerConfig.disableSwipeHandler) && playerConfig.disableSwipeHandler()
       this.find('.xg-dur').innerHTML = Util.format(this.duration)
       // pos.volume = player.volume * 100
@@ -437,7 +440,7 @@ class MobilePlugin extends Plugin {
       if (scope === -1 || (scope > 0 && !config.gestureY) || (scope === 0 && !config.gestureX)) {
         return
       }
-      e.cancelable && e.preventDefault()
+      // e.cancelable && e.preventDefault()
       this.executeMove(diffx, diffy, scope, pos.width, pos.height)
       pos.x = x
       pos.y = y
@@ -447,6 +450,7 @@ class MobilePlugin extends Plugin {
   }
 
   onTouchEnd = (e) => {
+    console.log('>>>>onTouchEnd', this.pos.scope)
     const { player, pos, playerConfig } = this
     setTimeout(() => {
       player.getPlugin('progress') && player.getPlugin('progress').resetSeekState()
@@ -467,6 +471,7 @@ class MobilePlugin extends Plugin {
     pos.scope = -1
     this.resetPos()
     Util.checkIsFunction(playerConfig.enableSwipeHandler) && playerConfig.enableSwipeHandler()
+    console.log('>>>changeAction ACTIONS.AUTO1')
     this.changeAction(ACTIONS.AUTO)
   }
 
@@ -493,6 +498,7 @@ class MobilePlugin extends Plugin {
   }
 
   onRootTouchEnd = (e) => {
+    console.log('>>>>onRootTouchEnd', this.pos.scope)
     if (this.pos.scope > -1) {
       this.onTouchEnd(e)
       // const { controls } = this.player
@@ -510,6 +516,7 @@ class MobilePlugin extends Plugin {
   }
 
   clickHandler (e) {
+    console.log('>>>clickHandler')
     const { player, config, playerConfig } = this
     if (player.state < STATES.RUNNING) {
       if (!playerConfig.closeVideoClick) {
@@ -539,13 +546,15 @@ class MobilePlugin extends Plugin {
   }
 
   onClick (e) {
+    console.log('>>>onClick')
     const { player } = this
     runHooks(this, HOOKS[0], (plugin, data) => {
       this.clickHandler(data.e)
     }, { e, paused: player.paused })
   }
 
   onDbClick (e) {
+    console.log('>>>onDbClick')
     const { player } = this
     runHooks(this, HOOKS[1], (plugin, data) => {
       this.dbClickHandler(data.e)
@@ -575,6 +584,7 @@ class MobilePlugin extends Plugin {
     this.emitUserAction('pressend', 'change_rate', { prop: 'playbackRate', from: player.playbackRate, to: pos.rate })
     player.playbackRate = pos.rate
     pos.rate = 1
+    console.log('>>>changeAction ACTIONS.AUTO2')
     this.changeAction(ACTIONS.AUTO)
   }
 

diff --git a/packages/xgplayer/src/plugins/mobile/touch.js b/packages/xgplayer/src/plugins/mobile/touch.js
@@ -90,14 +90,17 @@ class Touche {
   }
 
   __setDb (e) {
+    console.log('>>>__setDb', this.dbIntrvalId)
     const { config } = this
     if (this.dbIntrvalId) {
+      console.log('>>>__setDb __clearDb')
       this.__clearDb()
       this.trigger(EVENTS.DOUBlE_CLICK, e)
       return
     }
     this.dbIntrvalId = setTimeout(() => {
       this.__clearDb()
+      console.log('>>>__setDb setTimeout', `start:${this._pos.start} press:${this._pos.press} moving:${this._pos.moving}`, !this._pos.start && !this._pos.press && !this._pos.moving)
       if (!this._pos.start && !this._pos.press && !this._pos.moving) {
         this.trigger(EVENTS.CLICK, e)
       }
@@ -148,6 +151,7 @@ class Touche {
 
   onTouchStart = (e) => {
     const { _pos, root } = this
+    console.log('>>>> touche onTouchStart', _pos.moving)
     // config.needPreventDefault && preventToucheDefault(e)
     const touch = getTouch(e.touches)
     _pos.x = touch ? parseInt(touch.pageX, 10) : e.pageX
@@ -166,6 +170,7 @@ class Touche {
 
   onTouchEnd = (e) => {
     const { _pos, root } = this
+    console.log('>>>>touche onTouchEnd', `press:${_pos.press} moving:${_pos.moving}`, !_pos.press && !_pos.moving)
     // config.needPreventDefault && preventToucheDefault(e)
     this.__clearPress()
     root.removeEventListener(this.events.cancel, this.onTouchCancel)
@@ -183,6 +188,7 @@ class Touche {
 
   onTouchMove = (e) => {
     const { _pos, config } = this
+    console.log('>>>> touche onTouchMove', _pos.moving)
     const touch = getTouch(e.touches)
     const x = touch ? parseInt(touch.pageX, 10) : e.pageX
     const y = touch ? parseInt(touch.pageY, 10) : e.pageX