min -> mini

packages/artplayer/src/events/viewInit.js

@@ -3,7 +3,7 @@ import { debounce, isInViewport } from '../utils';
 export default function viewInit(art, events) {
     const {
         player,
-        option: { autoMin },
+        option: { autoMini },
         template: { $container },
     } = art;
 
@@ -16,8 +16,8 @@ export default function viewInit(art, events) {
     });
 
     art.on('view', (state) => {
-        if (autoMin) {
-            player.min = !state;
+        if (autoMini) {
+            player.mini = !state;
         }
     });
 }

packages/artplayer/src/player/exclusiveInit.js

@@ -1,7 +1,7 @@
 import { def } from '../utils';
 
 export default function exclusiveInit(art, player) {
-    const props = ['min', 'pip', 'fullscreen', 'fullscreenWeb', 'fullscreenRotate'];
+    const props = ['mini', 'pip', 'fullscreen', 'fullscreenWeb', 'fullscreenRotate'];
 
     props.forEach((name) => {
         art.on(name, (state) => {

packages/artplayer/src/player/index.js

@@ -24,7 +24,7 @@ import autoSizeMix from './autoSizeMix';
 import rectMix from './rectMix';
 import flipMix from './flipMix';
 import lightMix from './lightMix';
-import minMix from './minMix';
+import miniMix from './miniMix';
 import loopMin from './loopMin';
 import { proxyPropertys } from '../utils';
 
@@ -56,7 +56,7 @@ export default class Player {
         rectMix(art, this);
         flipMix(art, this);
         lightMix(art, this);
-        minMix(art, this);
+        miniMix(art, this);
         loopMin(art, this);
         proxyPropertys(art, this);
     }

packages/artplayer/src/player/miniMix.js

@@ -1,12 +1,12 @@
 import { append, setStyle, addClass, removeClass, hasClass, def, isInViewport } from '../utils';
 
-export default function minMix(art, player) {
+export default function miniMix(art, player) {
     const {
         i18n,
         option,
         storage,
         events: { proxy },
-        template: { $player, $minClose, $minTitle, $minHeader },
+        template: { $player, $miniClose, $miniTitle, $miniHeader },
     } = art;
 
     let cacheStyle = '';
@@ -16,7 +16,7 @@ export default function minMix(art, player) {
     let lastPlayerLeft = 0;
     let lastPlayerTop = 0;
 
-    proxy($minHeader, 'mousedown', (event) => {
+    proxy($miniHeader, 'mousedown', (event) => {
         isDroging = true;
         lastPageX = event.pageX;
         lastPageY = event.pageY;
@@ -41,32 +41,32 @@ export default function minMix(art, player) {
         removeClass($player, 'art-is-dragging');
     });
 
-    proxy($minClose, 'click', () => {
-        player.min = false;
+    proxy($miniClose, 'click', () => {
+        player.mini = false;
         isDroging = false;
         removeClass($player, 'art-is-dragging');
     });
 
-    append($minTitle, option.title || i18n.get('Mini player'));
+    append($miniTitle, option.title || i18n.get('Mini player'));
 
-    def(player, 'min', {
+    def(player, 'mini', {
         get() {
-            return hasClass($player, 'art-min');
+            return hasClass($player, 'art-mini');
         },
         set(value) {
             if (value) {
                 player.autoSize = false;
                 cacheStyle = $player.style.cssText;
-                addClass($player, 'art-min');
+                addClass($player, 'art-mini');
                 const top = storage.get('top');
                 const left = storage.get('left');
                 if (top && left) {
                     setStyle($player, 'top', `${top}px`);
                     setStyle($player, 'left', `${left}px`);
-                    if (!isInViewport($minHeader)) {
+                    if (!isInViewport($miniHeader)) {
                         storage.del('top');
                         storage.del('left');
-                        player.min = true;
+                        player.mini = true;
                     }
                 } else {
                     const $body = document.body;
@@ -79,24 +79,24 @@ export default function minMix(art, player) {
                 }
                 player.aspectRatio = false;
                 player.playbackRate = false;
-                art.emit('min', true);
+                art.emit('mini', true);
             } else {
                 $player.style.cssText = cacheStyle;
-                removeClass($player, 'art-min');
+                removeClass($player, 'art-mini');
                 setStyle($player, 'top', null);
                 setStyle($player, 'left', null);
                 player.aspectRatio = false;
                 player.playbackRate = false;
                 player.autoSize = option.autoSize;
-                art.emit('min');
+                art.emit('mini');
             }
         },
     });
 
-    def(player, 'minToggle', {
+    def(player, 'miniToggle', {
         set(value) {
             if (value) {
-                player.min = !player.min;
+                player.mini = !player.mini;
             }
         },
     });

packages/artplayer/src/style/index.scss

@@ -14,7 +14,7 @@
 @import './aspectRatio.scss';
 @import './fullscreenWeb.scss';
 @import './fullscreenRotate.scss';
-@import './min.scss';
+@import './mini.scss';
 @import './autoSize.scss';
 @import './flip.scss';
 @import './balloon.scss';

packages/artplayer/src/style/mini.scss

@@ -1,5 +1,5 @@
 .art-video-player {
-    .art-min-header {
+    .art-mini-header {
         display: none;
         position: absolute;
         z-index: 110;
@@ -15,7 +15,7 @@
         opacity: 0;
         visibility: hidden;
         transition: all 0.2s ease-in-out;
-        .art-min-title {
+        .art-mini-title {
             flex: 1;
             padding: 0 10px;
             overflow: hidden;
@@ -23,7 +23,7 @@
             white-space: nowrap;
             cursor: move;
         }
-        .art-min-close {
+        .art-mini-close {
             width: 35px;
             text-align: center;
             font-size: 22px;
@@ -35,20 +35,20 @@
         opacity: 0.7;
     }
 
-    &.art-min {
+    &.art-mini {
         position: fixed;
         z-index: 9999;
         width: 400px;
         height: 225px;
         box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.2);
 
-        .art-min-header {
+        .art-mini-header {
             display: flex;
             user-select: none;
         }
 
         &.art-hover {
-            .art-min-header {
+            .art-mini-header {
                 opacity: 1;
                 visibility: visible;
             }

packages/artplayer/src/template.js

@@ -91,9 +91,9 @@ export default class Template {
               </div>
               <div class="art-info-close">[x]</div>
             </div>
-            <div class="art-min-header">
-              <div class="art-min-title"></div>
-              <div class="art-min-close">×</div>
+            <div class="art-mini-header">
+              <div class="art-mini-title"></div>
+              <div class="art-mini-close">×</div>
             </div>
             <div class="art-contextmenus"></div>
           </div>
@@ -121,9 +121,9 @@ export default class Template {
         this.$info = this.query('.art-info');
         this.$infoPanel = this.query('.art-info-panel');
         this.$infoClose = this.query('.art-info-close');
-        this.$minHeader = this.query('.art-min-header');
-        this.$minTitle = this.query('.art-min-title');
-        this.$minClose = this.query('.art-min-close');
+        this.$miniHeader = this.query('.art-mini-header');
+        this.$miniTitle = this.query('.art-mini-title');
+        this.$miniClose = this.query('.art-mini-close');
         this.$contextmenu = this.query('.art-contextmenus');
 
         if (backdrop) {