修复全屏的回调问题

src/controls/fullscreen.js

@@ -1,47 +1,57 @@
-import { append, tooltip, setStyle } from '../utils';
+import { append, tooltip, setStyle, sleep } from '../utils';
 import icons from '../icons';
 import screenfull from 'screenfull';
 
 export default class Fullscreen {
   constructor(option) {
     this.option = option;
-    this.state = false;
+  }
+
+  get state() {
+    return screenfull.isFullscreen;
   }
 
   apply(art, $control) {
     this.art = art;
-    const { events: { proxy }, i18n, player, refs: { $player } } = art;
+    const { events: { destroyEvents, proxy }, i18n, player, notice, refs: { $player } } = art;
     this.$fullscreen = append($control, icons.fullscreen);
     tooltip(this.$fullscreen, i18n.get('Fullscreen'));
+
     proxy($control, 'click', () => {
-      if (this.state) {
-        screenfull.exit();
-        this.state = false;
-        $player.classList.remove('artplayer-fullscreen');
-        setStyle(this.$fullscreen, 'opacity', '1');
-        tooltip(this.$fullscreen, i18n.get('Fullscreen'));
-      } else {
-        if (screenfull.enabled) {
-          this.state = true;
+      if (screenfull.enabled) {
+        if (screenfull.isFullscreen) {
+          screenfull.exit();
+          $player.classList.remove('artplayer-fullscreen');
+          setStyle(this.$fullscreen, 'opacity', '1');
+          tooltip(this.$fullscreen, i18n.get('Fullscreen'));
+        } else {
           $player.classList.add('artplayer-fullscreen');
           setStyle(this.$fullscreen, 'opacity', '0.8');
           tooltip(this.$fullscreen, i18n.get('Exit fullscreen'));
           screenfull.request($player);
         }
+      } else {
+        notice.show('Your browser does not seem to support full screen functionality.');
       }
+    });
+
+    const screenfullChange = () => {
       player.resetAspectRatio();
-      art.emit('fullscreen', this.state);
+      art.emit('fullscreen', screenfull.isFullscreen);
+    };
+
+    screenfull.on('change', screenfullChange);
+    destroyEvents.push(() => {
+      screenfull.off('change', screenfullChange);
     });
   }
 
   exit() {
     screenfull.exit();
-    this.state = false;
   }
 
   toggle() {
     const { $player } = this.art.refs;
     screenfull.toggle($player);
-    this.state = screenfull.isFullscreen;
   }
 }

src/player/aspectRatioMix.js

@@ -3,7 +3,6 @@ import { setStyle, sublings } from '../utils';
 export default function aspectRatioMix(art, player) {
   Object.defineProperty(player, 'aspectRatio', {
     value: ratio => {
-      console.log(1);
       const { refs: { $video, $player }, i18n, notice } = art;
       const ratioName = ratio.length === 2 ? `${ratio[0]}:${ratio[1]}` : i18n.get('Default');
 

src/utils/index.js

@@ -116,10 +116,9 @@ export function sublings(target) {
   return Array.from(target.parentElement.children).filter(item => item !== target);
 }
 
-export function debounce(func, wait, scope) {
+export function debounce(func, wait, context) {
   let timeout;
   return function fn() {
-    const context = scope || this;
     const args = arguments;
     const later = function later() {
       timeout = null;