使用自带移调

src/pc/home/index.tsx

@@ -178,6 +178,7 @@ export default defineComponent({
 			settingShow: false, // 设置弹窗
 		});
 		const data = reactive({
+			drawCount: 0,
 			isSave: false,
 			musicId: "",
 			musicName: "", // 曲谱名称
@@ -492,10 +493,11 @@ export default defineComponent({
 				nextTick(() => {
 					data.music = isProduct ? renderMeasures(abcData.abc) : data.music;
 					renderSvg();
-					resetMidi();
+					resetMidi(data.drawCount > 0 ? true : false);
 					renderBoxRect();
 					resolve(1);
 					textAreaRef.value && (textAreaRef.value.value = data.music);
+					data.drawCount++;
 				});
 			});
 		};
@@ -955,30 +957,44 @@ export default defineComponent({
 		};
 
 		/** 移调 */
-		const handleMoveKey = (item: (typeof ABC_DATA.key)[0]) => {
-			const step = getKeyStep(item.value, abcData.abc.key, data.moveKeyType);
-			console.log("🚀 ~ item:", abcData.abc.key, "=>", item.value, step);
+		const handleMoveKey = async (item: (typeof ABC_DATA.key)[0]) => {
+			// const moveData = getKeyStep(item.value, abcData.abc.key, data.moveKeyType);
+			// console.log("🚀 ~ item:", abcData.abc.key, "=>", item.value, moveData);
 			// 将所有的音符移调
-			for (let i = 0; i < abcData.abc.measures.length; i++) {
-				const measure = abcData.abc.measures[i];
-				for (let j = 0; j < measure.notes.length; j++) {
-					const note = measure.notes[j];
-					if (note.content == "z") continue;
-					const content = moveNoteKey(note.content, step);
-					const _a = content.substring(0, 1);
-					if (_a === "^" || _a === "_") {
-						note.content = content.substring(1);
-					} else {
-						note.content = content;
-					}
-					console.log("🚀 ~ note.content:", note.content);
-				}
-			}
+			// for (let i = 0; i < abcData.abc.measures.length; i++) {
+			// 	const measure = abcData.abc.measures[i];
+			// 	for (let j = 0; j < measure.notes.length; j++) {
+			// 		const note = measure.notes[j];
+			// 		if (note.content == "z") continue;
+			// 		const content = moveNoteKey(note.content, moveData);
+			// 		const _a = content.substring(0, 1);
+			// 		if (_a === "^" || _a === "_") {
+			// 			note.content = content.substring(1);
+			// 		} else {
+			// 			note.content = content;
+			// 		}
+			// 		console.log("🚀 ~ note.content:", note.content);
+			// 	}
+			// }
 			// // console.log(abcData.abc.visualTranspose, item.step, item.value)
-			abcData.abc.key = item.value;
-			// abcData.abc.visualTranspose = step
+			// abcData.abc.key = item.value;
+			// const step =
+			// 	data.moveKeyType === "up"
+			// 		? item.step > 0
+			// 			? item.step
+			// 			: item.step + 12
+			// 		: data.moveKeyType === "down"
+			// 		? item.step < 0
+			// 			? item.step
+			// 			: item.step + 12
+			// 		: item.step;
+			abcData.abc.visualTranspose = item.step;
 			popup.moveKeyShow = false;
-			handleResetRender();
+			if (data.playState) {
+				abcData.synthControl.disable(true);
+				data.playState = false;
+			}
+			await handleResetRender();
 		};
 
 		/**

src/pc/home/noteData.ts

@@ -1,358 +1,358 @@
 export const ABC_NOTE_DATA = [
-	"C,,,,",
+	["^B,,,,,", "C,,,,"],
 	["^C,,,,", "_D,,,,"],
 	"D,,,,",
 	["^D,,,,", "_E,,,,"],
-	"E,,,,",
-	"F,,,,",
+	["E,,,,", "_F,,,,"],
+	["^E,,,,", "F,,,,"],
 	["^F,,,,", "_G,,,,"],
 	"G,,,,",
 	["^G,,,,", "_A,,,,"],
 	"A,,,,",
 	["^A,,,,", "_B,,,,"],
-	"B,,,,",
+	["B,,,,", "_C,,,"],
 
-	"C,,,",
+	["^B,,,,", "C,,,"],
 	["^C,,,", "_D,,,"],
 	"D,,,",
 	["^D,,,", "_E,,,"],
-	"E,,,",
-	"F,,,",
+	["E,,,", "_F,,,"],
+	["^E,,,", "F,,,"],
 	["^F,,,", "_G,,,"],
 	"G,,,",
 	["^G,,,", "_A,,,"],
 	"A,,,",
 	["^A,,,", "_B,,,"],
-	"B,,,",
+	["B,,,", "_C,,"],
 
-	"C,,",
+	["^B,,,", "C,,"],
 	["^C,,", "_D,,"],
 	"D,,",
 	["^D,,", "_E,,"],
-	"E,,",
-	"F,,",
+	["E,,", "_F,,"],
+	["^E,,", "F,,"],
 	["^F,,", "_G,,"],
 	"G,,",
 	["^G,,", "_A,,"],
 	"A,,",
 	["^A,,", "_B,,"],
-	"B,,",
+	["B,,", "_C,"],
 
-	"C,",
+	["^B,,", "C,"],
 	["^C,", "_D,"],
 	"D,",
 	["^D,", "_E,"],
-	"E,",
-	"F,",
+	["E,", "_F,"],
+	["^E,", "F,"],
 	["^F,", "_G,"],
 	"G,",
 	["^G,", "_A,"],
 	"A,",
 	["^A,", "_B,"],
-	"B,",
+	["B,", "_C"],
 
-	"C",
+	["^B,", "C"],
 	["^C", "_D"],
 	"D",
 	["^D", "_E"],
-	"E",
-	"F",
+	["E", "_F"],
+	["^E", "F"],
 	["^F", "_G"],
 	"G",
 	["^G", "_A"],
 	"A",
 	["^A", "_B"],
-	"B",
+	["B", "_c"],
 
-	"c",
+	["^B", "c"],
 	["^c", "_d"],
 	"d",
 	["^d", "_e"],
-	"e",
-	"f",
+	["e", "_f"],
+	["^e", "f"],
 	["^f", "_g"],
 	"g",
 	["^g", "_a"],
 	"a",
 	["^a", "_b"],
-	"b",
+	["b", "_c'"],
 
-	"c'",
+	["^b", "c'"],
 	["^c'", "_d'"],
 	"d'",
 	["^d'", "_e'"],
-	"e'",
-	"f'",
+	["e'", "_f'"],
+	["^e'", "f'"],
 	["^f'", "_g'"],
 	"g'",
 	["^g'", "_a'"],
 	"a'",
 	["^a'", "_b'"],
-	"b'",
+	["b'", "_c''"],
 
-	"c''",
+	["^b'", "c''"],
 	["^c''", "_d''"],
 	"d''",
 	["^d''", "_e''"],
-	"e''",
-	"f''",
+	["e''", "_f''"],
+	["^e''", "f''"],
 	["^f''", "_g''"],
 	"g''",
 	["^g''", "_a''"],
 	"a''",
 	["^a''", "_b''"],
-	"b''",
+	["b''", "_c'''"],
 
-	"c'''",
+	["^b''", "c'''"],
 	["^c'''", "_d'''"],
 	"d'''",
 	["^d'''", "_e'''"],
-	"e'''",
-	"f'''",
+	["e'''", "_f'''"],
+	["^e'''", "f'''"],
 	["^f'''", "_g'''"],
 	"g'''",
 	["^g'''", "_a'''"],
 	"a'''",
 	["^a'''", "_b'''"],
-	"b'''",
+	["b'''", "_c''''"],
 
-	"c''''",
+	["^b'''", "c''''"],
 	["^c''''", "_d''''"],
 	"d''''",
 	["^d''''", "_e''''"],
-	"e''''",
-	"f''''",
+	["e''''", "_f''''"],
+	["^e''''", "f''''"],
 	["^f''''", "_g''''"],
 	"g''''",
 	["^g''''", "_a''''"],
 	"a''''",
 	["^a''''", "_b''''"],
-	"b''''",
+	["b''''", "_c'''''"],
 ];
 
 export const ABC_KEYS: { [_: string]: any } = {
 	"K:C": {
-		"K:C#": { up: 1, down: -11 },
-		"K:Db": { up: 1, down: -11 },
-		"K:D": { up: 2, down: -10 },
-		"K:Eb": { up: 3, down: -9 },
-		"K:E": { up: 4, down: -8 },
-		"K:F": { up: 5, down: -7 },
-		"K:F#": { up: 6, down: -6 },
-		"K:Gb": { up: 6, down: -6 },
-		"K:G": { up: 7, down: -5 },
-		"K:Ab": { up: 8, down: -4 },
-		"K:A": { up: 9, down: -3 },
-		"K:Bb": { up: 10, down: -2 },
-		"K:B": { up: 11, down: -1 },
-		"K:C": { up: 0, down: 0 },
+		"K:C#": { up: 1, down: -11, move: 0 },
+		"K:Db": { up: 1, down: -11, move: 1 },
+		"K:D": { up: 2, down: -10, move: 0 },
+		"K:Eb": { up: 3, down: -9, move: 1 },
+		"K:E": { up: 4, down: -8, move: 0 },
+		"K:F": { up: 5, down: -7, move: 1 },
+		"K:F#": { up: 6, down: -6, move: 0 },
+		"K:Gb": { up: 6, down: -6, move: 1 },
+		"K:G": { up: 7, down: -5, move: 0 },
+		"K:Ab": { up: 8, down: -4, move: 1 },
+		"K:A": { up: 9, down: -3, move: 0 },
+		"K:Bb": { up: 10, down: -2, move: 1 },
+		"K:B": { up: 11, down: -1, move: 0 },
+		"K:C": { up: 0, down: 0, move: 0 },
 	},
 	"K:C#": {
-		"K:D": { up: 1, down: -11 },
-		"K:Eb": { up: 2, down: -10 },
-		"K:E": { up: 3, down: -9 },
-		"K:F": { up: 4, down: -8 },
-		"K:Gb": { up: 5, down: -7 },
-		"K:F#": { up: 5, down: -7 },
-		"K:G": { up: 6, down: -6 },
-		"K:Ab": { up: 7, down: -5 },
-		"K:A": { up: 8, down: -4 },
-		"K:Bb": { up: 9, down: -3 },
-		"K:B": { up: 10, down: -2 },
-		"K:C": { up: 11, down: -1 },
-		"K:C#": { up: 0, down: 0 },
-		"K:Db": { up: 0, down: 0 },
+		"K:D": { up: 1, down: -11, move: 0 },
+		"K:Eb": { up: 2, down: -10, move: 1 },
+		"K:E": { up: 3, down: -9, move: 0 },
+		"K:F": { up: 4, down: -8, move: 1 },
+		"K:Gb": { up: 5, down: -7, move: 0 },
+		"K:F#": { up: 5, down: -7, move: 1 },
+		"K:G": { up: 6, down: -6, move: 1 },
+		"K:Ab": { up: 7, down: -5, move: 1 },
+		"K:A": { up: 8, down: -4, move: 0 },
+		"K:Bb": { up: 9, down: -3, move: 1 },
+		"K:B": { up: 10, down: -2, move: 0 },
+		"K:C": { up: 11, down: -1, move: 1 },
+		"K:C#": { up: 0, down: 0, move: 0 },
+		"K:Db": { up: 0, down: 0, move: 0 },
 	},
 	"K:Db": {
-		"K:D": { up: 1, down: -11 },
-		"K:Eb": { up: 2, down: -10 },
-		"K:E": { up: 3, down: -9 },
-		"K:F": { up: 4, down: -8 },
-		"K:Gb": { up: 5, down: -7 },
-		"K:F#": { up: 5, down: -7 },
-		"K:G": { up: 6, down: -6 },
-		"K:Ab": { up: 7, down: -5 },
-		"K:A": { up: 8, down: -4 },
-		"K:Bb": { up: 9, down: -3 },
-		"K:B": { up: 10, down: -2 },
-		"K:C": { up: 11, down: -1 },
-		"K:C#": { up: 0, down: 0 },
-		"K:Db": { up: 0, down: 0 },
+		"K:D": { up: 1, down: -11, move: 0 },
+		"K:Eb": { up: 2, down: -10, move: 1 },
+		"K:E": { up: 3, down: -9, move: 0 },
+		"K:F": { up: 4, down: -8, move: 1 },
+		"K:Gb": { up: 5, down: -7, move: 0 },
+		"K:F#": { up: 5, down: -7, move: 1 },
+		"K:G": { up: 6, down: -6, move: 0 },
+		"K:Ab": { up: 7, down: -5, move: 1 },
+		"K:A": { up: 8, down: -4, move: 0 },
+		"K:Bb": { up: 9, down: -3, move: 1 },
+		"K:B": { up: 10, down: -2, move: 0 },
+		"K:C": { up: 11, down: -1, move: 1 },
+		"K:C#": { up: 0, down: 0, move: 0 },
+		"K:Db": { up: 0, down: 0, move: 1 },
 	},
 	"K:D": {
-		"K:Eb": { up: 1, down: -11 },
-		"K:E": { up: 2, down: -10 },
-		"K:F": { up: 3, down: -9 },
-		"K:Gb": { up: 4, down: -8 },
-		"K:F#": { up: 4, down: -8 },
-		"K:G": { up: 5, down: -7 },
-		"K:Ab": { up: 6, down: -6 },
-		"K:A": { up: 7, down: -5 },
-		"K:Bb": { up: 8, down: -4 },
-		"K:B": { up: 9, down: -3 },
-		"K:C": { up: 10, down: -2 },
-		"K:C#": { up: 11, down: -1 },
-		"K:Db": { up: 11, down: -1 },
-		"K:D": { up: 0, down: 0 },
+		"K:Eb": { up: 1, down: -11, move: 0 },
+		"K:E": { up: 2, down: -10, move: 1 },
+		"K:F": { up: 3, down: -9, move: 0 },
+		"K:Gb": { up: 4, down: -8, move: 1 },
+		"K:F#": { up: 4, down: -8, move: 0 },
+		"K:G": { up: 5, down: -7, move: 0 },
+		"K:Ab": { up: 6, down: -6, move: 0 },
+		"K:A": { up: 7, down: -5, move: 1 },
+		"K:Bb": { up: 8, down: -4, move: 0 },
+		"K:B": { up: 9, down: -3, move: 1 },
+		"K:C": { up: 10, down: -2, move: 0 },
+		"K:C#": { up: 11, down: -1, move: 1 },
+		"K:Db": { up: 11, down: -1, move: 0 },
+		"K:D": { up: 0, down: 0, move: 0 },
 	},
 	"K:Eb": {
-		"K:E": { up: 1, down: -11 },
-		"K:F": { up: 2, down: -10 },
-		"K:Gb": { up: 3, down: -9 },
-		"K:F#": { up: 3, down: -9 },
-		"K:G": { up: 4, down: -8 },
-		"K:Ab": { up: 5, down: -7 },
-		"K:A": { up: 6, down: -6 },
-		"K:Bb": { up: 7, down: -5 },
-		"K:B": { up: 8, down: -4 },
-		"K:C": { up: 9, down: -3 },
-		"K:C#": { up: 10, down: -2 },
-		"K:Db": { up: 10, down: -2 },
-		"K:D": { up: 11, down: -1 },
-		"K:Eb": { up: 0, down: 0 },
+		"K:E": { up: 1, down: -11, move: 0 },
+		"K:F": { up: 2, down: -10, move: 1 },
+		"K:Gb": { up: 3, down: -9, move: 0 },
+		"K:F#": { up: 3, down: -9, move: 1 },
+		"K:G": { up: 4, down: -8, move: 0 },
+		"K:Ab": { up: 5, down: -7, move: 1 },
+		"K:A": { up: 6, down: -6, move: 0 },
+		"K:Bb": { up: 7, down: -5, move: 1 },
+		"K:B": { up: 8, down: -4, move: 0 },
+		"K:C": { up: 9, down: -3, move: 1 },
+		"K:C#": { up: 10, down: -2, move: 0 },
+		"K:Db": { up: 10, down: -2, move: 1 },
+		"K:D": { up: 11, down: -1, move: 0 },
+		"K:Eb": { up: 0, down: 0, move: 0 },
 	},
 	"K:E": {
-		"K:F": { up: 1, down: -11 },
-		"K:Gb": { up: 2, down: -10 },
-		"K:F#": { up: 2, down: -10 },
-		"K:G": { up: 3, down: -9 },
-		"K:Ab": { up: 4, down: -8 },
-		"K:A": { up: 5, down: -7 },
-		"K:Bb": { up: 6, down: -6 },
-		"K:B": { up: 7, down: -5 },
-		"K:C": { up: 8, down: -4 },
-		"K:C#": { up: 9, down: -3 },
-		"K:Db": { up: 9, down: -3 },
-		"K:D": { up: 10, down: -2 },
-		"K:Eb": { up: 11, down: -1 },
-		"K:E": { up: 0, down: 0 },
+		"K:F": { up: 1, down: -11, move: 0 },
+		"K:Gb": { up: 2, down: -10, move: 1 },
+		"K:F#": { up: 2, down: -10, move: 0 },
+		"K:G": { up: 3, down: -9, move: 1 },
+		"K:Ab": { up: 4, down: -8, move: 0 },
+		"K:A": { up: 5, down: -7, move: 1 },
+		"K:Bb": { up: 6, down: -6, move: 0 },
+		"K:B": { up: 7, down: -5, move: 1 },
+		"K:C": { up: 8, down: -4, move: 0 },
+		"K:C#": { up: 9, down: -3, move: 1 },
+		"K:Db": { up: 9, down: -3, move: 0 },
+		"K:D": { up: 10, down: -2, move: 1 },
+		"K:Eb": { up: 11, down: -1, move: 0 },
+		"K:E": { up: 0, down: 0, move: 0 },
 	},
 	"K:F": {
-		"K:Gb": { up: 1, down: -11 },
-		"K:F#": { up: 1, down: -11 },
-		"K:G": { up: 2, down: -10 },
-		"K:Ab": { up: 3, down: -9 },
-		"K:A": { up: 4, down: -8 },
-		"K:Bb": { up: 5, down: -7 },
-		"K:B": { up: 6, down: -6 },
-		"K:C": { up: 7, down: -5 },
-		"K:C#": { up: 8, down: -4 },
-		"K:Db": { up: 8, down: -4 },
-		"K:D": { up: 9, down: -3 },
-		"K:Eb": { up: 10, down: -2 },
-		"K:E": { up: 11, down: -1 },
-		"K:F": { up: 0, down: 0 },
+		"K:Gb": { up: 1, down: -11, move: 0 },
+		"K:F#": { up: 1, down: -11, move: 1 },
+		"K:G": { up: 2, down: -10, move: 0 },
+		"K:Ab": { up: 3, down: -9, move: 1 },
+		"K:A": { up: 4, down: -8, move: 0 },
+		"K:Bb": { up: 5, down: -7, move: 1 },
+		"K:B": { up: 6, down: -6, move: 0 },
+		"K:C": { up: 7, down: -5, move: 1 },
+		"K:C#": { up: 8, down: -4, move: 0 },
+		"K:Db": { up: 8, down: -4, move: 1 },
+		"K:D": { up: 9, down: -3, move: 0 },
+		"K:Eb": { up: 10, down: -2, move: 1 },
+		"K:E": { up: 11, down: -1, move: 0 },
+		"K:F": { up: 0, down: 0, move: 0 },
 	},
 	"K:F#": {
-		"K:G": { up: 1, down: -11 },
-		"K:Ab": { up: 2, down: -10 },
-		"K:A": { up: 3, down: -9 },
-		"K:Bb": { up: 4, down: -8 },
-		"K:B": { up: 5, down: -7 },
-		"K:C": { up: 6, down: -6 },
-		"K:C#": { up: 7, down: -5 },
-		"K:Db": { up: 7, down: -5 },
-		"K:D": { up: 8, down: -4 },
-		"K:Eb": { up: 9, down: -3 },
-		"K:E": { up: 10, down: -2 },
-		"K:F": { up: 11, down: -1 },
-		"K:Gb": { up: 0, down: 0 },
-		"K:F#": { up: 0, down: 0 },
+		"K:G": { up: 1, down: -11, move: 0 },
+		"K:Ab": { up: 2, down: -10, move: 1 },
+		"K:A": { up: 3, down: -9, move: 0 },
+		"K:Bb": { up: 4, down: -8, move: 1 },
+		"K:B": { up: 5, down: -7, move: 0 },
+		"K:C": { up: 6, down: -6, move: 1 },
+		"K:C#": { up: 7, down: -5, move: 0 },
+		"K:Db": { up: 7, down: -5, move: 1 },
+		"K:D": { up: 8, down: -4, move: 0 },
+		"K:Eb": { up: 9, down: -3, move: 1 },
+		"K:E": { up: 10, down: -2, move: 0 },
+		"K:F": { up: 11, down: -1, move: 1 },
+		"K:Gb": { up: 0, down: 0, move: 0 },
+		"K:F#": { up: 0, down: 0, move: 0 },
 	},
 	"K:Gb": {
-		"K:G": { up: 1, down: -11 },
-		"K:Ab": { up: 2, down: -10 },
-		"K:A": { up: 3, down: -9 },
-		"K:Bb": { up: 4, down: -8 },
-		"K:B": { up: 5, down: -7 },
-		"K:C": { up: 6, down: -6 },
-		"K:C#": { up: 7, down: -5 },
-		"K:Db": { up: 7, down: -5 },
-		"K:D": { up: 8, down: -4 },
-		"K:Eb": { up: 9, down: -3 },
-		"K:E": { up: 10, down: -2 },
-		"K:F": { up: 11, down: -1 },
-		"K:Gb": { up: 0, down: 0 },
-		"K:F#": { up: 0, down: 0 },
+		"K:G": { up: 1, down: -11, move: 0 },
+		"K:Ab": { up: 2, down: -10, move: 1 },
+		"K:A": { up: 3, down: -9, move: 0 },
+		"K:Bb": { up: 4, down: -8, move: 1 },
+		"K:B": { up: 5, down: -7, move: 0 },
+		"K:C": { up: 6, down: -6, move: 1 },
+		"K:C#": { up: 7, down: -5, move: 0 },
+		"K:Db": { up: 7, down: -5, move: 1 },
+		"K:D": { up: 8, down: -4, move: 0 },
+		"K:Eb": { up: 9, down: -3, move: 1 },
+		"K:E": { up: 10, down: -2, move: 0 },
+		"K:F": { up: 11, down: -1, move: 1 },
+		"K:Gb": { up: 0, down: 0, move: 0 },
+		"K:F#": { up: 0, down: 0, move: 0 },
 	},
 	"K:G": {
-		"K:Ab": { up: 1, down: -11 },
-		"K:A": { up: 2, down: -10 },
-		"K:Bb": { up: 3, down: -9 },
-		"K:B": { up: 4, down: -8 },
-		"K:C": { up: 5, down: -7 },
-		"K:C#": { up: 6, down: -6 },
-		"K:Db": { up: 6, down: -6 },
-		"K:D": { up: 7, down: -5 },
-		"K:Eb": { up: 8, down: -4 },
-		"K:E": { up: 9, down: -3 },
-		"K:F": { up: 10, down: -2 },
-		"K:Gb": { up: 11, down: -1 },
-		"K:F#": { up: 11, down: -1 },
-		"K:G": { up: 0, down: 0 },
+		"K:Ab": { up: 1, down: -11, move: 0 },
+		"K:A": { up: 2, down: -10, move: 1 },
+		"K:Bb": { up: 3, down: -9, move: 0 },
+		"K:B": { up: 4, down: -8, move: 1 },
+		"K:C": { up: 5, down: -7, move: 0 },
+		"K:C#": { up: 6, down: -6, move: 1 },
+		"K:Db": { up: 6, down: -6, move: 0 },
+		"K:D": { up: 7, down: -5, move: 1 },
+		"K:Eb": { up: 8, down: -4, move: 0 },
+		"K:E": { up: 9, down: -3, move: 1 },
+		"K:F": { up: 10, down: -2, move: 0 },
+		"K:Gb": { up: 11, down: -1, move: 1 },
+		"K:F#": { up: 11, down: -1, move: 0 },
+		"K:G": { up: 0, down: 0, move: 0 },
 	},
 	"K:Ab": {
-		"K:A": { up: 1, down: -11 },
-		"K:Bb": { up: 2, down: -10 },
-		"K:B": { up: 3, down: -9 },
-		"K:C": { up: 4, down: -8 },
-		"K:C#": { up: 5, down: -7 },
-		"K:Db": { up: 5, down: -7 },
-		"K:D": { up: 6, down: -6 },
-		"K:Eb": { up: 7, down: -5 },
-		"K:E": { up: 8, down: -4 },
-		"K:F": { up: 9, down: -3 },
-		"K:Gb": { up: 10, down: -2 },
-		"K:F#": { up: 10, down: -2 },
-		"K:G": { up: 11, down: -1 },
-		"K:Ab": { up: 0, down: 0 },
+		"K:A": { up: 1, down: -11, move: 0 },
+		"K:Bb": { up: 2, down: -10, move: 1 },
+		"K:B": { up: 3, down: -9, move: 0 },
+		"K:C": { up: 4, down: -8, move: 1 },
+		"K:C#": { up: 5, down: -7, move: 0 },
+		"K:Db": { up: 5, down: -7, move: 1 },
+		"K:D": { up: 6, down: -6, move: 0 },
+		"K:Eb": { up: 7, down: -5, move: 1 },
+		"K:E": { up: 8, down: -4, move: 0 },
+		"K:F": { up: 9, down: -3, move: 1 },
+		"K:Gb": { up: 10, down: -2, move: 0 },
+		"K:F#": { up: 10, down: -2, move: 1 },
+		"K:G": { up: 11, down: -1, move: 0 },
+		"K:Ab": { up: 0, down: 0, move: 0 },
 	},
 	"K:A": {
-		"K:Bb": { up: 1, down: -11 },
-		"K:B": { up: 2, down: -10 },
-		"K:C": { up: 3, down: -9 },
-		"K:C#": { up: 4, down: -8 },
-		"K:Db": { up: 4, down: -8 },
-		"K:D": { up: 5, down: -7 },
-		"K:Eb": { up: 6, down: -6 },
-		"K:E": { up: 7, down: -5 },
-		"K:F": { up: 8, down: -4 },
-		"K:Gb": { up: 9, down: -3 },
-		"K:F#": { up: 9, down: -3 },
-		"K:G": { up: 10, down: -2 },
-		"K:Ab": { up: 11, down: -1 },
-		"K:A": { up: 0, down: 0 },
+		"K:Bb": { up: 1, down: -11, move: 0 },
+		"K:B": { up: 2, down: -10, move: 1 },
+		"K:C": { up: 3, down: -9, move: 0 },
+		"K:C#": { up: 4, down: -8, move: 1 },
+		"K:Db": { up: 4, down: -8, move: 0 },
+		"K:D": { up: 5, down: -7, move: 1 },
+		"K:Eb": { up: 6, down: -6, move: 0 },
+		"K:E": { up: 7, down: -5, move: 1 },
+		"K:F": { up: 8, down: -4, move: 0 },
+		"K:Gb": { up: 9, down: -3, move: 1 },
+		"K:F#": { up: 9, down: -3, move: 0 },
+		"K:G": { up: 10, down: -2, move: 1 },
+		"K:Ab": { up: 11, down: -1, move: 0 },
+		"K:A": { up: 0, down: 0, move: 0 },
 	},
 	"K:Bb": {
-		"K:B": { up: 1, down: -11 },
-		"K:C": { up: 2, down: -10 },
-		"K:C#": { up: 3, down: -9 },
-		"K:Db": { up: 3, down: -9 },
-		"K:D": { up: 4, down: -8 },
-		"K:Eb": { up: 5, down: -7 },
-		"K:E": { up: 6, down: -6 },
-		"K:F": { up: 7, down: -5 },
-		"K:Gb": { up: 8, down: -4 },
-		"K:F#": { up: 8, down: -4 },
-		"K:G": { up: 9, down: -3 },
-		"K:Ab": { up: 10, down: -2 },
-		"K:A": { up: 11, down: -1 },
-		"K:Bb": { up: 0, down: 0 },
+		"K:B": { up: 1, down: -11, move: 0 },
+		"K:C": { up: 2, down: -10, move: 1 },
+		"K:C#": { up: 3, down: -9, move: 0 },
+		"K:Db": { up: 3, down: -9, move: 1 },
+		"K:D": { up: 4, down: -8, move: 0 },
+		"K:Eb": { up: 5, down: -7, move: 1 },
+		"K:E": { up: 6, down: -6, move: 0 },
+		"K:F": { up: 7, down: -5, move: 1 },
+		"K:Gb": { up: 8, down: -4, move: 0 },
+		"K:F#": { up: 8, down: -4, move: 1 },
+		"K:G": { up: 9, down: -3, move: 0 },
+		"K:Ab": { up: 10, down: -2, move: 1 },
+		"K:A": { up: 11, down: -1, move: 0 },
+		"K:Bb": { up: 0, down: 0, move: 0 },
 	},
 	"K:B": {
-		"K:C": { up: 1, down: -11 },
-		"K:C#": { up: 2, down: -10 },
-		"K:Db": { up: 2, down: -10 },
-		"K:D": { up: 3, down: -9 },
-		"K:Eb": { up: 4, down: -8 },
-		"K:E": { up: 5, down: -7 },
-		"K:F": { up: 6, down: -6 },
-		"K:Gb": { up: 7, down: -5 },
-		"K:F#": { up: 7, down: -5 },
-		"K:G": { up: 8, down: -4 },
-		"K:Ab": { up: 9, down: -3 },
-		"K:A": { up: 10, down: -2 },
-		"K:Bb": { up: 11, down: -1 },
-		"K:B": { up: 0, down: 0 },
+		"K:C": { up: 1, down: -11, move: 0 },
+		"K:C#": { up: 2, down: -10, move: 1 },
+		"K:Db": { up: 2, down: -10, move: 0 },
+		"K:D": { up: 3, down: -9, move: 1 },
+		"K:Eb": { up: 4, down: -8, move: 0 },
+		"K:E": { up: 5, down: -7, move: 1 },
+		"K:F": { up: 6, down: -6, move: 0 },
+		"K:Gb": { up: 7, down: -5, move: 1 },
+		"K:F#": { up: 7, down: -5, move: 0 },
+		"K:G": { up: 8, down: -4, move: 1 },
+		"K:Ab": { up: 9, down: -3, move: 0 },
+		"K:A": { up: 10, down: -2, move: 1 },
+		"K:Bb": { up: 11, down: -1, move: 0 },
+		"K:B": { up: 0, down: 0, move: 0 },
 	},
 };

src/pc/home/runtime.ts

@@ -241,16 +241,26 @@ export const getKeyStep = (key: string, oldKey: string, keyType: "inset" | "up"
 	} else {
 		step = Math.abs(_key.up) > Math.abs(_key.down) ? _key.down : _key.up;
 	}
-	return step;
+	return { step, move: _key.move };
 };
-export const moveNoteKey = (note: string, step: number) => {
-	var x = ABC_NOTE_DATA.indexOf(note);
+export const moveNoteKey = (note: string, moveData: { step: number; move: number }) => {
+	let x = -1
+	for(let i = 0; i < ABC_NOTE_DATA.length; i++) {
+		const notes = ABC_NOTE_DATA[i];
+		if (Array.isArray(notes) && notes.includes(note)) {
+			x = i
+			break;
+		}
+		if (note === notes) {
+			x = i
+			break;
+		}
+	}
+	console.log(note, moveData.step, x,);
 	if (x >= 0) {
-		const _note = ABC_NOTE_DATA[x + step];
-		console.log(note, step, x, _note);
+		const _note = ABC_NOTE_DATA[x + moveData.step];
 		if (Array.isArray(_note)) {
-			// return step > 0 ? _note[1] : _note[0];
-			return _note[1] ? _note[1] : _note[0];
+			return _note[moveData.move];
 		} else {
 			return _note ? _note : note;
 		}