easy-player-pro 0.1.10 → 0.1.12

package/lib/core/easy-player-pro.js

@@ -120,6 +120,7 @@ export class EasyPlayerPro {
             }
         });
         this.container = container;
+        //@ts-ignore
         this.player = new window.EasyPlayerPro(this.container, this.config);
         this.videoElement = this.player.$container.querySelector('video');
         this.isDestroy = false;
@@ -350,6 +351,45 @@ export class EasyPlayerPro {
     setQuality(quality) {
         this.player && this.player.setQuality(quality);
     }
+    /**
+     *  设置分辨率列表
+     * @param qualityList
+     * @param quality
+     */
+    setQualityList(qualityList, quality) {
+        const _quality = quality || qualityList[0];
+        const easyPlayerQualityMenu = this.player.$container.querySelector('.easyplayer-quality-menu');
+        if (easyPlayerQualityMenu) {
+            const easyPlayerQualityIconText = easyPlayerQualityMenu.querySelector('.easyplayer-quality-icon-text');
+            const easyPlayerQualityMenuList = easyPlayerQualityMenu.querySelector('.easyplayer-quality-menu-list');
+            if (qualityList.length > 0) {
+                if (easyPlayerQualityIconText) {
+                    easyPlayerQualityIconText.innerText = _quality;
+                    this.setQuality(_quality);
+                }
+                if (easyPlayerQualityMenuList) {
+                    easyPlayerQualityMenuList.innerHTML = '';
+                    easyPlayerQualityMenuList.append(...qualityList.map(c => {
+                        const item = document.createElement('div');
+                        item.innerText = c;
+                        item.setAttribute('data-quality', c);
+                        item.classList.add('easyplayer-quality-menu-item');
+                        if (c === _quality) {
+                            item.classList.add('easyplayer-quality-menu-item-active');
+                        }
+                        item.addEventListener('click', (event) => {
+                            easyPlayerQualityMenuList.querySelectorAll('.easyplayer-quality-menu-item').forEach((c) => {
+                                c.classList.remove('easyplayer-quality-menu-item-active');
+                            });
+                            //@ts-ignore
+                            event.currentTarget && event.currentTarget.classList.add('easyplayer-quality-menu-item-active');
+                        });
+                        return item;
+                    }));
+                }
+            }
+        }
+    }
     /**
      * 设置录像倍数
      * @param rate
@@ -412,6 +452,7 @@ export class EasyPlayerPro {
     }
     close() {
         this.destroy();
+        //@ts-ignore
         this.player = new window.EasyPlayerPro(this.container, this.config);
     }
 }

package/lib/types/core/easy-player-pro.d.ts

@@ -159,6 +159,12 @@ export declare class EasyPlayerPro {
      * @param quality
      */
     setQuality(quality: string): void;
+    /**
+     *  设置分辨率列表
+     * @param qualityList
+     * @param quality
+     */
+    setQualityList(qualityList: string[], quality?: string): void;
     /**
      * 设置录像倍数
      * @param rate
@@ -223,6 +229,7 @@ export interface EasyPlayerProType {
     setFullscreen: (isFullscreen: boolean) => void;
     exitFullscreen: () => void;
     setQuality: (quality: string) => void;
+    setQualityList: (qualityList: string[], quality?: string) => void;
     setRate: (rate: number) => void;
     seekTime: (time: number) => void;
     getVideoInfo: () => VideoInfoType | null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easy-player-pro",
-  "version": "0.1.10",
+  "version": "0.1.12",
   "description": "easy-player-pro 是一款能够同时支持HTTP、HTTP-FLV、HLS（m3u8）、WS、WEBRTC、FMP4视频直播与视频点播等多种协议，支持H.264、H.265、AAC、G711A、Mp3等多种音视频编码格式，支持MSE、WASM、WebCodec等多种解码方式，支持Windows、Linux、Android、iOS全平台终端的H5播放器，使用简单, 功能强大",
   "type": "module",
   "module": "./lib/index.js",