refactor: Simplify thumbnails implementation in Artplayer

packages/artplayer/src/control/index.js

@@ -8,7 +8,6 @@ import progress from './progress';
 import time from './time';
 import volume from './volume';
 import setting from './setting';
-import thumbnails from './thumbnails';
 import screenshot from './screenshot';
 import airplay from './airplay';
 
@@ -81,13 +80,11 @@ export default class Control extends Component {
             );
         }
 
-        this.add(
-            thumbnails({
-                name: 'thumbnails',
-                position: 'top',
-                index: 20,
-            }),
-        );
+        this.add({
+            name: 'thumbnails',
+            position: 'top',
+            index: 20,
+        });
 
         this.add(
             playAndPause({

packages/artplayer/src/control/thumbnails.js

@@ -1,8 +0,0 @@
-export default function thumbnails(options) {
-    return (art) => ({
-        ...options,
-        mounted: () => {
-            art.thumbnails = art.options.thumbnails;
-        },
-    });
-}

packages/artplayer/src/player/thumbnailsMix.js

@@ -46,14 +46,15 @@ export default function thumbnailsMix(art) {
 
     art.on('setBar', async (type, percentage, event) => {
         const $thumbnails = art.controls?.thumbnails;
-        if (!$thumbnails) return;
+        const { url } = option.thumbnails;
+        if (!$thumbnails || !url) return;
 
         const isMobileDroging = type === 'played' && event && isMobile;
 
         if (type === 'hover' || isMobileDroging) {
             if (!loading) {
                 loading = true;
-                image = await loadImg(option.thumbnails.url);
+                image = await loadImg(url);
                 isLoad = true;
             }