|
@@ -453,6 +453,8 @@ const state = reactive({
|
|
|
isSingleLine: false,
|
|
|
/** 首尾音符的间距 */
|
|
|
noteDistance: 0,
|
|
|
+ /** 一行谱运动模式,平滑移动、匀速移动 */
|
|
|
+ moveType: "smooth" as "smooth" | "uniform",
|
|
|
});
|
|
|
const browserInfo = browser();
|
|
|
let offset_duration = 0;
|
|
@@ -601,7 +603,11 @@ const handlePlaying = () => {
|
|
|
metronomeData.metro?.sound(currentTime);
|
|
|
// 一行谱,需要滚动小节
|
|
|
if (state.isSingleLine) {
|
|
|
- smoothMoveSvgDom();
|
|
|
+ if (state.moveType === 'smooth') {
|
|
|
+ smoothMoveSvgDom();
|
|
|
+ } else {
|
|
|
+ uniformMoveSvgDom();
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
};
|
|
@@ -1299,6 +1305,7 @@ export const createFixedCursor = () => {
|
|
|
// }
|
|
|
copyCursor.style.left = state.times[0]?.bbox?.x + state.times[0]?.bbox?.width / 2 - 1 + 'px';
|
|
|
copyCursor.style.height = parseFloat(copyCursor.style.height) * 3 + 'px';
|
|
|
+ copyCursor.style.opacity = state.moveType === 'uniform' ? 0 : 1;
|
|
|
// copyCursor.style.background = 'red';
|
|
|
copyCursor && scrollDom?.appendChild(copyCursor);
|
|
|
|
|
@@ -1401,4 +1408,14 @@ export const smoothMoveSvgDom = () => {
|
|
|
const distance = state.noteDistance * playProgress;
|
|
|
state.osdmScrollDom.scrollLeft = distance;
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+// 匀速平移
|
|
|
+export const uniformMoveSvgDom = () => {
|
|
|
+ const currentTime = getAudioCurrentTime();
|
|
|
+ if (currentTime <= state.fixtime) return;
|
|
|
+ if (currentTime > state.times.last()?.time) return;
|
|
|
+ const playProgress = (currentTime - state.fixtime) / state.times.last()?.time;
|
|
|
+ const distance = playProgress * state.noteDistance || 0;
|
|
|
+ state.osdmScrollDom.scrollLeft = distance;
|
|
|
}
|