remove player object

packages/artplayer/src/player/aspectRatioMix.js

@@ -1,19 +1,17 @@
 import { setStyle, errorHandle, def } from '../utils';
 
-export default function aspectRatioMix(art, player) {
+export default function aspectRatioMix(art) {
     const {
         template: { $video, $player },
         i18n,
         notice,
     } = art;
 
-    def(player, 'aspectRatio', {
+    def(art, 'aspectRatio', {
         get() {
             return $player.dataset.aspectRatio || '';
         },
-        set(ratio) {
-            if (!ratio) ratio = 'default';
-
+        set(ratio = 'default') {
             const ratioList = ['default', '4:3', '16:9'];
             errorHandle(ratioList.includes(ratio), `'aspectRatio' only accept ${ratioList.toString()} as parameters`);
 
@@ -23,7 +21,7 @@ export default function aspectRatioMix(art, player) {
                 setStyle($video, 'padding', null);
                 delete $player.dataset.aspectRatio;
             } else {
-                const ratioArray = ratio.split(':');
+                const ratioArray = ratio.split(':').map(Number);
                 const { videoWidth, videoHeight } = $video;
                 const { clientWidth, clientHeight } = $player;
                 const videoRatio = videoWidth / videoHeight;
@@ -47,11 +45,11 @@ export default function aspectRatioMix(art, player) {
         },
     });
 
-    def(player, 'aspectRatioReset', {
+    def(art, 'aspectRatioReset', {
         set(value) {
-            if (value && player.aspectRatio) {
-                const { aspectRatio } = player;
-                player.aspectRatio = aspectRatio;
+            if (value && art.aspectRatio) {
+                const { aspectRatio } = art;
+                art.aspectRatio = aspectRatio;
             }
         },
     });

packages/artplayer/src/player/attrInit.js

@@ -1,6 +1,6 @@
 import { clamp, setStyle } from '../utils';
 
-export default function attrInit(art, player) {
+export default function attrInit(art) {
     const {
         option,
         storage,
@@ -36,6 +36,6 @@ export default function attrInit(art, player) {
     $video.controls = false;
 
     if (option.ads.length === 0) {
-        player.url = option.url;
+        art.url = option.url;
     }
 }

packages/artplayer/src/player/autoHeightMix.js

@@ -1,6 +1,6 @@
 import { setStyle, hasClass, addClass, removeClass, def } from '../utils';
 
-export default function autoHeightMix(art, player) {
+export default function autoHeightMix(art) {
     const {
         option,
         template: { $container, $video },
@@ -8,7 +8,7 @@ export default function autoHeightMix(art, player) {
 
     const heightCache = $container.style.height;
 
-    def(player, 'autoHeight', {
+    def(art, 'autoHeight', {
         get() {
             return hasClass($container, 'art-auto-height');
         },
@@ -19,12 +19,12 @@ export default function autoHeightMix(art, player) {
                 const height = videoHeight * (clientWidth / videoWidth);
                 setStyle($container, 'height', height + 'px');
                 addClass($container, 'art-auto-height');
-                player.autoSize = option.autoSize;
+                art.autoSize = option.autoSize;
                 art.emit('autoHeight', height);
             } else {
                 setStyle($container, 'height', heightCache);
                 removeClass($container, 'art-auto-height');
-                player.autoSize = option.autoSize;
+                art.autoSize = option.autoSize;
                 art.emit('autoHeight');
             }
         },

packages/artplayer/src/player/autoSizeMix.js

@@ -1,9 +1,9 @@
 import { setStyle, addClass, removeClass, hasClass, def } from '../utils';
 
-export default function resizeMix(art, player) {
+export default function resizeMix(art) {
     const { $container, $player, $video } = art.template;
 
-    def(player, 'autoSize', {
+    def(art, 'autoSize', {
         get() {
             return hasClass($container, 'art-auto-size');
         },
@@ -24,8 +24,8 @@ export default function resizeMix(art, player) {
                     setStyle($player, 'height', `${percentage}%`);
                 }
                 art.emit('autoSize', {
-                    width: player.width,
-                    height: player.height,
+                    width: art.width,
+                    height: art.height,
                 });
             } else {
                 removeClass($container, 'art-auto-size');

packages/artplayer/src/player/currentTimeMix.js

@@ -1,13 +1,13 @@
 import { clamp, def } from '../utils';
 
-export default function currentTimeMix(art, player) {
+export default function currentTimeMix(art) {
     const { $video } = art.template;
 
-    def(player, 'currentTime', {
+    def(art, 'currentTime', {
         get: () => $video.currentTime || 0,
         set: (time) => {
             // Fixed: The provided double value is non-finite
-            $video.currentTime = clamp(parseFloat(time.toFixed(3)), 0, player.duration);
+            $video.currentTime = clamp(parseFloat(time.toFixed(3)), 0, art.duration);
         },
     });
 }

packages/artplayer/src/player/durationMix.js

@@ -1,7 +1,7 @@
 import { def } from '../utils';
 
-export default function durationMix(art, player) {
-    def(player, 'duration', {
+export default function durationMix(art) {
+    def(art, 'duration', {
         get: () => {
             const { duration } = art.template.$video;
             if (duration === Infinity) return 0;

packages/artplayer/src/player/eventInit.js

@@ -1,7 +1,7 @@
 import config from '../config';
 import { sleep, addClass, setStyle, isMobile } from '../utils';
 
-export default function eventInit(art, player) {
+export default function eventInit(art) {
     const {
         option,
         events: { proxy },
@@ -14,11 +14,11 @@ export default function eventInit(art, player) {
     const maxReconnectTime = 5;
 
     proxy($video, 'click', () => {
-        player.toggle();
+        art.toggle();
     });
 
     proxy($video, 'dblclick', () => {
-        player.fullscreen = !player.fullscreen;
+        art.fullscreen = !art.fullscreen;
     });
 
     config.events.forEach((eventName) => {
@@ -58,8 +58,8 @@ export default function eventInit(art, player) {
 
     art.on('video:ended', () => {
         if (option.loop) {
-            player.seek = 0;
-            player.play();
+            art.seek = 0;
+            art.play();
             art.controls.show = false;
             art.mask.show = false;
         } else {
@@ -72,7 +72,7 @@ export default function eventInit(art, player) {
         if (reconnectTime < maxReconnectTime) {
             sleep(1000).then(() => {
                 reconnectTime += 1;
-                player.url = option.url;
+                art.url = option.url;
                 notice.show = `${i18n.get('Reconnect')}: ${reconnectTime}`;
                 art.emit('error', reconnectTime);
             });
@@ -92,7 +92,7 @@ export default function eventInit(art, player) {
     // });
 
     art.once('video:loadedmetadata', () => {
-        player.autoSize = option.autoSize;
+        art.autoSize = option.autoSize;
         if (isMobile) {
             art.loading.show = false;
             art.controls.show = true;

packages/artplayer/src/player/exclusiveInit.js

@@ -1,17 +1,17 @@
 import { def } from '../utils';
 
-export default function exclusiveInit(art, player) {
+export default function exclusiveInit(art) {
     const sizeProps = ['mini', 'pip', 'fullscreen', 'fullscreenWeb'];
 
     function exclusive(props) {
         props.forEach((name) => {
             art.on(name, () => {
-                if (player[name]) {
+                if (art[name]) {
                     props
                         .filter((item) => item !== name)
                         .forEach((item) => {
-                            if (player[item]) {
-                                player[item] = false;
+                            if (art[item]) {
+                                art[item] = false;
                             }
                         });
                 }
@@ -21,9 +21,9 @@ export default function exclusiveInit(art, player) {
 
     exclusive(sizeProps);
 
-    def(player, 'normalSize', {
+    def(art, 'normalSize', {
         get() {
-            return sizeProps.every((name) => !player[name]);
+            return sizeProps.every((name) => !art[name]);
         },
     });
 }

packages/artplayer/src/player/flipMix.js

@@ -1,13 +1,13 @@
 import { errorHandle, def } from '../utils';
 
-export default function flipMix(art, player) {
+export default function flipMix(art) {
     const {
         template: { $player },
         i18n,
         notice,
     } = art;
 
-    def(player, 'flip', {
+    def(art, 'flip', {
         get() {
             return $player.dataset.flip;
         },
@@ -20,7 +20,7 @@ export default function flipMix(art, player) {
             if (flip === 'normal') {
                 delete $player.dataset.flip;
             } else {
-                player.rotate = false;
+                art.rotate = false;
                 $player.dataset.flip = flip;
             }
 
@@ -30,11 +30,11 @@ export default function flipMix(art, player) {
         },
     });
 
-    def(player, 'flipReset', {
+    def(art, 'flipReset', {
         set(value) {
-            if (value && player.flip) {
-                const { flip } = player;
-                player.flip = flip;
+            if (value && art.flip) {
+                const { flip } = art;
+                art.flip = flip;
             }
         },
     });

packages/artplayer/src/player/fullscreenMix.js

@@ -1,12 +1,12 @@
 import screenfull from 'screenfull';
 import { addClass, removeClass, def, get } from '../utils';
 
-const nativeScreenfull = (art, player) => {
+const nativeScreenfull = (art) => {
     const { $player } = art.template;
 
     screenfull.on('change', () => art.emit('fullscreen', screenfull.isFullscreen));
 
-    def(player, 'fullscreen', {
+    def(art, 'fullscreen', {
         get() {
             return screenfull.isFullscreen;
         },
@@ -14,16 +14,16 @@ const nativeScreenfull = (art, player) => {
             if (value) {
                 screenfull.request($player).then(() => {
                     addClass($player, 'art-fullscreen');
-                    player.aspectRatioReset = true;
-                    player.autoSize = false;
+                    art.aspectRatioReset = true;
+                    art.autoSize = false;
                     art.emit('resize');
                     art.emit('fullscreen', true);
                 });
             } else {
                 screenfull.exit().then(() => {
                     removeClass($player, 'art-fullscreen');
-                    player.aspectRatioReset = true;
-                    player.autoSize = art.option.autoSize;
+                    art.aspectRatioReset = true;
+                    art.autoSize = art.option.autoSize;
                     art.emit('resize');
                     art.emit('fullscreen');
                 });
@@ -32,10 +32,10 @@ const nativeScreenfull = (art, player) => {
     });
 };
 
-const webkitScreenfull = (art, player) => {
+const webkitScreenfull = (art) => {
     const { $video } = art.template;
 
-    def(player, 'fullscreen', {
+    def(art, 'fullscreen', {
         get() {
             return $video.webkitDisplayingFullscreen;
         },
@@ -51,7 +51,7 @@ const webkitScreenfull = (art, player) => {
     });
 };
 
-export default function fullscreenMix(art, player) {
+export default function fullscreenMix(art) {
     const {
         i18n,
         notice,
@@ -60,11 +60,11 @@ export default function fullscreenMix(art, player) {
 
     art.once('ready', () => {
         if (screenfull.isEnabled) {
-            nativeScreenfull(art, player);
+            nativeScreenfull(art);
         } else if (document.fullscreenEnabled || $video.webkitSupportsFullscreen) {
-            webkitScreenfull(art, player);
+            webkitScreenfull(art);
         } else {
-            def(player, 'fullscreen', {
+            def(art, 'fullscreen', {
                 get() {
                     return false;
                 },
@@ -74,7 +74,7 @@ export default function fullscreenMix(art, player) {
             });
         }
 
-        // 异步设置
-        def(art, 'fullscreen', get(player, 'fullscreen'));
+        // Asynchronous setting
+        def(art, 'fullscreen', get(art, 'fullscreen'));
     });
 }

packages/artplayer/src/player/fullscreenWebMix.js

@@ -1,23 +1,23 @@
 import { addClass, removeClass, hasClass, def } from '../utils';
 
-export default function fullscreenWebMix(art, player) {
+export default function fullscreenWebMix(art) {
     const { $player } = art.template;
 
-    def(player, 'fullscreenWeb', {
+    def(art, 'fullscreenWeb', {
         get() {
             return hasClass($player, 'art-fullscreen-web');
         },
         set(value) {
             if (value) {
                 addClass($player, 'art-fullscreen-web');
-                player.aspectRatioReset = true;
-                player.autoSize = false;
+                art.aspectRatioReset = true;
+                art.autoSize = false;
                 art.emit('resize');
                 art.emit('fullscreenWeb', true);
             } else {
                 removeClass($player, 'art-fullscreen-web');
-                player.aspectRatioReset = true;
-                player.autoSize = art.option.autoSize;
+                art.aspectRatioReset = true;
+                art.autoSize = art.option.autoSize;
                 art.emit('resize');
                 art.emit('fullscreenWeb');
             }

packages/artplayer/src/player/index.js

@@ -27,39 +27,37 @@ import loopMin from './loopMin';
 import rotateMix from './rotateMix';
 import posterMix from './posterMix';
 import autoHeightMix from './autoHeightMix';
-import { proxyPropertys } from '../utils';
 
 export default class Player {
     constructor(art) {
-        urlMix(art, this);
-        eventInit(art, this);
-        attrInit(art, this);
-        exclusiveInit(art, this);
-        playMix(art, this);
-        pauseMix(art, this);
-        toggleMix(art, this);
-        seekMix(art, this);
-        volumeMix(art, this);
-        currentTimeMix(art, this);
-        durationMix(art, this);
-        switchMix(art, this);
-        playbackRateMix(art, this);
-        aspectRatioMix(art, this);
-        screenshotMix(art, this);
-        fullscreenMix(art, this);
-        fullscreenWebMix(art, this);
-        pipMix(art, this);
-        loadedMix(art, this);
-        playedMix(art, this);
-        playingMix(art, this);
-        autoSizeMix(art, this);
-        rectMix(art, this);
-        flipMix(art, this);
-        miniMix(art, this);
-        loopMin(art, this);
-        rotateMix(art, this);
-        posterMix(art, this);
-        autoHeightMix(art, this);
-        proxyPropertys(art, this);
+        urlMix(art);
+        eventInit(art);
+        attrInit(art);
+        exclusiveInit(art);
+        playMix(art);
+        pauseMix(art);
+        toggleMix(art);
+        seekMix(art);
+        volumeMix(art);
+        currentTimeMix(art);
+        durationMix(art);
+        switchMix(art);
+        playbackRateMix(art);
+        aspectRatioMix(art);
+        screenshotMix(art);
+        fullscreenMix(art);
+        fullscreenWebMix(art);
+        pipMix(art);
+        loadedMix(art);
+        playedMix(art);
+        playingMix(art);
+        autoSizeMix(art);
+        rectMix(art);
+        flipMix(art);
+        miniMix(art);
+        loopMin(art);
+        rotateMix(art);
+        posterMix(art);
+        autoHeightMix(art);
     }
 }

packages/artplayer/src/player/loadedMix.js

@@ -1,13 +1,13 @@
 import { def } from '../utils';
 
-export default function seekMix(art, player) {
+export default function seekMix(art) {
     const { $video } = art.template;
 
-    def(player, 'loaded', {
-        get: () => player.loadedTime / $video.duration,
+    def(art, 'loaded', {
+        get: () => art.loadedTime / $video.duration,
     });
 
-    def(player, 'loadedTime', {
+    def(art, 'loadedTime', {
         get: () => ($video.buffered.length ? $video.buffered.end($video.buffered.length - 1) : 0),
     });
 }

packages/artplayer/src/player/loopMin.js

@@ -1,13 +1,13 @@
 import { def, clamp } from '../utils';
 
-export default function loopMin(art, player) {
+export default function loopMin(art) {
     let interval = [];
-    def(player, 'loop', {
+    def(art, 'loop', {
         get: () => interval,
         set: (value) => {
             if (Array.isArray(value) && typeof value[0] === 'number' && typeof value[1] === 'number') {
-                const start = clamp(value[0], 0, Math.min(value[1], player.duration));
-                const end = clamp(value[1], start, player.duration);
+                const start = clamp(value[0], 0, Math.min(value[1], art.duration));
+                const end = clamp(value[1], start, art.duration);
                 if (end - start >= 1) {
                     interval = [start, end];
                     art.emit('loop', interval);
@@ -24,8 +24,8 @@ export default function loopMin(art, player) {
 
     art.on('video:timeupdate', () => {
         if (interval.length) {
-            if (player.currentTime < interval[0] || player.currentTime > interval[1]) {
-                player.seek = interval[0];
+            if (art.currentTime < interval[0] || art.currentTime > interval[1]) {
+                art.seek = interval[0];
             }
         }
     });

packages/artplayer/src/player/miniMix.js

@@ -1,6 +1,6 @@
 import { append, setStyle, addClass, removeClass, hasClass, def, isInViewport } from '../utils';
 
-export default function miniMix(art, player) {
+export default function miniMix(art) {
     const {
         i18n,
         option,
@@ -20,8 +20,8 @@ export default function miniMix(art, player) {
         isDroging = true;
         lastPageX = event.pageX;
         lastPageY = event.pageY;
-        lastPlayerLeft = player.left;
-        lastPlayerTop = player.top;
+        lastPlayerLeft = art.left;
+        lastPlayerTop = art.top;
     });
 
     proxy(document, 'mousemove', (event) => {
@@ -42,20 +42,20 @@ export default function miniMix(art, player) {
     });
 
     proxy($miniClose, 'click', () => {
-        player.mini = false;
+        art.mini = false;
         isDroging = false;
         removeClass($player, 'art-is-dragging');
     });
 
     append($miniTitle, option.title || i18n.get('Mini player'));
 
-    def(player, 'mini', {
+    def(art, 'mini', {
         get() {
             return hasClass($player, 'art-mini');
         },
         set(value) {
             if (value) {
-                player.autoSize = false;
+                art.autoSize = false;
                 cacheStyle = $player.style.cssText;
                 addClass($player, 'art-mini');
                 const top = storage.get('top');
@@ -66,28 +66,28 @@ export default function miniMix(art, player) {
                     if (!isInViewport($miniHeader)) {
                         storage.del('top');
                         storage.del('left');
-                        player.mini = true;
+                        art.mini = true;
                     }
                 } else {
                     const $body = document.body;
-                    const top = $body.clientHeight - player.height - 50;
-                    const left = $body.clientWidth - player.width - 50;
+                    const top = $body.clientHeight - art.height - 50;
+                    const left = $body.clientWidth - art.width - 50;
                     storage.set('top', top);
                     storage.set('left', left);
                     setStyle($player, 'top', `${top}px`);
                     setStyle($player, 'left', `${left}px`);
                 }
-                player.aspectRatio = false;
-                player.playbackRate = false;
+                art.aspectRatio = false;
+                art.playbackRate = false;
                 art.emit('mini', true);
             } else {
                 $player.style.cssText = cacheStyle;
                 removeClass($player, 'art-mini');
                 setStyle($player, 'top', null);
                 setStyle($player, 'left', null);
-                player.aspectRatio = false;
-                player.playbackRate = false;
-                player.autoSize = option.autoSize;
+                art.aspectRatio = false;
+                art.playbackRate = false;
+                art.autoSize = option.autoSize;
                 art.emit('mini');
             }
         },

packages/artplayer/src/player/pauseMix.js

@@ -1,13 +1,13 @@
 import { def } from '../utils';
 
-export default function pauseMix(art, player) {
+export default function pauseMix(art) {
     const {
         template: { $video },
         i18n,
         notice,
     } = art;
 
-    def(player, 'pause', {
+    def(art, 'pause', {
         value() {
             const result = $video.pause();
             notice.show = i18n.get('Pause');

packages/artplayer/src/player/pipMix.js

@@ -1,6 +1,6 @@
 import { def } from '../utils';
 
-function nativePip(art, player) {
+function nativePip(art) {
     const {
         template: { $video },
         events: { proxy },
@@ -9,7 +9,7 @@ function nativePip(art, player) {
 
     $video.disablePictureInPicture = false;
 
-    def(player, 'pip', {
+    def(art, 'pip', {
         get() {
             return document.pictureInPictureElement;
         },
@@ -37,12 +37,12 @@ function nativePip(art, player) {
     });
 }
 
-function webkitPip(art, player) {
+function webkitPip(art) {
     const { $video } = art.template;
 
     $video.webkitSetPresentationMode('inline');
 
-    def(player, 'pip', {
+    def(art, 'pip', {
         get() {
             return $video.webkitPresentationMode === 'picture-in-picture';
         },
@@ -58,18 +58,18 @@ function webkitPip(art, player) {
     });
 }
 
-export default function pipMix(art, player) {
+export default function pipMix(art) {
     const {
         i18n,
         notice,
         template: { $video },
     } = art;
     if (document.pictureInPictureEnabled) {
-        nativePip(art, player);
+        nativePip(art);
     } else if ($video.webkitSupportsPresentationMode) {
-        webkitPip(art, player);
+        webkitPip(art);
     } else {
-        def(player, 'pip', {
+        def(art, 'pip', {
             get() {
                 return false;
             },

packages/artplayer/src/player/playMix.js

@@ -1,6 +1,6 @@
 import { def } from '../utils';
 
-export default function playMix(art, player) {
+export default function playMix(art) {
     const {
         i18n,
         notice,
@@ -9,7 +9,7 @@ export default function playMix(art, player) {
         template: { $video },
     } = art;
 
-    def(player, 'play', {
+    def(art, 'play', {
         value() {
             const promise = $video.play();
 
@@ -21,11 +21,7 @@ export default function playMix(art, player) {
             }
 
             if (mutex) {
-                instances
-                    .filter((item) => item !== art)
-                    .forEach((item) => {
-                        item.player.pause();
-                    });
+                instances.filter((item) => item !== art).forEach((item) => item.pause());
             }
 
             notice.show = i18n.get('Play');

packages/artplayer/src/player/playbackRateMix.js

@@ -1,13 +1,13 @@
 import { errorHandle, def } from '../utils';
 
-export default function playbackRateMix(art, player) {
+export default function playbackRateMix(art) {
     const {
         template: { $video, $player },
         i18n,
         notice,
     } = art;
 
-    def(player, 'playbackRate', {
+    def(art, 'playbackRate', {
         get() {
             return $player.dataset.playbackRate;
         },
@@ -20,20 +20,20 @@ export default function playbackRateMix(art, player) {
                 $player.dataset.playbackRate = rate;
                 notice.show = `${i18n.get('Rate')}: ${rate === 1.0 ? i18n.get('Normal') : `${rate}x`}`;
                 art.emit('playbackRate', rate);
-            } else if (player.playbackRate) {
-                player.playbackRate = 1;
+            } else if (art.playbackRate) {
+                art.playbackRate = 1;
                 delete $player.dataset.playbackRate;
                 art.emit('playbackRate');
             }
         },
     });
 
-    def(player, 'playbackRateReset', {
+    def(art, 'playbackRateReset', {
         set(value) {
             if (value) {
                 const { playbackRate } = $player.dataset;
                 if (playbackRate) {
-                    player.playbackRate = Number(playbackRate);
+                    art.playbackRate = Number(playbackRate);
                 }
             }
         },

packages/artplayer/src/player/playedMix.js

@@ -1,7 +1,7 @@
 import { def } from '../utils';
 
-export default function playedMix(art, player) {
-    def(player, 'played', {
-        get: () => player.currentTime / player.duration,
+export default function playedMix(art) {
+    def(art, 'played', {
+        get: () => art.currentTime / art.duration,
     });
 }

packages/artplayer/src/player/playingMix.js

@@ -1,8 +1,8 @@
 import { def } from '../utils';
 
-export default function playingMix(art, player) {
+export default function playingMix(art) {
     const { $video } = art.template;
-    def(player, 'playing', {
+    def(art, 'playing', {
         get: () => !!($video.currentTime > 0 && !$video.paused && !$video.ended && $video.readyState > 2),
     });
 }

packages/artplayer/src/player/posterMix.js

@@ -1,12 +1,12 @@
 import { def, setStyle } from '../utils';
 
-export default function posterMix(art, player) {
+export default function posterMix(art) {
     const {
         option,
         template: { $poster },
     } = art;
 
-    def(player, 'poster', {
+    def(art, 'poster', {
         get: () => option.poster,
         set(url) {
             option.poster = url;

packages/artplayer/src/player/rectMix.js

@@ -1,29 +1,29 @@
 import { def } from '../utils';
 
-export default function rectMix(art, player) {
-    def(player, 'rect', {
+export default function rectMix(art) {
+    def(art, 'rect', {
         get: () => {
             return art.template.$player.getBoundingClientRect();
         },
     });
 
-    ['bottom', 'height', 'left', 'right', 'top', 'width'].forEach(key => {
-        def(player, key, {
+    ['bottom', 'height', 'left', 'right', 'top', 'width'].forEach((key) => {
+        def(art, key, {
             get: () => {
-                return player.rect[key];
+                return art.rect[key];
             },
         });
     });
 
-    def(player, 'x', {
+    def(art, 'x', {
         get: () => {
-            return player.left + window.pageXOffset;
+            return art.left + window.pageXOffset;
         },
     });
 
-    def(player, 'y', {
+    def(art, 'y', {
         get: () => {
-            return player.top + window.pageYOffset;
+            return art.top + window.pageYOffset;
         },
     });
 }

packages/artplayer/src/player/rotateMix.js

@@ -1,13 +1,13 @@
 import { setStyle, errorHandle, def } from '../utils';
 
-export default function rotateMix(art, player) {
+export default function rotateMix(art) {
     const {
         template: { $video, $player },
         i18n,
         notice,
     } = art;
 
-    def(player, 'rotate', {
+    def(art, 'rotate', {
         get: () => Number($player.dataset.rotate) || 0,
         set: (deg) => {
             if (!deg) deg = 0;
@@ -19,7 +19,7 @@ export default function rotateMix(art, player) {
                 delete $player.dataset.rotate;
                 setStyle($video, 'transform', null);
             } else {
-                player.flip = false;
+                art.flip = false;
                 art.autoSize = true;
                 $player.dataset.rotate = deg;
 
@@ -65,11 +65,11 @@ export default function rotateMix(art, player) {
         },
     });
 
-    def(player, 'rotateReset', {
+    def(art, 'rotateReset', {
         set(value) {
-            if (value && player.rotate) {
-                const { rotate } = player;
-                player.rotate = rotate;
+            if (value && art.rotate) {
+                const { rotate } = art;
+                art.rotate = rotate;
             }
         },
     });

packages/artplayer/src/player/screenshotMix.js

@@ -1,6 +1,6 @@
 import { secondToTime, download, def } from '../utils';
 
-export default function screenshotMix(art, player) {
+export default function screenshotMix(art) {
     const {
         option,
         notice,
@@ -9,7 +9,7 @@ export default function screenshotMix(art, player) {
 
     const $canvas = document.createElement('canvas');
 
-    def(player, 'getDataURL', {
+    def(art, 'getDataURL', {
         value: () =>
             new Promise((resolve, reject) => {
                 try {
@@ -24,7 +24,7 @@ export default function screenshotMix(art, player) {
             }),
     });
 
-    def(player, 'getBlobUrl', {
+    def(art, 'getBlobUrl', {
         value: () =>
             new Promise((resolve, reject) => {
                 try {
@@ -41,9 +41,9 @@ export default function screenshotMix(art, player) {
             }),
     });
 
-    def(player, 'screenshot', {
+    def(art, 'screenshot', {
         value: () => {
-            return player.getDataURL().then((dataUri) => {
+            return art.getDataURL().then((dataUri) => {
                 download(dataUri, `${option.title || 'artplayer'}_${secondToTime($video.currentTime)}.png`);
                 art.emit('screenshot', dataUri);
                 return dataUri;

packages/artplayer/src/player/seekMix.js

@@ -1,27 +1,27 @@
 import { secondToTime, def } from '../utils';
 
-export default function seekMix(art, player) {
+export default function seekMix(art) {
     const { notice } = art;
 
-    def(player, 'seek', {
+    def(art, 'seek', {
         set(time) {
-            player.currentTime = time;
-            art.emit('seek', player.currentTime);
-            if (player.duration) {
-                notice.show = `${secondToTime(player.currentTime)} / ${secondToTime(player.duration)}`;
+            art.currentTime = time;
+            art.emit('seek', art.currentTime);
+            if (art.duration) {
+                notice.show = `${secondToTime(art.currentTime)} / ${secondToTime(art.duration)}`;
             }
         },
     });
 
-    def(player, 'forward', {
+    def(art, 'forward', {
         set(time) {
-            player.seek = player.currentTime + time;
+            art.seek = art.currentTime + time;
         },
     });
 
     def(player, 'backward', {
         set(time) {
-            player.seek = player.currentTime - time;
+            art.seek = art.currentTime - time;
         },
     });
 }

packages/artplayer/src/player/switchMix.js

@@ -1,22 +1,22 @@
 import { def } from '../utils';
 
-export default function switchMix(art, player) {
+export default function switchMix(art) {
     const { i18n, option, notice } = art;
 
     function switchUrl(url, name, currentTime) {
         return new Promise((resolve) => {
-            if (url === player.url) return resolve(url);
-            URL.revokeObjectURL(player.url);
-            player.url = url;
+            if (url === art.url) return resolve(url);
+            URL.revokeObjectURL(art.url);
+            art.url = url;
             art.once('video:canplay', () => {
-                player.playbackRate = false;
-                player.aspectRatio = false;
-                player.flip = 'normal';
-                player.autoSize = option.autoSize;
-                player.currentTime = currentTime;
+                art.playbackRate = false;
+                art.aspectRatio = false;
+                art.flip = 'normal';
+                art.autoSize = option.autoSize;
+                art.currentTime = currentTime;
                 art.notice.show = '';
-                if (player.playing) {
-                    player.play();
+                if (art.playing) {
+                    art.play();
                 }
                 if (name) {
                     notice.show = `${i18n.get('Switch video')}: ${name}`;
@@ -27,13 +27,13 @@ export default function switchMix(art, player) {
         });
     }
 
-    def(player, 'switchQuality', {
+    def(art, 'switchQuality', {
         value: (url, name) => {
-            return switchUrl(url, name, player.currentTime);
+            return switchUrl(url, name, art.currentTime);
         },
     });
 
-    def(player, 'switchUrl', {
+    def(art, 'switchUrl', {
         value: (url, name) => {
             return switchUrl(url, name, 0);
         },

packages/artplayer/src/player/toggleMix.js

@@ -1,12 +1,12 @@
 import { def } from '../utils';
 
-export default function toggleMix(art, player) {
-    def(player, 'toggle', {
+export default function toggleMix(art) {
+    def(art, 'toggle', {
         value() {
-            if (player.playing) {
-                return player.pause();
+            if (art.playing) {
+                return art.pause();
             } else {
-                return player.play();
+                return art.play();
             }
         },
     });

packages/artplayer/src/player/urlMix.js

@@ -1,12 +1,12 @@
 import { getExt, def, sleep } from '../utils';
 
-export default function urlMix(art, player) {
+export default function urlMix(art) {
     const {
         option,
         template: { $video },
     } = art;
 
-    def(player, 'url', {
+    def(art, 'url', {
         get() {
             return $video.currentSrc;
         },
@@ -19,7 +19,7 @@ export default function urlMix(art, player) {
                     typeCallback.call(art, $video, url, art);
                 });
             } else {
-                if (player.url && player.url !== url) {
+                if (art.url && art.url !== url) {
                     art.once('video:canplay', () => {
                         if (art.isReady) {
                             art.emit('restart');

packages/artplayer/src/player/volumeMix.js

@@ -1,6 +1,6 @@
 import { clamp, def } from '../utils';
 
-export default function volumeMix(art, player) {
+export default function volumeMix(art) {
     const {
         template: { $video },
         i18n,
@@ -8,9 +8,9 @@ export default function volumeMix(art, player) {
         storage,
     } = art;
 
-    def(player, 'volume', {
+    def(art, 'volume', {
         get: () => $video.volume || 0,
-        set: percentage => {
+        set: (percentage) => {
             $video.volume = clamp(percentage, 0, 1);
             notice.show = `${i18n.get('Volume')}: ${parseInt($video.volume * 100, 10)}`;
             if ($video.volume !== 0) {
@@ -20,9 +20,9 @@ export default function volumeMix(art, player) {
         },
     });
 
-    def(player, 'muted', {
+    def(art, 'muted', {
         get: () => $video.muted,
-        set: muted => {
+        set: (muted) => {
             $video.muted = muted;
             art.emit('volume', $video.volume);
         },