@oiij/use/dist/composables/use-audio.cjs

Som Composable Functions for Vue 3

const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
const vue = require_rolldown_runtime.__toESM(require("vue"));

//#region src/composables/use-audio.ts
function useAudio(src, options) {
	const controller = new AbortController();
	const { autoPlay = true, volume = 1, loop = false } = options ?? {};
	const _src = (0, vue.ref)(src ?? "");
	const _volume = (0, vue.ref)(volume);
	const _loop = (0, vue.ref)(loop);
	const duration = (0, vue.ref)(0);
	const currentTime = (0, vue.ref)(0);
	const progress = (0, vue.ref)(0);
	const playing = (0, vue.ref)(false);
	const paused = (0, vue.ref)(false);
	const ended = (0, vue.ref)(false);
	const audio = new Audio(_src.value);
	audio.addEventListener("loadedmetadata", () => {
		duration.value = audio.duration;
	}, { signal: controller.signal });
	audio.addEventListener("timeupdate", () => {
		currentTime.value = audio.currentTime;
		progress.value = audio.currentTime / audio.duration * 100;
	}, { signal: controller.signal });
	audio.addEventListener("play", () => {
		playing.value = true;
		paused.value = false;
		ended.value = false;
	}, { signal: controller.signal });
	audio.addEventListener("pause", () => {
		playing.value = false;
		paused.value = true;
		ended.value = false;
	}, { signal: controller.signal });
	audio.addEventListener("ended", () => {
		playing.value = false;
		paused.value = false;
		ended.value = true;
	}, { signal: controller.signal });
	(0, vue.watch)(_src, (val) => {
		audio.src = val;
	});
	audio.autoplay = autoPlay;
	audio.volume = _volume.value;
	(0, vue.watch)(_volume, (val) => {
		audio.volume = val;
	});
	audio.loop = _loop.value;
	(0, vue.watch)(_loop, (val) => {
		audio.loop = val;
	});
	function play() {
		audio.play();
	}
	function pause() {
		audio.pause();
	}
	function stop() {
		audio.pause();
		audio.currentTime = 0;
	}
	function jump(time) {
		audio.currentTime = time;
	}
	function setProgress(progress$1) {
		audio.currentTime = progress$1 / 100 * audio.duration;
	}
	(0, vue.onUnmounted)(() => {
		controller.abort();
		audio.remove();
	});
	return {
		audio,
		src: _src,
		volume: _volume,
		loop: _loop,
		duration: (0, vue.readonly)(duration),
		currentTime: (0, vue.readonly)(currentTime),
		progress: (0, vue.readonly)(progress),
		playing: (0, vue.readonly)(playing),
		paused: (0, vue.readonly)(paused),
		ended: (0, vue.readonly)(ended),
		play,
		pause,
		stop,
		jump,
		setProgress
	};
}

//#endregion
exports.useAudio = useAudio;