remove indicatorGestureInit

packages/artplayer/src/events/gestureInit.js

@@ -1,116 +1,60 @@
-import { clamp, secondToTime, isMobile } from '../utils';
-
-export function indicatorGestureInit(art, $indicator, setBar) {
-    if (isMobile && !art.option.isLive) {
-        const {
-            plugins,
-            template: { $progress },
-            events: { proxy },
-        } = art;
-
-        let isDroging = false;
-
-        proxy($indicator, 'touchstart', (event) => {
-            if (event.touches.length === 1) {
-                isDroging = true;
-            }
-        });
-
-        proxy(document, 'touchmove', (event) => {
-            if (event.touches.length === 1 && isDroging) {
-                const autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
-
-                const { left, top } = $progress.getBoundingClientRect();
-                const { clientX, clientY } = event.touches[0];
-
-                const width = clamp(clientX - left, 0, $progress.clientWidth);
-                const height = clamp(clientY - top, 0, $progress.clientWidth);
-                const size = autoOrientation ? height : width;
-
-                const secondX = (width / $progress.clientWidth) * art.duration;
-                const secondY = (height / $progress.clientWidth) * art.duration;
-
-                const second = autoOrientation ? secondY : secondX;
-                const percentage = clamp(size / $progress.clientWidth, 0, 1);
-
-                setBar('played', percentage);
-                art.seek = second;
-            }
-        });
-
-        proxy(document, 'touchend', () => {
-            if (isDroging) {
-                isDroging = false;
-            }
-        });
-    }
-}
+import { clamp, secondToTime, isMobile, includeFromEvent } from '../utils';
 
 export default function gestureInit(art, events) {
     if (isMobile && !art.option.isLive) {
         const {
             notice,
             plugins,
-            constructor,
-            template: { $video },
+            template: { $video, $bottom, $controls },
         } = art;
 
         let isDroging = false;
         let startX = 0;
         let startY = 0;
-        let currentTime = 0;
-        let pressTimer = null;
+        let startTime = 0;
 
-        events.proxy($video, 'touchstart', (event) => {
+        const onTouchStart = (event) => {
             if (event.touches.length === 1) {
                 isDroging = true;
                 const { clientX, clientY } = event.touches[0];
                 startX = clientX;
                 startY = clientY;
-
-                clearTimeout(pressTimer);
-                pressTimer = setTimeout(() => {
-                    art.playbackRate = constructor.MOBILE_AUTO_PLAYBACKRATE;
-                }, constructor.MOBILE_AUTO_PLAYBACKRATE_TIME);
+                startTime = art.currentTime;
             }
-        });
+        };
 
-        events.proxy($video, 'touchmove', (event) => {
-            if (event.touches.length === 1 && isDroging) {
+        const onTouchMove = (event) => {
+            if (event.touches.length === 1 && isDroging && art.duration) {
                 const autoOrientation = plugins.autoOrientation && plugins.autoOrientation.state;
-
                 const { clientX, clientY } = event.touches[0];
                 const ratioX = clamp((clientX - startX) / art.width, -1, 1);
                 const ratioY = clamp((clientY - startY) / art.height, -1, 1);
-
-                if (art.duration) {
-                    if (autoOrientation) {
-                        currentTime = clamp(art.currentTime + art.duration * ratioY, 0, art.duration);
-                    } else {
-                        currentTime = clamp(art.currentTime + art.duration * ratioX, 0, art.duration);
-                    }
-                    notice.show = `${secondToTime(currentTime)} / ${secondToTime(art.duration)}`;
-                }
+                const ratio = autoOrientation ? ratioY : ratioX;
+                const currentTime = clamp(startTime + art.duration * ratio, 0, art.duration);
+                art.seek = currentTime;
+                art.emit('setBar', 'played', clamp(currentTime / art.duration, 0, 1));
+                notice.show = `${secondToTime(currentTime)} / ${secondToTime(art.duration)}`;
             }
-        });
+        };
 
-        events.proxy(document, 'touchend', () => {
+        const onTouchEnd = () => {
             if (isDroging) {
-                if (currentTime) {
-                    art.seek = currentTime;
-                }
-
-                if (art.playbackRate === 3) {
-                    art.playbackRate = 1;
-                }
-
                 startX = 0;
                 startY = 0;
-                currentTime = 0;
+                startTime = 0;
                 isDroging = false;
-                clearTimeout(pressTimer);
-                pressTimer = null;
+            }
+        };
+
+        events.proxy($bottom, 'touchstart', (event) => {
+            if (!includeFromEvent(event, $controls)) {
+                onTouchStart(event);
             }
         });
+
+        events.proxy($bottom, 'touchmove', onTouchMove);
+        events.proxy($video, 'touchstart', onTouchStart);
+        events.proxy($video, 'touchmove', onTouchMove);
+        events.proxy(document, 'touchend', onTouchEnd);
     }
 }