添加Demo自适应

packages/artplayer/src/controls/index.js

@@ -1,4 +1,4 @@
-import { insertByIndex } from '../utils';
+import { insertByIndex, setStyle } from '../utils';
 import Fullscreen from './fullscreen';
 import FullscreenWeb from './fullscreenWeb';
 import Pip from './pip';
@@ -120,6 +120,7 @@ export default class Controls {
       const $control = document.createElement('div');
       $control.classList.value = `art-control art-control-${name}`;
       this.mount(option.position, $control, option.index || id);
+      this.commonMethod(control, $control);
       control.apply && control.apply(this.art, $control);
       callback && callback($control);
       this[name] = control;
@@ -143,6 +144,22 @@ export default class Controls {
     }
   }
 
+  commonMethod(control, $control) {
+    Object.defineProperty(control, 'hide', {
+      value: () => {
+        setStyle($control, 'display', 'none');
+        this.art.emit('control:hide', $control);
+      }
+    });
+
+    Object.defineProperty(control, 'show', {
+      value: () => {
+        setStyle($control, 'display', 'block');
+        this.art.emit('control:show', $control);
+      }
+    });
+  }
+
   show() {
     const { $player } = this.art.refs;
     $player.classList.add('artplayer-controls-show');

packages/artplayer/src/events/resizeInit.js

@@ -17,7 +17,7 @@ export default function resizeInit(art, events) {
         }
       }
       art.player.aspectRatioReset();
-      art.emit('resize');
+      art.emit('resize', $player);
     });
   });
   resizeObserver.observe($player);

packages/artplayer/src/index.js

@@ -25,11 +25,9 @@ let id = 0;
 class Artplayer extends Emitter {
   constructor(option) {
     super();
-    this.emit('init:start');
     this.option = utils.deepMerge({}, Artplayer.DEFAULTS, option);
     optionValidator(this.option, scheme);
     this.init();
-    this.emit('init:end');
   }
 
   static get version() {

packages/artplayer/src/style/bottom.scss

@@ -128,9 +128,12 @@
             justify-content: space-between;
             height: 36px;
     
+            .artplayer-controls-left, .artplayer-controls-right {
+                display: flex;
+            }
+
             .art-control {
                 opacity: .9;
-                float: left;
                 font-size: 12px;
                 height: 36px;
                 line-height: 36px;