fix: #9360 bug修复

src/helpers/formateMusic.ts

@@ -900,7 +900,9 @@ export const formateTimes = (osmd: OpenSheetMusicDisplay) => {
 				}
 			}
 			const _noteLength = NoteRealValue;
+			// 当前音符的持续时长，当前音符的RealValue值*拍数*（60/后台设置的基准速度）
 			let noteLength = gradualLength ? gradualLength : Math.min(vRealValue, NoteRealValue) * formatBeatUnit(beatUnit) * (60 / beatSpeed);
+			// 小节时长
 			const measureLength = vRealValue * vDenominator * (60 / beatSpeed);
 			// console.table({value: iterator.currentTimeStamp.realValue, vRealValue,NoteRealValue, noteLength,measureLength, MeasureNumberXML: note.sourceMeasure.MeasureNumberXML})
 			// console.log(i, Math.min(vRealValue, NoteRealValue),noteLength,gradualLength, formatBeatUnit(beatUnit),beatSpeed, NoteRealValue * formatBeatUnit(beatUnit) * (60 / beatSpeed) )
@@ -953,7 +955,7 @@ export const formateTimes = (osmd: OpenSheetMusicDisplay) => {
 			}
 
 			// console.log(note.tie)
-			// console.log(relaEndtime, fixtime, '时间')
+			// console.log(relaEndtime, fixtime, '时间',measureLength)
 			const nodeDetail = {
 				isStaccato: note.voiceEntry.isStaccato(),
 				isRestFlag: note.isRestFlag,

src/helpers/metronome.ts

@@ -28,7 +28,8 @@ export const metronomeData = reactive({
 	activeMetro: {} as any,
 	cursorMode: 1 as number, // 光标模式：1:音符指针；2:节拍指针；3:关闭指针
 	cursorTips: '' as string, // 光标模式提示文字
-	followAudioIndex: 0,
+	followAudioIndex: 1, // 当前的拍数
+	totalNumerator: 2, // 总拍数
 });
 
 watch(
@@ -149,16 +150,17 @@ class Metronome {
 	};
 
 	/**
-	 * 跟练模式播放，跟练模式没有音频播放器，所以没有音频的时间，设定固定时间间隔播放
+	 * 跟练模式播放，跟练模式没有曲子音频播放器
 	 */
 	simulatePlayAudio = () => {
 		// console.log(333, metronomeData.followAudioIndex)
 		if (!metronomeData.initPlayerState) return;
 		const beatVolume = state.setting.beatVolume / 100
-		this.source = metronomeData.followAudioIndex === 0 ? this.source1 : this.source2;
+		this.source = metronomeData.followAudioIndex === 1 ? this.source1 : this.source2;
 		this.source.volume(metronomeData.disable ? 0 : beatVolume);
 		this.source.play();
-		metronomeData.followAudioIndex = metronomeData.followAudioIndex === 0 ? 1 : 0;
+		metronomeData.followAudioIndex += 1;
+		metronomeData.followAudioIndex = metronomeData.followAudioIndex > metronomeData.totalNumerator ? 1 : metronomeData.followAudioIndex;
 	};
 
 	// 切换

src/page-instrument/view-detail/index.tsx

@@ -143,6 +143,7 @@ export default defineComponent({
       state.times = resetFrequency(state.times);
       state.times = setNoteHalfTone(state.times);
       console.log("🚀 ~ state.times:", state.times, state.subjectId, state);
+      state.measureTime = state.times[0]?.measureLength || 0
       try {
         metronomeData.metro = new Metronome();
         metronomeData.metro.init(state.times);

src/state.ts

@@ -10,7 +10,7 @@ import { audioListStart, getAudioCurrentTime, getAudioDuration, setAudioCurrentT
 import { toggleFollow } from "./view/follow-practice";
 import { browser, setStorageSpeed, setGlobalData } from "./utils";
 import { api_createMusicPlayer } from "./helpers/communication";
-import { verifyCanRepeat } from "./helpers/formateMusic";
+import { verifyCanRepeat, getDuration } from "./helpers/formateMusic";
 import { getMusicSheetDetail } from "./utils/baseApi"
 import { getQuery } from "/src/utils/queryString";
 import { followData } from "/src/view/follow-practice/index"
@@ -287,6 +287,10 @@ const state = reactive({
   subjectCodeId: 0 as number,
   /** 合奏曲目是否合并展示 */
   isCombineRender: false,
+  /** 小节的持续时长，以后台设置的播放速度计算 */
+  measureTime: 0,
+  /** 跟练模式，节拍器播放的时间 */
+  beatStartTime: 0,
 });
 const browserInfo = browser();
 let offset_duration = 0;
@@ -887,20 +891,26 @@ const setCustom = (trackNum?: number) => {
 
 /** 跟练模式播放节拍器（叮咚） */
 export const followBeatPaly = () => {
+  let metroTimer: any = null;
   if (!followData.start) {
+    clearTimeout(metroTimer)
+    metroTimer = null
     return;
   }
-  let startTime = 0;
+  const time = state.measureTime*1000 / metronomeData.totalNumerator
   requestAnimationFrame(() => {
     const endTime = Date.now();
-    if (endTime - startTime < 1000) {
+    if (endTime - state.beatStartTime < time) {
       followBeatPaly();
     } else {
-      setTimeout(() => {
-        metronomeData.metro?.simulatePlayAudio()
-        startTime = Date.now();
-        followBeatPaly();
-      }, 700);
+      // metroTimer = setTimeout(() => {
+      //   metronomeData.metro?.simulatePlayAudio()
+      //   startTime = Date.now();
+      //   followBeatPaly();
+      // }, time);
+      metronomeData.metro?.simulatePlayAudio()
+      state.beatStartTime = Date.now();
+      followBeatPaly();
     }
   });
 };

src/view/follow-practice/index.tsx

@@ -5,6 +5,9 @@ import { api_cloudFollowTime, api_cloudToggleFollow } from "/src/helpers/communi
 import { storeData } from "/src/store";
 import { audioRecorder } from "./audioRecorder";
 import { handleStartTick } from "/src/view/tick";
+import { metronomeData } from "/src/helpers/metronome";
+import { getDuration } from "/src/helpers/formateMusic";
+import { OpenSheetMusicDisplay } from "/osmd-extended/src";
 
 export const followData = reactive({
 	list: [] as any, // 频率列表
@@ -83,6 +86,10 @@ export const handleFollowStart = async () => {
 	resetPlaybackToStart();
 	openToggleRecord(true);
 	getNoteIndex();
+	const duration: any = getDuration(state.osmd as unknown as OpenSheetMusicDisplay);
+	metronomeData.totalNumerator = duration.numerator || 2
+	metronomeData.followAudioIndex = 1
+	state.beatStartTime = 0
 	followBeatPaly();
 };
 /** 结束跟练 */