diff --git a/packages/artplayer/src/events/gestureInit.js b/packages/artplayer/src/events/gestureInit.js index a251bbf2f..d202cef93 100644 --- a/packages/artplayer/src/events/gestureInit.js +++ b/packages/artplayer/src/events/gestureInit.js @@ -37,9 +37,10 @@ export default function gestureInit(art, events) { let startX = 0; let startY = 0; let startTime = 0; + let startVolume = 0; const onTouchStart = (event) => { - if (event.touches.length === 1 && !art.isLock) { + if (event.touches.length === 1 && !art.isLock && !art.isFastForwarding) { if (touchTarget === $progress) { setCurrentTime(art, event); } @@ -49,25 +50,38 @@ export default function gestureInit(art, events) { startX = pageX; startY = pageY; startTime = art.currentTime; + startVolume = art.volume; } }; const onTouchMove = (event) => { - if (event.touches.length === 1 && isDroging && art.duration) { + if (event.touches.length === 1 && isDroging && art.duration && !art.isFastForwarding) { const { pageX, pageY } = event.touches[0]; const direction = GetSlideDirection(startX, startY, pageX, pageY); const isHorizontal = [3, 4].includes(direction); const isVertical = [1, 2].includes(direction); const isLegal = (isHorizontal && !art.isRotate) || (isVertical && art.isRotate); - if (isLegal) { - const ratioX = clamp((pageX - startX) / art.width, -1, 1); - const ratioY = clamp((pageY - startY) / art.height, -1, 1); - const ratio = art.isRotate ? ratioY : ratioX; - const TOUCH_MOVE_RATIO = touchTarget === $video ? art.constructor.TOUCH_MOVE_RATIO : 1; - const currentTime = clamp(startTime + art.duration * ratio * TOUCH_MOVE_RATIO, 0, art.duration); - art.seek = currentTime; - art.emit('setBar', 'played', clamp(currentTime / art.duration, 0, 1), event); - art.notice.show = `${secondToTime(currentTime)} / ${secondToTime(art.duration)}`; + const isLegalVolumeAction = /*isHorizontal && art.isRotate ||*/ isVertical && !art.isRotate; + if (isLegal || isLegalVolumeAction) { + const ratioX = (0, _utils.clamp)((pageX - startX) / art.width, -1, 1); + const ratioY = (0, _utils.clamp)((pageY - startY) / art.height, -1, 1); + + if (isLegal) { + const ratio = art.isRotate ? ratioY : ratioX; + const TOUCH_MOVE_RATIO = touchTarget === $video ? art.constructor.TOUCH_MOVE_RATIO : 1; + const currentTime = (0, _utils.clamp)(startTime + art.duration * ratio * TOUCH_MOVE_RATIO, 0, art.duration); + art.seek = currentTime; + art.emit("setBar", "played", (0, _utils.clamp)(currentTime / art.duration, 0, 1), event); + art.notice.show = `${(0, _utils.secondToTime)(currentTime)} / ${(0, _utils.secondToTime)(art.duration)}`; + } else { + const ratio = art.isRotate ? ratioX : ratioY; + const compensationRatio = 1.2; + const currentVolume = (0, _utils.clamp)(startVolume - 1 * ratio * compensationRatio, 0, 1); + art.volume = currentVolume; + art.notice.show = `音量: ${(currentVolume * 100) >> 0}%`; + } + + art.lastSwipeTime = Date.now(); } } }; diff --git a/packages/artplayer/src/index.js b/packages/artplayer/src/index.js index 8636d7500..a3971e6c3 100644 --- a/packages/artplayer/src/index.js +++ b/packages/artplayer/src/index.js @@ -41,6 +41,8 @@ export default class Artplayer extends Emitter { this.isInput = false; this.isRotate = false; this.isDestroy = false; + this.isFastForwarding = false; + this.lastSwipeTime = 0; this.template = new Template(this); this.events = new Events(this); diff --git a/packages/artplayer/src/plugins/fastForward.js b/packages/artplayer/src/plugins/fastForward.js index b3d041758..36aae4892 100644 --- a/packages/artplayer/src/plugins/fastForward.js +++ b/packages/artplayer/src/plugins/fastForward.js @@ -14,9 +14,16 @@ export default function fastForward(art) { const onStart = (event) => { if (event.touches.length === 1 && art.playing && !art.isLock) { timer = setTimeout(() => { + let curTime = Date.now(); + let timeDiff = curTime - art.lastSwipeTime; + if (timeDiff < constructor.FAST_FORWARD_TIME) { + return + } + isPress = true; lastPlaybackRate = art.playbackRate; art.playbackRate = constructor.FAST_FORWARD_VALUE; + art.isFastForwarding = true; addClass($player, 'art-fast-forward'); }, constructor.FAST_FORWARD_TIME); } @@ -27,12 +34,13 @@ export default function fastForward(art) { if (isPress) { isPress = false; art.playbackRate = lastPlaybackRate; + art.isFastForwarding = false; removeClass($player, 'art-fast-forward'); } }; proxy($video, 'touchstart', onStart); - proxy(document, 'touchmove', onStop); + // proxy(document, 'touchmove', onStop); proxy(document, 'touchend', onStop); return {