Browse Source

高级节拍问题

liushengqiang 2 years ago
parent
commit
09af84623c
4 changed files with 26 additions and 16 deletions
  1. 0 4
      src/helpers/formateMusic.ts
  2. 3 4
      src/helpers/metronome.ts
  3. 1 0
      src/state.ts
  4. 22 8
      src/view/selection/index.tsx

+ 0 - 4
src/helpers/formateMusic.ts

@@ -918,10 +918,6 @@ export const formateTimes = (osmd: OpenSheetMusicDisplay) => {
 				}
 			}
 			let stave = activeVerticalMeasureList[0]?.stave;
-			if (!stave && note.isRestFlag && allNotes.length) {
-				// 全休止符, 公用stave
-				// stave = allNotes[allNotes.length - 1].stave
-			}
 
 			if (note.sourceMeasure.multipleRestMeasures) {
 				totalMultipleRestMeasures = note.sourceMeasure.multipleRestMeasures;

+ 3 - 4
src/helpers/metronome.ts

@@ -32,7 +32,7 @@ const toggleLine = () => {
 	if (!metronomeData.lineShow) return;
 	const img: HTMLElement = document.querySelector("#cursorImg-0")!;
 	if (img) {
-		if (metronomeData.activeMetro.isRestFlag) {
+		if (state.times[state.activeNoteIndex].multipleRestMeasures) {
 			img.classList.remove("lineHide");
 		} else {
 			img.classList.add("lineHide");
@@ -44,8 +44,7 @@ watch(
 	() => {
 		const img: HTMLElement = document.querySelector("#cursorImg-0")!;
 		if (img) {
-			const item = state.times[state.activeNoteIndex]
-			if (metronomeData.lineShow && !item.isRestFlag) {
+			if (metronomeData.lineShow) {
 				img.classList.add("lineHide");
 			} else {
 				img.classList.remove("lineHide");
@@ -100,9 +99,9 @@ class Metronome {
 			// console.log("🚀 ~ metronomeData.activeMetro",metronomeData.activeMetro.measureNumberIndex, metronomeData.activeMetro.index)
 			this.playAudio();
 			metronomeData.isClick = false;
-			toggleLine()
 			return;
 		}
+		toggleLine()
 		metronomeData.isClick = false;
 	};
 	// 播放

+ 1 - 0
src/state.ts

@@ -265,6 +265,7 @@ export const skipNotePlay = (itemIndex: number, isStart = false) => {
 	if (item) {
 		setAudioCurrentTime(itemTime, itemIndex);
 		gotoNext(item);
+		metronomeData.metro?.sound(itemTime);
 	}
 };
 

+ 22 - 8
src/view/selection/index.tsx

@@ -56,7 +56,11 @@ const calcNoteData = () => {
 			if (item.stave) {
 				if (item.stave?.attrs?.id) {
 					const staveEle = document.querySelector(`#${item.stave.attrs.id}`);
-					const list = [Array.from(staveEle?.querySelectorAll(".vf-clef") || []), Array.from(staveEle?.querySelectorAll(".vf-keysignature") || []), Array.from(staveEle?.getElementsByTagName('text') || [])].flat();
+					const list = [
+						Array.from(staveEle?.querySelectorAll(".vf-clef") || []),
+						Array.from(staveEle?.querySelectorAll(".vf-keysignature") || []),
+						Array.from(staveEle?.getElementsByTagName("text") || []),
+					].flat();
 					try {
 						if (list.length) {
 							// console.log("🚀 ~ list:", list)
@@ -108,10 +112,10 @@ const calcNoteData = () => {
 
 /** 重新计算 */
 export const recalculateNoteData = () => {
-	selectData.notes = []
-	selectData.staves = []
-	calcNoteData()
-}
+	selectData.notes = [];
+	selectData.staves = [];
+	calcNoteData();
+};
 
 export default defineComponent({
 	name: "selection",
@@ -160,6 +164,18 @@ export default defineComponent({
 			<div id="selectionBox" class={styles.selectionContainer} onClick={(e: Event) => e.stopPropagation()}>
 				{selectData.staves.map((item: any) => {
 					const scoreItem = evaluatingData.evaluatings[item.measureListIndex];
+					// 高级模式下,显示节拍线
+					// 不是报告模式
+					// 不是多小节休止符
+					// 节拍线开关
+					// 当前小节
+					// 当前小节
+					const lineShow =
+						!state.isReport &&
+						!state.times[state.activeNoteIndex].multipleRestMeasures &&
+						metronomeData.lineShow &&
+						item.MeasureNumberXML === metronomeData.activeMetro?.measureNumberXML &&
+						state.times[state.activeNoteIndex].MeasureNumberXML === item.MeasureNumberXML;
 					return (
 						<>
 							{item.staveBox && (
@@ -168,9 +184,7 @@ export default defineComponent({
 									style={item.staveBox}
 									onClick={() => handleSelection(item)}
 								>
-									{!state.isReport && !item.isRestFlag && metronomeData.lineShow && item.MeasureNumberXML === metronomeData.activeMetro?.measureNumberXML && (
-										<div class={styles.line} style={{ left: metronomeData.activeMetro.left }}></div>
-									)}
+									{lineShow && <div class={styles.line} style={{ left: metronomeData.activeMetro.left }}></div>}
 									{!state.isReport && !!item.multipleRestMeasures && state.activeMeasureIndex == item.MeasureNumberXML && (
 										<div class={styles.dotWrap}>{item.multipleRestMeasures}</div>
 									)}