Fix minor bugs and remove loop control

packages/artplayer/src/control/index.js

@@ -10,7 +10,6 @@ import volume from './volume';
 import setting from './setting';
 import thumbnails from './thumbnails';
 import screenshot from './screenshot';
-import loop from './loop';
 import airplay from './airplay';
 
 export default class Control extends Component {
@@ -21,6 +20,7 @@ export default class Control extends Component {
         this.timer = Date.now();
 
         const { constructor } = art;
+        const { $player } = this.art.template;
 
         art.on('mousemove', () => {
             if (!isMobile) {
@@ -42,32 +42,20 @@ export default class Control extends Component {
             }
         });
 
+        art.on('control', (state) => {
+            if (state) {
+                removeClass($player, 'art-hide-cursor');
+                addClass($player, 'art-hover');
+                this.timer = Date.now();
+            } else {
+                addClass($player, 'art-hide-cursor');
+                removeClass($player, 'art-hover');
+            }
+        });
+
         this.init();
     }
 
-    set show(state) {
-        const { $player } = this.art.template;
-
-        if (state) {
-            removeClass($player, 'art-hide-cursor');
-            addClass($player, 'art-hover');
-            this.timer = Date.now();
-        } else {
-            addClass($player, 'art-hide-cursor');
-            removeClass($player, 'art-hover');
-        }
-
-        super.show = state;
-    }
-
-    get show() {
-        return super.show;
-    }
-
-    toggle() {
-        this.show = !this.show;
-    }
-
     init() {
         const { option } = this.art;
 
@@ -91,14 +79,6 @@ export default class Control extends Component {
             );
         }
 
-        this.add(
-            loop({
-                name: 'loop',
-                position: 'top',
-                index: 30,
-            }),
-        );
-
         this.add(
             playAndPause({
                 name: 'playAndPause',

packages/artplayer/src/control/loop.js

@@ -1,21 +0,0 @@
-import { append, setStyle } from '../utils';
-
-export default function loop(option) {
-    return (art) => ({
-        ...option,
-        mounted: ($control) => {
-            const $left = append($control, `<span class="art-loop-point"></span>`);
-            const $right = append($control, `<span class="art-loop-point"></span>`);
-
-            art.on('loop', (value) => {
-                if (value && value.length) {
-                    setStyle($control, 'display', 'flex');
-                    setStyle($left, 'left', `calc(${(value[0] / art.duration) * 100}% - ${$left.clientWidth}px)`);
-                    setStyle($right, 'left', `${(value[1] / art.duration) * 100}%`);
-                } else {
-                    setStyle($control, 'display', 'none');
-                }
-            });
-        },
-    });
-}