add event proxy

src/events.js

@@ -1,5 +1,14 @@
 export default class Events {
   constructor(art) {
     this.art = art;
+    this.destroys = [];
+    this.proxy = this.proxy.bind(this);
+  }
+
+  proxy(target, name, callback) {
+    target.addEventListener(name, callback);
+    this.destroys.push(() => {
+      target.removeEventListener(name, callback);
+    });
   }
 }

src/index.js

@@ -65,10 +65,9 @@ class Artplayer extends Emitter {
       $container: this.option.container
     };
 
-    this.destroyEvents = [];
-
     this.template = new Template(this);
     this.i18n = new I18n(this);
+    this.events = new Events(this);
     this.player = new Player(this);
     this.mse = new Mse(this);
     this.controls = new Controls(this);
@@ -76,7 +75,6 @@ class Artplayer extends Emitter {
     this.danmaku = new Danmaku(this);
     this.subtitle = new Subtitle(this);
     this.info = new Info(this);
-    this.events = new Events(this);
     this.hotkey = new Hotkey(this);
     this.layers = new Layers(this);
 
@@ -85,8 +83,8 @@ class Artplayer extends Emitter {
   }
 
   destroy() {
-    this.destroyEvents.forEach(event => event());
-    this.refs.container.innerHTML = '';
+    this.events.destroys.forEach(destroy => destroy());
+    this.refs.$container.innerHTML = '';
     instances.splice(instances.indexOf(this), 1);
   }
 }

src/mse.js

@@ -51,45 +51,34 @@ export default class Mse {
     );
     this.mediaSource = new MediaSource();
     $video.src = URL.createObjectURL(this.mediaSource);
-    this.art.destroyEvents.push(() => {
+    this.art.events.destroys.push(() => {
       URL.revokeObjectURL($video.src);
     });
   }
 
   eventBind() {
+    const { proxy } = this.art.events;
     const { instance, sourceBufferList } = mseConfig;
 
     instance.events.forEach(eventName => {
-      this.mediaSource.addEventListener(eventName, this.mediaSourceEventFn);
-      this.art.destroyEvents.push(() => {
-        this.mediaSource.removeEventListener(eventName, this.mediaSourceEventFn);
-      });
+      proxy(this.mediaSource, eventName, this.mediaSourceEventFn);
     });
 
     sourceBufferList.events.forEach(eventName => {
-      this.mediaSource.sourceBuffers.addEventListener(eventName, this.sourceBuffersEventFn);
-      this.art.destroyEvents.push(() => {
-        this.mediaSource.sourceBuffers.removeEventListener(eventName, this.sourceBuffersEventFn);
-      });
-
-      this.mediaSource.activeSourceBuffers.addEventListener(eventName, this.activeSourceBuffersEventFn);
-      this.art.destroyEvents.push(() => {
-        this.mediaSource.activeSourceBuffers.removeEventListener(eventName, this.activeSourceBuffersEventFn);
-      });
+      proxy(this.mediaSource.sourceBuffers, eventName, this.sourceBuffersEventFn);
+      proxy(this.mediaSource.activeSourceBuffers, eventName, this.activeSourceBuffersEventFn);
     });
   }
 
   eventStart() {
     const { option } = this.art;
+    const { proxy } = this.art.events;
     const { sourceBuffer } = mseConfig;
 
     this.art.on('mediaSource:sourceopen', () => {
       this.sourceBuffer = this.mediaSource.addSourceBuffer(option.mimeCodec);
       sourceBuffer.events.forEach(eventName => {
-        this.sourceBuffer.addEventListener(eventName, this.sourceBufferEventFn);
-        this.art.destroyEvents.push(() => {
-          this.sourceBuffer.removeEventListener(eventName, this.sourceBufferEventFn);
-        });
+        proxy(this.sourceBuffer, eventName, this.sourceBufferEventFn);
       });
     });
 

src/player.js

@@ -20,15 +20,12 @@ export default class Player {
   }
 
   eventBind() {
+    const { proxy } = this.art.events;
     const { $video } = this.art.refs;
     const { events } = mediaElement;
-    for (let index = 0; index < events.length; index++) {
-      const eventName = events[index];
-      $video.addEventListener(eventName, this.eventFn);
-      this.art.destroyEvents.push(() => {
-        $video.removeEventListener(eventName, this.eventFn);
-      });
-    }
+    events.forEach(eventName => {
+      proxy($video, eventName, this.eventFn);
+    });
   }
 
   eventFn(event) {

src/utils/index.js

@@ -16,4 +16,4 @@ export function request(url) {
     .catch(err => {
       throw new ArtPlayerError(err.message);
     });
-}
+}