|
|
@@ -237,45 +237,135 @@ const createAudio = (src?: string): Promise<HTMLAudioElement | null> => {
|
|
|
};
|
|
|
|
|
|
// 合成节拍器资源
|
|
|
-const crunker = new Crunker()
|
|
|
-async function mergeBeatAudio(music?:string, accompany?:string){
|
|
|
- let beatMusic, beatAccompany
|
|
|
+let CrunkerInstance: Crunker
|
|
|
+async function mergeBeatAudio(music?:string){
|
|
|
+ let beatMusic
|
|
|
if(!state.isMixBeat) {
|
|
|
- return [beatMusic, beatAccompany]
|
|
|
+ return beatMusic
|
|
|
+ }
|
|
|
+ if(!music){
|
|
|
+ return beatMusic
|
|
|
}
|
|
|
console.time("音频合成时间")
|
|
|
try{
|
|
|
+ /* 音频合成 */
|
|
|
+ if(!CrunkerInstance){
|
|
|
+ CrunkerInstance = new Crunker()
|
|
|
+ }
|
|
|
console.time("音频加载时间")
|
|
|
- const [musicBuff, accompanyBuff, tickBuff, tockBuff] = await crunker.fetchAudio(music?`${music}?v=${Date.now()}`:undefined, accompany?`${accompany}?v=${Date.now()}`:undefined, tickMp3, tockMp3)
|
|
|
+ const [musicBuff, tickBuff, tockBuff] = await CrunkerInstance.fetchAudio(music?`${music}?v=${Date.now()}`:undefined, tickMp3, tockMp3)
|
|
|
console.timeEnd("音频加载时间")
|
|
|
// 计算音频空白时间
|
|
|
- const silenceDuration = musicBuff&&!state.isEvxml ? crunker.calculateSilenceDuration(musicBuff) : 0
|
|
|
- const silenceBgDuration = accompanyBuff&&!state.isEvxml ? crunker.calculateSilenceDuration(accompanyBuff) : 0
|
|
|
- console.log(`音频空白时间:${silenceDuration};${silenceBgDuration}`)
|
|
|
+ const silenceDuration = musicBuff&&!state.isEvxml ? CrunkerInstance.calculateSilenceDuration(musicBuff) : 0
|
|
|
+ console.log(`音频空白时间:${silenceDuration}`)
|
|
|
const beats:AudioBuffer[] = []
|
|
|
const beatsTime:number[] = []
|
|
|
- const beatsBgTime:number[] = []
|
|
|
metronomeData.metroMeasure.map(measures=>{
|
|
|
measures.map((item:any)=>{
|
|
|
beats.push(item.isTick?tickBuff!:tockBuff!)
|
|
|
beatsTime.push(item.time + silenceDuration) // xml 计算的时候 加上空白的时间
|
|
|
- beatsBgTime.push(item.time + silenceBgDuration) // xml 计算的时候 加上空白的时间 没有背景不赋值
|
|
|
})
|
|
|
})
|
|
|
console.time("音频合并时间")
|
|
|
- const musicBuffMeg = musicBuff && crunker.mergeAudioBuffers([musicBuff,...beats],[0,...beatsTime])
|
|
|
- const accompanyBuffMeg = accompanyBuff && crunker.mergeAudioBuffers([accompanyBuff,...beats],[0,...beatsBgTime])
|
|
|
+ const musicBuffMeg = musicBuff && CrunkerInstance.mergeAudioBuffers([musicBuff,...beats],[0,...beatsTime])
|
|
|
console.timeEnd("音频合并时间")
|
|
|
console.time("音频audioDom生成时间")
|
|
|
- beatMusic = musicBuffMeg && crunker.exportAudioElement(musicBuffMeg)
|
|
|
- beatAccompany = accompanyBuffMeg && crunker.exportAudioElement(accompanyBuffMeg)
|
|
|
+ beatMusic = musicBuffMeg && CrunkerInstance.exportAudioElement(musicBuffMeg)
|
|
|
console.timeEnd("音频audioDom生成时间")
|
|
|
}catch(err){
|
|
|
console.log(err)
|
|
|
}
|
|
|
console.timeEnd("音频合成时间")
|
|
|
- return [beatMusic, beatAccompany]
|
|
|
+ return beatMusic
|
|
|
+}
|
|
|
+
|
|
|
+// 处理加载节拍器音频
|
|
|
+export const handleLoadBeatMusic = async () => {
|
|
|
+ if(metronomeData.disable) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const playType = state.playType
|
|
|
+ const playSource = state.playSource
|
|
|
+ const mingSongType = audioData.mingSongType
|
|
|
+ // 当前模式下 如果已经有合成音频了，就不走合成逻辑了
|
|
|
+ let isBeatMusic = false
|
|
|
+ let currentMusic //当前的音频
|
|
|
+ const beatPlayObj = {
|
|
|
+ "play_music":"beatSongEle",
|
|
|
+ "play_background":"beatBackgroundEle",
|
|
|
+ "sing_music":"beatFanSongEle",
|
|
|
+ "sing_background":"beatBanSongEle"
|
|
|
+ }
|
|
|
+ const playObj = {
|
|
|
+ "play_music":"music",
|
|
|
+ "play_background":"accompany",
|
|
|
+ "sing_music":"fanSong",
|
|
|
+ "sing_background":"banSong",
|
|
|
+ }
|
|
|
+ if(playSource === "mingSong") {
|
|
|
+ // 当男声女声都有的时候 才区分
|
|
|
+ if(state.mingSong && state.mingSongGirl){
|
|
|
+ isBeatMusic = mingSongType === 1 ? !!audioData.mingSongTypeCollection.beatMingSongEle : !!audioData.mingSongTypeCollection.beatMingSongGirlEle
|
|
|
+ currentMusic = mingSongType === 1 ? state.mingSong : state.mingSongGirl
|
|
|
+ }else{
|
|
|
+ isBeatMusic = !!audioData.mingSongTypeCollection.beatMingSongEle
|
|
|
+ currentMusic = state.mingSong
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ // @ts-ignore
|
|
|
+ isBeatMusic = !!audioData.songCollection[beatPlayObj[`${playType}_${playSource}`]]
|
|
|
+ // @ts-ignore
|
|
|
+ currentMusic = state[playObj[`${playType}_${playSource}`]]
|
|
|
+ }
|
|
|
+ if(isBeatMusic || !currentMusic){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ state.loadingText = "音频资源加载中，请稍后…"
|
|
|
+ state.isLoading = true
|
|
|
+ const musicAudio = await mergeBeatAudio(currentMusic) as any
|
|
|
+ const playEleObj = {
|
|
|
+ "play_music":"beatSongEle",
|
|
|
+ "play_background":"beatBackgroundEle",
|
|
|
+ "sing_music":"beatFanSongEle",
|
|
|
+ "sing_background":"beatBanSongEle"
|
|
|
+ }
|
|
|
+ // 给音频赋值
|
|
|
+ if(playSource === "mingSong"){
|
|
|
+ // 当男声女声都有的时候 才区分
|
|
|
+ if(state.mingSong && state.mingSongGirl){
|
|
|
+ if(mingSongType === 1) {
|
|
|
+ audioData.mingSongTypeCollection.beatMingSongEle = musicAudio
|
|
|
+ }else {
|
|
|
+ audioData.mingSongTypeCollection.beatMingSongGirlEle = musicAudio
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ audioData.songCollection.beatMingSongEle = musicAudio
|
|
|
+ audioData.mingSongTypeCollection.beatMingSongEle = musicAudio
|
|
|
+ }
|
|
|
+ if(musicAudio){
|
|
|
+ musicAudio.addEventListener("play", onPlay);
|
|
|
+ musicAudio.addEventListener("ended", onEnded);
|
|
|
+ }
|
|
|
+ changeMingSongType()
|
|
|
+ }else{
|
|
|
+ if(playType === "play" && !audioData.songCollection.beatSongEle && !audioData.songCollection.beatBackgroundEle){
|
|
|
+ if(musicAudio){
|
|
|
+ musicAudio.addEventListener("play", onPlay);
|
|
|
+ musicAudio.addEventListener("ended", onEnded);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(playType === "sing" && !audioData.songCollection.beatFanSongEle && !audioData.songCollection.beatBanSongEle){
|
|
|
+ if(musicAudio){
|
|
|
+ musicAudio.addEventListener("play", onPlay);
|
|
|
+ musicAudio.addEventListener("ended", onEnded);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // @ts-ignore
|
|
|
+ audioData.songCollection[playEleObj[`${playType}_${playSource}`]] = musicAudio
|
|
|
+ }
|
|
|
+ state.isLoading = false
|
|
|
}
|
|
|
+
|
|
|
// 切换对应的声轨，并且配置当前的audio
|
|
|
export async function changeCombineAudio (combineIndex: number){
|
|
|
// 重复点击的时候取消选中 原音
|
|
|
@@ -305,7 +395,7 @@ export async function changeCombineAudio (combineIndex: number){
|
|
|
audioData.combineMusicEles.push(...itemMusic)
|
|
|
}else{
|
|
|
const music = await createAudio(musicUrl)
|
|
|
- const [beatMusic] = await mergeBeatAudio(musicUrl)
|
|
|
+ const beatMusic = await mergeBeatAudio(musicUrl)
|
|
|
// 当没有背景音的时候 需要绑定事件
|
|
|
if(!state.accompany){
|
|
|
if(music){
|
|
|
@@ -501,7 +591,7 @@ export default defineComponent({
|
|
|
}
|
|
|
// 处理带节拍器的音源
|
|
|
//const [beatMusic, beatAccompany, beatFanSong, beatBanSong, beatMingSong, beatMingSongGirl] = await loadBeatAudio()
|
|
|
- // 客户端合成节拍器
|
|
|
+ /*// 客户端合成节拍器
|
|
|
const [beatMusic, beatAccompany, beatFanSong, beatBanSong, beatMingSong, beatMingSongGirl] = await mergeBeatAudio(state.music, state.accompany)
|
|
|
Object.assign(audioData.songCollection, {
|
|
|
beatSongEle:beatMusic,
|
|
|
@@ -539,7 +629,7 @@ export default defineComponent({
|
|
|
if(beatMingSongGirl){
|
|
|
beatMingSongGirl.addEventListener("play", onPlay);
|
|
|
beatMingSongGirl.addEventListener("ended", onEnded);
|
|
|
- }
|
|
|
+ } */
|
|
|
// 给男声女声赋值
|
|
|
const userGender = storeData.user.gender
|
|
|
// 当不为null 和undefined的时候 取userGender的值
|
黄琪勇