@audiowalk/sdk 1.5.2 → 1.5.4

package/dist/helpers/objects.d.ts

@@ -0,0 +1,2 @@
+export type PartialBy<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
+//# sourceMappingURL=objects.d.ts.map

package/dist/helpers/objects.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"objects.d.ts","sourceRoot":"","sources":["../../src/helpers/objects.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC"}

package/dist/helpers/objects.js

@@ -0,0 +1 @@
+export {};

package/dist/player/media-controls.js

@@ -34,7 +34,7 @@ export class MediaControlsController {
             .pipe(takeUntil(this.playerDetachEvent))
             .subscribe(([currentTime, totalTime]) => {
             navigator.mediaSession.setPositionState({
-                duration: Number.isNaN(totalTime) ? 0 : totalTime,
+                duration: totalTime || 0,
                 position: currentTime,
             });
         });

package/dist/player/player-controller.d.ts

@@ -1,12 +1,13 @@
 import { BehaviorSubject, Subject } from "rxjs";
+import { PartialBy } from "../helpers/objects";
 export interface PlayerControllerOptions {
     autoSave?: boolean;
     audioElement?: HTMLAudioElement;
     loop?: boolean;
-    fadeIn?: boolean;
-    fadeOut?: boolean;
-    fadeInterval?: number;
+    crossfade?: boolean;
+    crossfadeTime: number;
 }
+export type PlayerControllerParams = PartialBy<PlayerControllerOptions, "crossfadeTime">;
 export declare enum PlayerStatus {
     "playing" = "playing",
     "paused" = "paused",
@@ -17,8 +18,8 @@ export declare class PlayerController {
     readonly onPause: Subject<void>;
     readonly onStop: Subject<void>;
     readonly currentTime: BehaviorSubject<number>;
-    readonly totalTime: BehaviorSubject<number>;
-    readonly progress: import("rxjs").Observable<number>;
+    readonly totalTime: BehaviorSubject<number | null>;
+    readonly progress: import("rxjs").Observable<number | null>;
     private trackId;
     readonly status: BehaviorSubject<PlayerStatus | null>;
     readonly playing: import("rxjs").Observable<boolean>;
@@ -27,21 +28,23 @@ export declare class PlayerController {
     private options;
     private defaultOptions;
     private destroyEvent;
-    private fadeIntervalSubscription?;
-    private fadePromiseResolve?;
-    constructor(trackId: string, trackUrl: string, options?: PlayerControllerOptions);
+    private volume;
+    private fadeCancelEvent;
+    constructor(trackId: string, trackUrl: string, options?: PlayerControllerParams);
     open(id: string, file: string): Promise<void>;
-    destroy(): Promise<void>;
-    play(options?: {
-        fadeIn?: boolean;
+    destroy(now?: boolean): Promise<void>;
+    play(params?: {
+        fade?: boolean;
     }): Promise<void>;
-    fadeIn(): Promise<void>;
-    fadeOut(): Promise<void>;
-    private clearFade;
-    pause(options?: {
-        fadeIn?: boolean;
+    pause(): Promise<void>;
+    stop(params?: {
+        fade?: boolean;
     }): Promise<void>;
     seekTo(seconds: number): void;
+    setVolume(volume: number, params?: {
+        fade?: boolean;
+    }): void;
+    fadeToVolume(volume: number): Promise<void>;
     back(seconds?: number): void;
     forward(seconds?: number): void;
     private savePosition;

package/dist/player/player-controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"player-controller.d.ts","sourceRoot":"","sources":["../../src/player/player-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAsB,OAAO,EAA8B,MAAM,MAAM,CAAC;AAGhG,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,oBAAY,YAAY;IACtB,SAAS,YAAY;IACrB,QAAQ,WAAW;IACnB,OAAO,UAAU;CAClB;AAED,qBAAa,gBAAgB;IAC3B,SAAgB,MAAM,gBAAuB;IAC7C,SAAgB,OAAO,gBAAuB;IAC9C,SAAgB,MAAM,gBAAuB;IAE7C,SAAgB,WAAW,0BAAkC;IAC7D,SAAgB,SAAS,0BAAkC;IAC3D,SAAgB,QAAQ,oCAEtB;IAEF,OAAO,CAAC,OAAO,CAAuB;IAEtC,SAAgB,MAAM,uCAAkD;IACxE,SAAgB,OAAO,qCAA2D;IAElF,OAAO,CAAC,aAAa,CAAmB;IAExC,OAAO,CAAC,YAAY,CAA0C;IAE9D,OAAO,CAAC,OAAO,CAAoF;IACnG,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,YAAY,CAAuB;IAE3C,OAAO,CAAC,wBAAwB,CAAC,CAAS;IAC1C,OAAO,CAAC,kBAAkB,CAAC,CAAa;gBAE5B,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,GAAE,uBAA4B;IA+D9E,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IAQ7B,OAAO;IAQP,IAAI,CAAC,OAAO,GAAE;QAAE,MAAM,CAAC,EAAE,OAAO,CAAA;KAAO;IASvC,MAAM;IAiBN,OAAO;IAgBb,OAAO,CAAC,SAAS;IAKX,KAAK,CAAC,OAAO,GAAE;QAAE,MAAM,CAAC,EAAE,OAAO,CAAA;KAAO;IAQ9C,MAAM,CAAC,OAAO,EAAE,MAAM;IAOtB,IAAI,CAAC,OAAO,GAAE,MAAW;IAOzB,OAAO,CAAC,OAAO,GAAE,MAAW;YAQd,YAAY;IAK1B,OAAO,CAAC,GAAG;CAOZ"}
+{"version":3,"file":"player-controller.d.ts","sourceRoot":"","sources":["../../src/player/player-controller.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAwC,OAAO,EAAwB,MAAM,MAAM,CAAC;AAC5G,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG/C,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,MAAM,sBAAsB,GAAG,SAAS,CAAC,uBAAuB,EAAE,eAAe,CAAC,CAAC;AAEzF,oBAAY,YAAY;IACtB,SAAS,YAAY;IACrB,QAAQ,WAAW;IACnB,OAAO,UAAU;CAClB;AAED,qBAAa,gBAAgB;IAC3B,SAAgB,MAAM,gBAAuB;IAC7C,SAAgB,OAAO,gBAAuB;IAC9C,SAAgB,MAAM,gBAAuB;IAE7C,SAAgB,WAAW,0BAAkC;IAC7D,SAAgB,SAAS,iCAA4C;IACrE,SAAgB,QAAQ,2CAEtB;IAEF,OAAO,CAAC,OAAO,CAAuB;IAEtC,SAAgB,MAAM,uCAAkD;IACxE,SAAgB,OAAO,qCAA2D;IAElF,OAAO,CAAC,aAAa,CAAmB;IAExC,OAAO,CAAC,YAAY,CAA0C;IAE9D,OAAO,CAAC,OAAO,CAA0B;IAEzC,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,YAAY,CAAuB;IAE3C,OAAO,CAAC,MAAM,CAAa;IAE3B,OAAO,CAAC,eAAe,CAAuB;gBAElC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,GAAE,sBAA2B;IAiE7E,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IAQ7B,OAAO,CAAC,GAAG,GAAE,OAAe;IAa5B,IAAI,CAAC,MAAM,GAAE;QAAE,IAAI,CAAC,EAAE,OAAO,CAAA;KAAqC;IAiBlE,KAAK;IAQL,IAAI,CAAC,MAAM,GAAE;QAAE,IAAI,CAAC,EAAE,OAAO,CAAA;KAAqC;IAexE,MAAM,CAAC,OAAO,EAAE,MAAM;IAQtB,SAAS,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,GAAE;QAAE,IAAI,CAAC,EAAE,OAAO,CAAA;KAAO;IAYnD,YAAY,CAAC,MAAM,EAAE,MAAM;IA4BjC,IAAI,CAAC,OAAO,GAAE,MAAW;IAKzB,OAAO,CAAC,OAAO,GAAE,MAAW;YAMd,YAAY;IAK1B,OAAO,CAAC,GAAG;CAOZ"}

package/dist/player/player-controller.js

@@ -1,4 +1,4 @@
-import { BehaviorSubject, combineLatest, map, Subject, take, takeUntil, takeWhile } from "rxjs";
+import { BehaviorSubject, combineLatest, filter, interval, map, Subject, takeUntil, takeWhile } from "rxjs";
 import { LocalStorage } from "../storage/local-storage";
 export var PlayerStatus;
 (function (PlayerStatus) {
@@ -11,8 +11,8 @@ export class PlayerController {
     onPause = new Subject();
     onStop = new Subject();
     currentTime = new BehaviorSubject(0);
-    totalTime = new BehaviorSubject(0);
-    progress = combineLatest([this.currentTime, this.totalTime]).pipe(map(([currentTime, totalTime]) => currentTime / totalTime));
+    totalTime = new BehaviorSubject(null);
+    progress = combineLatest([this.currentTime, this.totalTime]).pipe(map(([currentTime, totalTime]) => (totalTime ? currentTime / totalTime : null)));
     trackId = null;
     status = new BehaviorSubject(null);
     playing = this.status.pipe(map((status) => status === "playing"));
@@ -20,14 +20,15 @@ export class PlayerController {
     localStorage = new LocalStorage({ prefix: "player" });
     options;
     defaultOptions = {
-        fadeInterval: 2000,
+        crossfadeTime: 2000,
     };
     destroyEvent = new Subject();
-    fadeIntervalSubscription;
-    fadePromiseResolve;
+    volume = 1;
+    fadeCancelEvent = new Subject();
     constructor(trackId, trackUrl, options = {}) {
         this.options = { ...this.defaultOptions, ...options };
         this.playerElement = this.options.audioElement ?? new Audio();
+        this.playerElement.volume = this.volume;
         this.playerElement.addEventListener("play", () => {
             this.onPlay.next();
             this.status.next(PlayerStatus.playing);
@@ -37,8 +38,10 @@ export class PlayerController {
             this.status.next(PlayerStatus.paused);
         });
         this.playerElement.addEventListener("ended", () => {
-            this.onStop.next();
-            this.status.next(PlayerStatus.ended);
+            if (!this.options.crossfade && !this.options.loop) {
+                this.onStop.next();
+                this.status.next(PlayerStatus.ended);
+            }
         });
         this.playerElement.addEventListener("loadedmetadata", (event) => {
             if (this.playerElement.duration) {
@@ -54,13 +57,14 @@ export class PlayerController {
         if (this.options.autoSave) {
             this.currentTime.pipe(takeUntil(this.destroyEvent)).subscribe((currentTime) => this.savePosition(currentTime));
         }
-        if (this.options.fadeOut && !this.options.loop) {
+        if (this.options.crossfade && !this.options.loop) {
             combineLatest([this.currentTime, this.totalTime])
                 .pipe(takeUntil(this.destroyEvent))
-                .pipe(takeWhile(([currentTime, totalTime]) => totalTime - currentTime < this.options.fadeInterval), take(1))
-                .subscribe(async (currentTime) => {
-                this.onStop.next();
-                this.fadeOut();
+                .pipe(filter(([currentTime, totalTime]) => !!totalTime)) // track is loaded
+                .pipe(filter(([currentTime, totalTime]) => currentTime >= totalTime - this.options.crossfadeTime / 1000)) // crossfading should start
+                .subscribe(([currentTime, totalTime]) => {
+                if (this.status.value !== PlayerStatus.ended)
+                    this.stop();
             });
         }
         if (this.options.loop) {
@@ -70,7 +74,7 @@ export class PlayerController {
             });
         }
         this.open(trackId, trackUrl);
-        this.log("Initialized player", this.playerElement);
+        this.log("Initialized player", trackId);
     }
     async open(id, file) {
         this.trackId = id;
@@ -79,74 +83,96 @@ export class PlayerController {
         if (position && this.options.autoSave)
             this.playerElement.currentTime = position;
     }
-    async destroy() {
+    async destroy(now = false) {
+        this.log("Called destroy", now ? "now" : "");
+        if (this.options.crossfade && now !== true) {
+            setTimeout(() => this.destroy(true), this.options.crossfadeTime);
+            return;
+        }
+        this.log("Destroying player");
         this.destroyEvent.next();
-        await this.pause();
         this.playerElement.remove();
     }
-    async play(options = {}) {
+    async play(params = { fade: this.options.crossfade }) {
         if (!this.playerElement.src)
             throw new Error("No file opened");
-        this.log("Called play");
-        await this.playerElement?.play();
-        if (options.fadeIn !== undefined ? options.fadeIn : this.options.fadeIn)
-            await this.fadeIn();
-    }
-    async fadeIn() {
-        this.clearFade();
-        return new Promise((resolve) => {
+        if (this.status.value === PlayerStatus.playing)
+            return;
+        this.log("Called play", params.fade ? "with fade" : "");
+        if (params.fade) {
             this.playerElement.volume = 0;
-            this.fadePromiseResolve = resolve;
-            this.fadeIntervalSubscription = setInterval(() => {
-                if (this.playerElement.volume >= 1) {
-                    clearInterval(this.fadeIntervalSubscription);
-                    return resolve();
-                }
-                this.playerElement.volume = Math.min(this.playerElement.volume + (1 / this.options.fadeInterval) * 100, 1);
-            }, 100);
-        });
-    }
-    async fadeOut() {
-        this.clearFade();
-        return new Promise((resolve) => {
-            this.fadePromiseResolve = resolve;
-            this.fadeIntervalSubscription = setInterval(() => {
-                if (this.playerElement.volume <= 0) {
-                    clearInterval(this.fadeIntervalSubscription);
-                    this.playerElement.pause();
-                    return;
-                }
-                this.playerElement.volume = Math.max(this.playerElement.volume - (1 / this.options.fadeInterval) * 100, 0);
-            }, 100);
-        });
-    }
-    clearFade() {
-        clearInterval(this.fadeIntervalSubscription);
-        this.fadePromiseResolve?.();
+        }
+        await this.playerElement?.play();
+        if (params.fade) {
+            await this.fadeToVolume(this.volume);
+        }
     }
-    async pause(options = {}) {
+    async pause() {
         if (!this.playerElement.src)
             throw new Error("No file opened");
+        if (this.status.value === PlayerStatus.ended)
+            return;
         this.log("Called pause");
         this.playerElement?.pause();
-        if (options.fadeIn !== undefined ? options.fadeIn : this.options.fadeIn)
-            await this.fadeOut();
+    }
+    async stop(params = { fade: this.options.crossfade }) {
+        this.log("Called stop", params.fade ? "with fade" : "");
+        if (this.status.value !== PlayerStatus.ended) {
+            this.onStop.next();
+            this.status.next(PlayerStatus.ended);
+        }
+        if (params.fade) {
+            await this.fadeToVolume(0);
+        }
+        this.playerElement.pause();
     }
     seekTo(seconds) {
         if (!this.playerElement.src)
             throw new Error("No file opened");
+        if (this.status.value === PlayerStatus.ended)
+            return;
         this.log("Called seekTo");
         this.playerElement.currentTime = seconds;
     }
+    setVolume(volume, params = {}) {
+        this.log("Called set volume", volume, params.fade ? "with fade" : "");
+        this.volume = volume;
+        if (params.fade) {
+            this.fadeToVolume(volume);
+        }
+        else {
+            this.playerElement.volume = Math.max(Math.min(volume, 1), 0);
+        }
+    }
+    async fadeToVolume(volume) {
+        return new Promise((resolve, reject) => {
+            this.fadeCancelEvent.next();
+            this.volume = volume;
+            const fadeOutInterval = 100;
+            const fadeOutStep = (this.volume - this.playerElement.volume) / (this.options.crossfadeTime / fadeOutInterval);
+            if (fadeOutStep === 0)
+                return resolve();
+            interval(fadeOutInterval)
+                .pipe(takeUntil(this.fadeCancelEvent))
+                .pipe(takeUntil(this.destroyEvent))
+                .pipe(takeWhile(() => Math.abs(this.playerElement.volume - this.volume) > Math.abs(fadeOutStep)))
+                .subscribe({
+                next: () => {
+                    this.playerElement.volume += fadeOutStep;
+                },
+                error: (error) => reject(error),
+                complete: () => {
+                    this.playerElement.volume = this.volume;
+                    resolve();
+                },
+            });
+        });
+    }
     back(seconds = 10) {
-        if (!this.playerElement.src)
-            throw new Error("No file opened");
         const position = this.playerElement.currentTime;
         this.seekTo(Math.max(position - seconds, 0));
     }
     forward(seconds = 10) {
-        if (!this.playerElement.src)
-            throw new Error("No file opened");
         const position = this.playerElement.currentTime;
         const duration = this.playerElement.duration;
         this.seekTo(duration && duration > 0 ? Math.min(position + seconds, duration) : position + seconds);
@@ -159,7 +185,7 @@ export class PlayerController {
     log(message, ...args) {
         const time = this.playerElement?.currentTime ? Math.round(this.playerElement?.currentTime) : null;
         if (time)
-            message += ` @${time}s`;
+            args.push(`@${time}s`);
         console.log(`[PlayerController] ${message}`, ...args);
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@audiowalk/sdk",
-  "version": "1.5.2",
+  "version": "1.5.4",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/audiowalk-cz/components.git"