Merge branch 'feature-tianyong-newVersion' into ktyq-online-new

src/helpers/formateMusic.ts

@@ -1216,6 +1216,7 @@ export const formateTimes = (osmd: OpenSheetMusicDisplay) => {
 			// console.log('si',si,i)
 			// console.log(note.sourceMeasure.MeasureNumberXML,note,svgElement, NoteRealValue, measureLength)
 			if (allNotes.length && allNotes[allNotes.length - 1].relativeTime === relativeTime) {
+				i++
 				continue;
 			}
 			// console.log(iterator.currentMeasure)
@@ -1286,39 +1287,55 @@ export const formateTimes = (osmd: OpenSheetMusicDisplay) => {
 			/**
 			 * evxml的曲子，如果曲谱xml中带有times信息，则音符时值优先取times中的值
 			 * 曲子：1795013295024062466（春暖花开），如果音符有times信息，休止符没有times信息，此种规则是认为休止符不参与时值计算的，需要过滤掉该休止符
-			 * TODO:需要考虑唱名怎么处理，唱名是xml有多少个音符，就需要唱多少个，不能剔除
 			 */
-			if (state.isEvxml && note.isRestFlag && note?.noteTimeInfo?.length === 0 && state.xmlHasTimes ) {
-				const idx = _notes.findIndex(item=>item.note === note);
-				let nextNoteTimes = _notes[idx+1]?.note?.noteTimeInfo?.[0]?.begin*1000 
-				let preNoteTImes = _notes[idx-1]?.note?.noteTimeInfo?.[0]?.end*1000
-				// 当下一个音符也没有时间的时候，再往下一个找
-				if(!nextNoteTimes && nextNoteTimes!==0){
-					let nextIndex = idx + 2
-					while(!nextNoteTimes && nextIndex<_notes.length){
-						nextNoteTimes = _notes[nextIndex]?.note?.noteTimeInfo?.[0]?.begin*1000
-						nextIndex ++
-					}
-					// 当最后音符就是没有打时间的休止小节，可能nextNoteTimes时间找不到，目前没有处理
+			let evNoteStartTime = 0, evNoteEndTime = 0;
+			if (state.isEvxml && note?.noteTimeInfo?.length === 0 && state.xmlHasTimes ) {
+				// 找出这个音符前面音符的结束时间
+				let preNoteTImes = allNotes[allNotes.length - 1]?.endtime*1000
+				if(!preNoteTImes){
+					preNoteTImes = Math.max(fixtime - noteLength, 0)*1000 //如果前一个音符没有结束时间，证明这个音符是第一个音符没有打时间，所以往前奏里面找补
 				}
-				if(!preNoteTImes && preNoteTImes!==0){
-					let preIndex = idx - 2
-					while(!preNoteTImes && preIndex>-1){
-						preNoteTImes = _notes[preIndex]?.note?.noteTimeInfo?.[0]?.end*1000
-						preIndex --
+				// 找出这个音符后面音符的开始时间
+				let nextI = i
+				let nextNoteTimes
+				// 多个连续的没有打时间的音符 需要平分时值
+				const notesRatio = []
+				while (!nextNoteTimes && nextI<_notes.length) {
+					notesRatio.push(_notes[nextI].note.length.realValue)
+					nextI++
+					if(_notes[nextI]?.note){ // 有可能_notes里面没有这个音符
+						nextNoteTimes = fliterNotesTime(_notes[nextI].note, preNoteTImes)
 					}
-					// 当没有找到preNoteTImes的时候 赋值为0 (当第一个音符就是没有打时间的休止小节会出现这种情况)
-					preNoteTImes || (preNoteTImes = 0)
 				}
+				// 当最后音符就是没有打时间的音符，可能nextNoteTimes时间找不到时候取上个音符的结束时间加上这个音符的时间
+				if(!nextNoteTimes){
+					nextNoteTimes = preNoteTImes + noteLength*1000
+				}
+				// 判断有没有首位连续 首位连续的时候删掉这个音符
 				const allowRange = Math.abs(nextNoteTimes - preNoteTImes)< 10;
 				if (allowRange) {
 					note.maxNoteNum = note.maxNoteNum - 1;
 					// 唱名时间补齐,当删除这个音符的时候，上个音符的持续时间要加上这个音符的时间
 					allNotes[allNotes.length - 1].noteLengthTime += noteLength
+					i++
 					continue;
+				}else{
+					// 当多个连续的休止符没有打时间的时候 根据音符平均分配
+					if(notesRatio.length > 1){
+						const sum = notesRatio.reduce((acc:number, curr:number) => acc + curr, 0)
+						nextNoteTimes = (nextNoteTimes - preNoteTImes) * notesRatio[0] / sum + preNoteTImes
+					}
+					evNoteEndTime = nextNoteTimes/1000
+					evNoteStartTime = preNoteTImes/1000
+					// 当这个音符计算出来的时值大于本身这个音符的时值时候，取这个音符的长度，防止有前奏和间奏的时候，计算音符持续时长过长
+					if(evNoteEndTime - evNoteStartTime > noteLength){
+						evNoteEndTime = evNoteStartTime + noteLength
+					}
+					if (evNoteStartTime) {
+						relativeTime = evNoteStartTime - fixtime
+					}
 				}
 			}
-			let evNoteStartTime = 0, evNoteEndTime = 0;
 			if (state.isEvxml && note?.noteTimeInfo?.length ) {
 				let idx = noteIds.filter((item: any) => item === svgElement?.attrs.id)?.length || 0;
 				// 如果是合并的小节的休止符
@@ -1745,4 +1762,18 @@ export const compatibleXmlPitchVoice = (xmlParse: any) => {
 		}
 		(window as any).xmlNeedAdjustVoice = xmlNeedAdjustVoice
 	}
+}
+
+// 筛选出这个音符中的值（比前一个音符时值大的值）
+function fliterNotesTime(note:any, preTime:number):undefined|number {
+	// 音符可能涉及多遍歌词，所以这里要找到对应的times
+	if(note?.noteTimeInfo?.length){
+		const timeObj = note?.noteTimeInfo.find((value:any) => {
+			const beginTime = value?.begin*1000 || 0
+			return beginTime > preTime || Math.abs(beginTime - preTime)< 10  //差值在10毫秒之内
+		})
+		return timeObj?.begin*1000
+	}else{
+		return undefined
+	}
 }

src/helpers/metronome.ts

@@ -277,27 +277,61 @@ class Metronome {
 		// 1.统计有多少小节
 		const measures: any[] = [];
 		let xmlNumber = -1;
+		let isDiff = false //弱起时间不够补的时候
 		for (let i = 0; i < times.length; i++) {
 			const note = times[i];
-			const measureNumberXML = note?.noteElement?.sourceMeasure?.MeasureNumberXML;
+			const measureNumberXML = note.MeasureNumberXML;
 			// console.log("🚀 ~ note?.noteElement?.sourceMeasure", note?.noteElement?.sourceMeasure)
 			// console.log("🚀 ~ measureNumberXML", measureNumberXML, note)
 			// console.log("🚀 ~ measureNumberXML", note)
-			const measureListIndex = note?.noteElement?.sourceMeasure?.measureListIndex;
+			const measureListIndex = measureNumberXML - 1;
 			if (measureNumberXML > -1) {
 				if (measureNumberXML != xmlNumber) {
 					// 弱起的时候 根据音符结尾时间减去音符开头时间，得到的不是正常小节的时间，然后平均分配节拍之后，当前节拍间隔会非常短 这里弱起取整个小节的时间
+					// 当小节时间 减去音符时间，前奏没有预留时间时候，从歌词开始唱的那里开始响节拍器
 					let startTime = note.measures[0].time
 					if(i === 0 && note.measures[0].difftime>0){
 						startTime = note.measures[note.measures.length - 1].endtime - note.measures[0].measureLength
+						if(startTime < 0){
+							isDiff = true
+						}
+					}
+					if(isDiff) {
+						// 当前小节有歌词，开放弱起节拍器
+						let isLyric = false
+						let noteIndex = 0
+						while(!isLyric && noteIndex<note.measures.length){
+							isLyric = !!note.measures[noteIndex]?.formatLyricsEntries?.length
+							noteIndex ++
+						}
+						isDiff = !isLyric
+					}
+					if(isDiff){
+						xmlNumber = measureNumberXML;
+						continue
+					}
+					// 最后一小节的时间 有可能和下一小节开始时间接不上
+					const { time, endtime, noteLengthTime } = note.measures[note.measures.length - 1]
+					let nextNoteStartTime = times[note.measures[note.measures.length - 1].i + 1]?.time
+					let noteEndTime = 0
+					if(!nextNoteStartTime){
+						noteEndTime = time + noteLengthTime
+					}else{
+						if(Math.abs(nextNoteStartTime - endtime)*1000< 10){
+							// 当首位本来就是相连的
+							noteEndTime = endtime
+						}else{
+							// 当首位不相连，差值大于这个音符的持续时间的时候取这个音符的时间（防止有间奏的连起来时间太长），否则直接取后一个音符的开始时间
+							noteEndTime = nextNoteStartTime - time > noteLengthTime ? time + noteLengthTime : nextNoteStartTime
+						}	
 					}
 					const m = {
 						measureNumberXML: measureNumberXML,
 						measureNumberIndex: measureListIndex,
 						numerator: note?.noteElement?.sourceMeasure?.ActiveTimeSignature?.numerator || 0,
 						start: startTime,
-						end: note.measures[note.measures.length - 1].endtime,
-						time: note.measures[note.measures.length - 1].endtime - startTime,
+						end: noteEndTime,
+						time: noteEndTime - startTime,
 						stave_x: note?.noteElement?.sourceMeasure?.verticalMeasureList?.[0]?.stave?.x || 0,
 						end_x: note?.stave?.end_x || 0 || 0,
 						stepList: [] as number[],

src/page-instrument/view-detail/smoothAnimation/index.ts

@@ -26,7 +26,9 @@ type smoothAnimationType = {
    batePos: pointsPosType
    pointsPos: pointsPosType
    translateXNum: number
-   aveSpeed: number
+   aveSpeed: number,
+   pageTurnLock: boolean
+   oldCurrentTime: number
 }
 
 let _numberOfSegments = 56 // 中间切割线的个数
@@ -50,7 +52,9 @@ export const smoothAnimationState = {
    batePos: [], // times 直接转换的数组
    pointsPos: [], // 筛选之后的点坐标数组
    translateXNum: 0, // 当前谱面的translateX的距离   谱面的位置信息 由translateX和scrollLeft的偏移一起决定
-   aveSpeed: 0 // 谱面的一帧的平均速度
+   aveSpeed: 0, // 谱面的一帧的平均速度
+   pageTurnLock: false,
+   oldCurrentTime: 0
 } as smoothAnimationType
 
 // 监听显示与隐藏
@@ -151,7 +155,9 @@ export function destroySmoothAnimation() {
       batePos: [],
       pointsPos: [],
       translateXNum: 0,
-      aveSpeed: 0
+      aveSpeed: 0,
+      pageTurnLock: false,
+      oldCurrentTime: 0
    })
 }
 
@@ -164,6 +170,11 @@ export function moveSmoothAnimationByPlayTime(time?: number) {
       return
    }
    const currentTime = time || getAudioCurrentTime()
+   // 某些浏览器 音频暂停后返回的时间会倒退，把这种时间过滤掉
+   if(currentTime < smoothAnimationState.oldCurrentTime) {
+      return
+   }
+   smoothAnimationState.oldCurrentTime = currentTime
    if (currentTime <= state.fixtime) return
    if (currentTime > state.times.last()?.endtime) return
    // 当休止小节，可能当前音符在谱面上没有实际的音符（没有bbox），所以往后找谱面上有的音符
@@ -221,9 +232,8 @@ export function moveSmoothAnimation(progress: number, activeIndex: number, isMov
 /**
  * 谱面翻页逻辑
  */
-let pageTurnLock = false
 function pageTurn_osmd(nowPointsPos: pointsPosType[0]) {
-   if (pageTurnLock) return
+   if (smoothAnimationState.pageTurnLock) return
    // 视口宽度
    const clientWidth = smoothAnimationState.osdmScrollDomWith
    let { left, right } = smoothAnimationState.smoothBotDom!.getBoundingClientRect()
@@ -243,7 +253,7 @@ function pageTurn_osmd(nowPointsPos: pointsPosType[0]) {
          if (smoothAnimationState.translateXNum > maxTranslateXNum) {
             smoothAnimationState.translateXNum = maxTranslateXNum
          }
-         pageTurnLock = true
+         smoothAnimationState.pageTurnLock = true
          moveTranslateXNum(smoothAnimationState.translateXNum)
       }
    }
@@ -330,7 +340,7 @@ export function moveTranslateXNum(translateXNum: number) {
       smoothAnimationState.osmdCanvasPageDom && (smoothAnimationState.osmdCanvasPageDom.style.transition = "")
       smoothAnimationState.selectionBoxDom && (smoothAnimationState.selectionBoxDom.style.transition = "")
       smoothAnimationState.selectionBgBoxDom && (smoothAnimationState.selectionBgBoxDom.style.transition = "")
-      pageTurnLock = false
+      smoothAnimationState.pageTurnLock = false
    } else {
       smoothAnimationState.osmdCanvasPageDom && (smoothAnimationState.osmdCanvasPageDom.style.transform = `translateX(-${translateXNum}px)`)
       smoothAnimationState.selectionBoxDom && (smoothAnimationState.selectionBoxDom.style.transform = `translateX(-${translateXNum}px)`)
@@ -357,7 +367,7 @@ function createSmoothAnimation() {
    const osmdCanvasPageDom = document.querySelector("#osmdCanvasPage1") as HTMLElement
    smoothAnimationState.osmdCanvasPageDom = osmdCanvasPageDom
    smoothAnimationState.osmdCanvasPageDom.addEventListener("transitionend", () => {
-      pageTurnLock = false
+      smoothAnimationState.pageTurnLock = false
    })
    // selectionBox
    setTimeout(() => {
@@ -443,8 +453,8 @@ function getPointsPosByBatePos(): pointsPosType {
    }
    extendPoint.MeasureNumberXML += 100 // 防止MeasureNumberXML重复
    extendPoint.noteId += 100 // 防止noteId重复
-   // 当总长度减10 和 最后一个音符加 10 取最大值 34是一倍的边距
-   extendPoint.x = Math.max(smoothAnimationState.canvasDomWith - 34 * state.zoom - 10, extendPoint.x + 10)
+   // 当总长度减20 和 最后一个音符加 10 取最大值 34是一倍的边距
+   extendPoint.x = Math.max(smoothAnimationState.canvasDomWith - 34 * state.zoom - 20, extendPoint.x + 10)
    pointsPos.push(extendPoint)
    return pointsPos
 }

src/state.ts

@@ -773,6 +773,8 @@ const handlePlaying = () => {
 export const skipNotePlay = async (itemIndex: number, isStart = false) => {
   if (state.isPreView) return;
   console.log('点击音符')
+  // 点击或者重播的时候清除一行谱的时间信息
+  state.isSingleLine && (smoothAnimationState.oldCurrentTime = 0)
   const item = state.times[itemIndex];
   let itemTime = item.time;
   if (isStart) {