lyb-pixi-js 1.1.19 → 1.2.1

package/README.md

@@ -652,12 +652,24 @@ stopInterval();
 > 点击容器外或入口按钮时隐藏
 
 ```ts
-const stopOutsideClick = libPixiOutsideClick(container, button, () => {
-  console.log("Container closed");
-});
 
-//停止监听点击事件
-stopOutsideClick();
+let removeEventListener: () => void;
+const btn = new Sprite(Assets.get("btnIcon"));
+const optionList = new Container();
+libPixiEvent(btn, "pointertap", () => {
+  optionList.visible = !optionList.visible;
+
+  //列表显示后开始监听是否点击容器外
+  if (optionList.visible) {
+    removeEventListener = libPixiOutsideClick(optionList, btn, () => {
+      optionList.visible = false;
+    });
+  }
+  //如果通过再次点击按钮关闭了列表，则移除监听器
+  else {
+    removeEventListener();
+  }
+});
 ```
 
 ### LibPixiOverflowHidden-溢出裁剪

package/Utils/LibPixiAudio.d.ts

@@ -1,7 +1,4 @@
 import "@pixi/sound";
-/** @description 音频播放器
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiAudio-音频播放器
- */
 export declare class LibPixiAudio {
     /** 是否启用音效 */
     effectEnabled: boolean;
@@ -12,7 +9,7 @@ export declare class LibPixiAudio {
     /** 是否已切换后台 */
     private _isBackground;
     /** 当前音乐播放器 */
-    private _musicPlayer;
+    private _musicPlayer?;
     /** 当前正在播放的音效列表 */
     private _playingList;
     constructor();

package/Utils/LibPixiAudio.js

@@ -7,12 +7,9 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import gsap from "gsap";
 import { Assets } from "pixi.js";
+import { Howl } from "howler";
 import "@pixi/sound";
-/** @description 音频播放器
- * @link 使用方法：https://www.npmjs.com/package/lyb-pixi-js#LibPixiAudio-音频播放器
- */
 export class LibPixiAudio {
     constructor() {
         /** 是否启用音效 */
@@ -45,7 +42,6 @@ export class LibPixiAudio {
                 }
             });
         };
-        this._musicPlayer = new Audio();
         document.addEventListener("visibilitychange", () => {
             this._isBackground = document.hidden;
             this._setPlayStatus(!document.hidden);
@@ -59,28 +55,26 @@ export class LibPixiAudio {
         return new Promise((resolve) => {
             const id = new Date().getTime();
             const url = Assets.get(key).url;
-            const audio = new Audio(url);
-            audio.muted = this._isBackground || !this.effectEnabled;
-            audio.addEventListener("ended", () => {
+            const sound = new Howl({
+                src: url,
+                mute: this._isBackground || !this.effectEnabled,
+            });
+            sound.play();
+            sound.on("end", () => {
                 this._playingList = this._playingList.filter((item) => item.id !== id);
                 resolve();
             });
-            audio
-                .play()
-                .then(() => {
-                //倒数几秒位置播放
-                if (end) {
-                    const duration = audio.duration;
-                    const start = duration - end;
-                    audio.currentTime = Math.max(start, 0);
-                }
-                this._playingList.push({
-                    id,
-                    audio,
-                    url,
-                });
-            })
-                .catch(() => { });
+            //倒数几秒位置播放
+            if (end) {
+                const duration = sound.duration();
+                const start = duration - end;
+                sound.seek(start);
+            }
+            this._playingList.push({
+                id,
+                audio: sound,
+                url,
+            });
         });
     }
     /** @description 播放音乐
@@ -88,7 +82,7 @@ export class LibPixiAudio {
      */
     playMusic(key) {
         return __awaiter(this, void 0, void 0, function* () {
-            var _a;
+            const url = Assets.get(key).url;
             //如果有音乐正在播放，则停止
             if (this._musicPlayer) {
                 gsap.killTweensOf(this._musicPlayer);
@@ -97,29 +91,23 @@ export class LibPixiAudio {
                     duration: 1,
                     ease: "linear",
                 });
-                (_a = this._musicPlayer) === null || _a === void 0 ? void 0 : _a.pause();
+                this._musicPlayer.stop();
             }
-            const url = Assets.get(key).url;
-            this._musicPlayer.src = url;
-            this._musicPlayer.loop = true;
-            this._musicPlayer.volume = 0;
-            const play = () => {
-                this._musicPlayer
-                    .play()
-                    .then(() => {
-                    this._isMusicPaused = false;
-                    gsap.killTweensOf(this._musicPlayer);
-                    gsap.to(this._musicPlayer, {
-                        volume: 1,
-                        duration: 1,
-                        ease: "linear",
-                    });
-                })
-                    .catch(() => {
-                    requestAnimationFrame(play.bind(this));
-                });
-            };
-            play();
+            this._musicPlayer = new Howl({
+                src: url,
+                loop: true,
+                volume: 0,
+                html5: true,
+                mute: this._isBackground || !this.effectEnabled,
+            });
+            this._musicPlayer.play();
+            this._isMusicPaused = false;
+            gsap.killTweensOf(this._musicPlayer);
+            gsap.to(this._musicPlayer, {
+                volume: 1,
+                duration: 1,
+                ease: "linear",
+            });
         });
     }
     /** @description 暂停音乐 */
@@ -164,14 +152,15 @@ export class LibPixiAudio {
      * @param disabled 静音状态，true为静音
      */
     _setMusicMute(disabled) {
-        this._musicPlayer.muted = disabled || !this.musicEnabled;
+        var _a;
+        (_a = this._musicPlayer) === null || _a === void 0 ? void 0 : _a.mute(disabled || !this.musicEnabled);
     }
     /** @description 设置静音音效
      * @param disabled 静音状态，true为静音
      */
     _setEffectMute(disabled) {
         this._playingList.forEach((item) => {
-            item.audio.muted = disabled || !this.effectEnabled;
+            item.audio.mute(disabled || !this.effectEnabled);
         });
     }
 }