简化事件

packages/artplayer/src/player/aspectRatioMix.js

@@ -42,13 +42,13 @@ export default function aspectRatioMix(art, player) {
 
                 $player.dataset.aspectRatio = ratio;
                 notice.show = `${i18n.get('Aspect ratio')}: ${ratio === 'default' ? i18n.get('Default') : ratio}`;
-                art.emit('aspectRatioChange', ratio);
+                art.emit('aspectRatio', ratio);
             } else if (player.aspectRatio) {
                 setStyle($video, 'width', null);
                 setStyle($video, 'height', null);
                 setStyle($video, 'padding', null);
                 delete $player.dataset.aspectRatio;
-                art.emit('aspectRatioRemove');
+                art.emit('aspectRatio');
             }
         },
     });
@@ -58,7 +58,6 @@ export default function aspectRatioMix(art, player) {
             if (value && player.aspectRatio) {
                 const { aspectRatio } = player;
                 player.aspectRatio = aspectRatio;
-                art.emit('aspectRatioReset');
             }
         },
     });

packages/artplayer/src/player/autoSizeMix.js

@@ -23,7 +23,7 @@ export default function resizeMix(art, player) {
                     setStyle($player, 'width', '100%');
                     setStyle($player, 'height', `${percentage}%`);
                 }
-                art.emit('autoSizeChange', {
+                art.emit('autoSize', {
                     width: player.width,
                     height: player.height,
                 });
@@ -31,7 +31,7 @@ export default function resizeMix(art, player) {
                 removeClass($container, 'art-auto-size');
                 setStyle($player, 'width', null);
                 setStyle($player, 'height', null);
-                art.emit('autoSizeRemove');
+                art.emit('autoSize');
             }
         },
     });

packages/artplayer/src/player/exclusiveInit.js

@@ -4,8 +4,7 @@ export default function exclusiveInit(art, player) {
     const props = ['min', 'pip', 'fullscreen', 'fullscreenWeb', 'fullscreenRotate'];
 
     props.forEach((name) => {
-        const event = `${name}Change`;
-        art.on(event, (state) => {
+        art.on(name, (state) => {
             if (state) {
                 props
                     .filter((item) => item !== name)

packages/artplayer/src/player/flipMix.js

@@ -11,10 +11,10 @@ export default function flipMix(art, player) {
                 const flipList = ['normal', 'horizontal', 'vertical'];
                 errorHandle(flipList.includes(flip), `'flip' only accept ${flipList.toString()} as parameters`);
                 $player.dataset.flip = flip;
-                art.emit('flipChange', flip);
+                art.emit('flip', flip);
             } else {
                 delete $player.dataset.flip;
-                art.emit('flipRemove');
+                art.emit('flip');
             }
         },
     });

packages/artplayer/src/player/fullscreenMix.js

@@ -14,7 +14,7 @@ export default function fullscreenMix(art, player) {
                     addClass($player, 'art-fullscreen');
                     player.aspectRatioReset = true;
                     art.emit('resize');
-                    art.emit('fullscreenChange', true);
+                    art.emit('fullscreen', true);
                 });
             } else {
                 screenfull.exit().then(() => {
@@ -22,7 +22,7 @@ export default function fullscreenMix(art, player) {
                     player.aspectRatioReset = true;
                     player.autoSize = art.option.autoSize;
                     art.emit('resize');
-                    art.emit('fullscreenChange', false);
+                    art.emit('fullscreen');
                 });
             }
         },

packages/artplayer/src/player/fullscreenRotateMix.js

@@ -20,14 +20,14 @@ export default function fullscreenRotateMix(art, player) {
                     const scale = Math.min(bodyHeight / playerWidth, bodyWidth / playerHeight).toFixed(2);
                     setStyle($player, 'transform', `rotate(90deg) scale(${scale},${scale})`);
                     art.emit('resize');
-                    art.emit('fullscreenRotateChange', true);
+                    art.emit('fullscreenRotate', true);
                 }
             } else {
                 removeClass($container, 'art-fullscreen-rotate');
                 player.autoSize = art.option.autoSize;
                 setStyle($player, 'transform', null);
                 art.emit('resize');
-                art.emit('fullscreenRotateChange', false);
+                art.emit('fullscreenRotate');
             }
         },
     });

packages/artplayer/src/player/fullscreenWebMix.js

@@ -12,13 +12,13 @@ export default function fullscreenWebMix(art, player) {
                 addClass($player, 'art-fullscreen-web');
                 player.aspectRatioReset = true;
                 art.emit('resize');
-                art.emit('fullscreenWebChange', true);
+                art.emit('fullscreenWeb', true);
             } else {
                 removeClass($player, 'art-fullscreen-web');
                 player.aspectRatioReset = true;
                 player.autoSize = art.option.autoSize;
                 art.emit('resize');
-                art.emit('fullscreenWebChange', false);
+                art.emit('fullscreenWeb');
             }
         },
     });

packages/artplayer/src/player/loopMin.js

@@ -10,14 +10,14 @@ export default function loopMin(art, player) {
                 const end = clamp(value[1], start, player.duration);
                 if (end - start >= 1) {
                     interval = [start, end];
-                    art.emit('loopAdd', interval);
+                    art.emit('loop', interval);
                 } else {
                     interval = [];
-                    art.emit('loopRemove');
+                    art.emit('loop');
                 }
             } else {
                 interval = [];
-                art.emit('loopRemove');
+                art.emit('loop');
             }
         },
     });
@@ -26,7 +26,6 @@ export default function loopMin(art, player) {
         if (interval.length) {
             if (player.currentTime < interval[0] || player.currentTime > interval[1]) {
                 player.seek = interval[0];
-                art.emit('loopStart', interval);
             }
         }
     });

packages/artplayer/src/player/minMix.js

@@ -79,7 +79,7 @@ export default function minMix(art, player) {
                 }
                 player.aspectRatio = false;
                 player.playbackRate = false;
-                art.emit('minChange', true);
+                art.emit('min', true);
             } else {
                 $player.style.cssText = cacheStyle;
                 removeClass($player, 'art-min');
@@ -88,7 +88,7 @@ export default function minMix(art, player) {
                 player.aspectRatio = false;
                 player.playbackRate = false;
                 player.autoSize = option.autoSize;
-                art.emit('minChange', false);
+                art.emit('min');
             }
         },
     });

packages/artplayer/src/player/pipMix.js

@@ -29,11 +29,11 @@ function nativePip(art, player) {
     });
 
     proxy($video, 'enterpictureinpicture', () => {
-        art.emit('pipChange', true);
+        art.emit('pip', true);
     });
 
     proxy($video, 'leavepictureinpicture', () => {
-        art.emit('pipChange', false);
+        art.emit('pip');
     });
 }
 
@@ -49,10 +49,10 @@ function webkitPip(art, player) {
         set(value) {
             if (value) {
                 $video.webkitSetPresentationMode('picture-in-picture');
-                art.emit('pipChange', true);
+                art.emit('pip', true);
             } else {
                 $video.webkitSetPresentationMode('inline');
-                art.emit('pipChange', false);
+                art.emit('pip');
             }
         },
     });

packages/artplayer/src/player/playbackRateMix.js

@@ -19,11 +19,11 @@ export default function playbackRateMix(art, player) {
                 $video.playbackRate = rate;
                 $player.dataset.playbackRate = rate;
                 notice.show = `${i18n.get('Rate')}: ${rate === 1.0 ? i18n.get('Normal') : `${rate}x`}`;
-                art.emit('playbackRateChange', rate);
+                art.emit('playbackRate', rate);
             } else if (player.playbackRate) {
                 player.playbackRate = 1;
                 delete $player.dataset.playbackRate;
-                art.emit('playbackRateRemove');
+                art.emit('playbackRate');
             }
         },
     });
@@ -34,7 +34,6 @@ export default function playbackRateMix(art, player) {
                 const { playbackRate } = $player.dataset;
                 if (playbackRate) {
                     player.playbackRate = Number(playbackRate);
-                    art.emit('playbackRateReset');
                 }
             }
         },

packages/artplayer/src/player/screenshotMix.js

@@ -1,4 +1,4 @@
-import { secondToTime, downloadFile, def } from '../utils';
+import { secondToTime, download, def } from '../utils';
 
 export default function screenshotMix(art, player) {
     const {
@@ -7,30 +7,31 @@ export default function screenshotMix(art, player) {
         template: { $video },
     } = art;
 
-    def(player, 'getScreenshotDataURL', {
-        value: () => {
-            try {
-                const canvas = document.createElement('canvas');
-                canvas.width = $video.videoWidth;
-                canvas.height = $video.videoHeight;
-                canvas.getContext('2d').drawImage($video, 0, 0);
-                return canvas.toDataURL('image/png');
-            } catch (err) {
-                notice.show = err;
-                throw err;
-            }
-        },
-    });
+    const $canvas = document.createElement('canvas');
 
-    def(player, 'getScreenshotBlobUrl', {
+    def(player, 'getDataURL', {
         value: () =>
             new Promise((resolve, reject) => {
                 try {
-                    const canvas = document.createElement('canvas');
-                    canvas.width = $video.videoWidth;
-                    canvas.height = $video.videoHeight;
-                    canvas.getContext('2d').drawImage($video, 0, 0);
-                    canvas.toBlob(blob => {
+                    $canvas.width = $video.videoWidth;
+                    $canvas.height = $video.videoHeight;
+                    $canvas.getContext('2d').drawImage($video, 0, 0);
+                    resolve($canvas.toDataURL('image/png'));
+                } catch (err) {
+                    notice.show = err;
+                    reject(err);
+                }
+            }),
+    });
+
+    def(player, 'getBlobUrl', {
+        value: () =>
+            new Promise((resolve, reject) => {
+                try {
+                    $canvas.width = $video.videoWidth;
+                    $canvas.height = $video.videoHeight;
+                    $canvas.getContext('2d').drawImage($video, 0, 0);
+                    $canvas.toBlob((blob) => {
                         resolve(URL.createObjectURL(blob));
                     });
                 } catch (err) {
@@ -42,11 +43,10 @@ export default function screenshotMix(art, player) {
 
     def(player, 'screenshot', {
         value: () => {
-            const dataUri = player.getScreenshotDataURL();
-            if (dataUri) {
-                downloadFile(dataUri, `${option.title || 'artplayer'}_${secondToTime($video.currentTime)}.png`);
+            player.getDataURL().then((dataUri) => {
+                download(dataUri, `${option.title || 'artplayer'}_${secondToTime($video.currentTime)}.png`);
                 art.emit('screenshot', dataUri);
-            }
+            });
         },
     });
 }

packages/artplayer/src/player/urlMix.js

@@ -17,12 +17,11 @@ export default function urlMix(art, player) {
                 sleep().then(() => {
                     art.loading.show = true;
                     typeCallback.call(art, $video, url, art);
-                    art.emit('customType', typeName);
                 });
             } else {
                 $video.src = url;
                 art.option.url = url;
-                art.emit('urlChange', url);
+                art.emit('url', url);
             }
         },
     });