uniProject/components/question/yingyu/useAudio.js

import {
	nextTick,
	ref,
	onUnmounted
} from "vue";
import {
	debounce
} from "@/utils/common";

export function useAudio() {
	const innerAudioContext = ref(null);
	const options = ref(null);

	function createAudio(audioUrl) {
		const innerAudioContext = uni.createInnerAudioContext();
		innerAudioContext.autoplay = false;
		innerAudioContext.src = audioUrl;
		innerAudioContext.onPlay(() => {
			// 播放
			uni.$emit('yy-audio-playing', options);
		});
		innerAudioContext.onError((res) => {
			uni.$emit('yy-audio-error')
		});
		innerAudioContext.onEnded(() => {
			// 播放结束
			uni.$emit('yy-audio-end', options)
		})
		return innerAudioContext;
	}

	function changeSource(url) {
		innerAudioContext.src = url;
		innerAudioContext.currentTime = 0;
	}

	const debuncePlay = debounce((myOption) => {
		innerAudioContext.value = createAudio(myOption.url);
		innerAudioContext.value.play()
	}, 50)

	function handlePlay(data) {
		if (innerAudioContext.value) {
			innerAudioContext.value.pause();
			innerAudioContext.value.destroy();
			innerAudioContext.value = null;
			uni.$emit('destory-stop')
		}
		options.value = data;
		debuncePlay(data);
	}

	function handleStop() {
		if (innerAudioContext.value) {
			innerAudioContext.value.pause();
			innerAudioContext.value.destroy();
			innerAudioContext.value = null;
			uni.$emit('destory-stop')
		}
	}

	function doBackOutpage() {
		handleStop();
	}

	function doRepeatPlayToStop() {
		handleStop();
	}

	function doSwiperChange() {
		handleStop();
	}

	function doQuestionJiexiClose() {
		handleStop();
	}

	function doUnitestSubmit() {
		handleStop();
	}

	// 离开当前页面 停止播放
	uni.$on('back-outpage', doBackOutpage)

	// 播放过程中点击同一个视频触发终止
	uni.$on('repeat-play-to-stop', doRepeatPlayToStop)

	// 试题切换停止播放
	uni.$on('swiper-change', doSwiperChange)
	// 解析关闭 停止播放
	uni.$on('question-jiexi-close', doQuestionJiexiClose)
	// 交卷 停止播放
	uni.$on('unitTest-submit', doUnitestSubmit)
	onUnmounted(() => {
		uni.$off('back-outpage', doBackOutpage)
		uni.$off('repeat-play-to-stop', doRepeatPlayToStop)
		// 试题切换停止播放
		uni.$off('swiper-change', doSwiperChange)
		// 解析关闭 停止播放
		uni.$off('question-jiexi-close', doQuestionJiexiClose)
		// 交卷 停止播放
		uni.$off('unitTest-submit', doUnitestSubmit)
	})
	return {
		options,
		handlePlay,
		handleStop,
		innerAudioContext
	}
}


export class UseAudio {
	instance = null;
	options = null;
	doPlay = debounce((data) => {
		if (this.options) {
			if(this.options.stId == data.stId && this.options.index == data.index) {
				// console.log('同一个音频播放应该暂停')
				uni.$emit('reset-playing-status', this.options)
				this.innerAudioContext.pause();
				this.destory();
				this.init();
				return;
			}
			
			// 切换不同音频
			if(this.options.stId !== data.stId || this.options.index != data.index) {
				// console.log('切换不同音频')
				uni.$emit('reset-playing-status', this.options)
			}
		}
		this.options = data;
		this.innerAudioContext.src = data.url;
		this.innerAudioContext.play();
	},50)
	constructor() {
		this.init();
	}

	init() {
		this.innerAudioContext = uni.createInnerAudioContext();
		this.innerAudioContext.autoplay = false;
		this.innerAudioContext.onPlay(() => {
			uni.$emit("yy-audio-playing", this.options);
		});
		this.innerAudioContext.onError(() => {
			uni.$emit("yy-audio-error", this.options);
		});
		this.innerAudioContext.onEnded(() => {
			uni.$emit("yy-audio-end", this.options);
		});
	}

	static create() {
		if (this.instance) {
			return this;
		}
		this.instance = new UseAudio()
		return this;
	}


	play(data) {
		this.doPlay(data);
	}

	pause() {
		this.innerAudioContext.pause();
	}

	stop() {
		this.innerAudioContext.stop();
	}

	destory() {
		this.innerAudioContext.destroy();
		this.innerAudioContext = null;
		this.options = null;
	}
}