A music player that connects to your cloud/distributed storage.
5
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: audio volume

+27 -8
+26 -8
src/components/engine/audio/element.js
··· 20 20 * @implements {Actions} 21 21 */ 22 22 class AudioEngine extends BroadcastableDiffuseElement { 23 + #VOLUME_KEY; 24 + 23 25 constructor() { 24 26 super(); 25 27 ··· 36 38 this.$isPlaying.set = fn("isPlaying", this.$isPlaying.set).replicate; 37 39 } 38 40 39 - // TODO: Get volume from previous session if possible 40 - // const VOLUME_KEY = `@elements/engine/audio/${this.groupId}/volume`; 41 - // const vol = localStorage.getItem(VOLUME_KEY); 41 + // Get volume from previous session if possible 42 + this.#VOLUME_KEY = `@components/engine/audio/${this.group}/volume`; 43 + const volume = localStorage.getItem(this.#VOLUME_KEY); 44 + 45 + this.#volume = signal(volume ? parseInt(volume) : 0.5); 46 + this.volume = this.#volume.get; 42 47 } 43 48 44 49 // SIGNALS 45 50 46 51 #items = signal(/** @type {Audio[]} */ ([])); 47 - #volume = signal(0.5); 52 + #volume; 48 53 49 54 $hasEnded = signal(false); 50 55 $isPlaying = signal(false); ··· 54 59 hasEnded = this.$hasEnded.get; 55 60 isPlaying = this.$isPlaying.get; 56 61 items = this.#items.get; 57 - volume = this.#volume.get; 58 62 59 63 // LIFECYCLE 60 64 ··· 75 79 }); 76 80 } 77 81 78 - // Monitor volume 79 - // NOTE: Support different volume levels for audio elements? 82 + // Monitor volume signal 80 83 this.effect(() => { 81 84 Array.from(this.querySelectorAll("de-audio-item audio")).forEach( 82 85 (node) => { ··· 85 88 audio.volume = this.#volume.value; 86 89 }, 87 90 ); 91 + 92 + localStorage.setItem(this.#VOLUME_KEY, this.#volume.value.toString()); 88 93 }); 89 94 } 90 95 91 - // ACTIONS (PRIVATE) 96 + // ACTIONS 97 + 98 + /** 99 + * @type {Actions["adjustVolume"]} 100 + */ 101 + adjustVolume(args) { 102 + if (args.audioId) { 103 + this.withAudioNode(args.audioId, (audio) => { 104 + audio.volume = args.volume; 105 + }); 106 + } else { 107 + this.#volume.value = args.volume; 108 + } 109 + } 92 110 93 111 /** 94 112 * @type {Actions["pause"]}
+1
src/components/engine/audio/types.d.ts
··· 1 1 import type { SignalReader } from "@common/signal.d.ts"; 2 2 3 3 export type Actions = { 4 + adjustVolume: (_: { audioId?: string; volume: number }) => void; 4 5 pause: (_: { audioId: string }) => void; 5 6 play: (_: { audioId: string; volume?: number }) => void; 6 7 reload: (_: { audioId: string; play: boolean; progress?: number }) => void;