fix: sync bar ruler redraw during drag via canvasRedrawCount
This commit is contained in:
+15
-4
@@ -1196,7 +1196,8 @@ const TempoTrackLane = ({
|
||||
onPlayheadSet,
|
||||
snapValue,
|
||||
onRulerMouseDown,
|
||||
scrollLeft
|
||||
scrollLeft,
|
||||
canvasRedrawCount
|
||||
}) => {
|
||||
const canvasRef = useRef(null);
|
||||
const drawWidth = Math.min(timelineWidth, viewportWidth);
|
||||
@@ -1286,7 +1287,7 @@ const TempoTrackLane = ({
|
||||
ctx.font = 'bold 10px Inter, sans-serif';
|
||||
ctx.textAlign = 'right';
|
||||
ctx.fillText(`${bpm} BPM`, drawWidth - 6, 12);
|
||||
}, [bpm, zoom, timelineWidth, viewportWidth, snapValue, scrollLeft]);
|
||||
}, [bpm, zoom, timelineWidth, viewportWidth, snapValue, scrollLeft, canvasRedrawCount]);
|
||||
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
||||
key: "virtual-spacer-tempo",
|
||||
style: {
|
||||
@@ -10222,8 +10223,10 @@ const App = () => {
|
||||
const followMargin = 120;
|
||||
if (itemPx > scrollLeft + rect.width - followMargin) {
|
||||
wrapper.scrollLeft = itemPx - rect.width + followMargin;
|
||||
setCanvasRedrawCount(n => n + 1);
|
||||
} else if (itemPx < scrollLeft + followMargin) {
|
||||
wrapper.scrollLeft = Math.max(0, itemPx - followMargin);
|
||||
setCanvasRedrawCount(n => n + 1);
|
||||
}
|
||||
const targetTrackId = hoveredTrackIdRef.current || drag.trackId;
|
||||
updateActiveTracks(prev => prev.map(t => {
|
||||
@@ -10386,8 +10389,10 @@ const App = () => {
|
||||
const followMargin = 120;
|
||||
if (itemPx > scrollLeft + rect.width - followMargin) {
|
||||
wrapper.scrollLeft = itemPx - rect.width + followMargin;
|
||||
setCanvasRedrawCount(n => n + 1);
|
||||
} else if (itemPx < scrollLeft + followMargin) {
|
||||
wrapper.scrollLeft = Math.max(0, itemPx - followMargin);
|
||||
setCanvasRedrawCount(n => n + 1);
|
||||
}
|
||||
const targetTrackId = hoveredTrackIdRef.current || drag.trackId;
|
||||
updateActiveTracks(prev => {
|
||||
@@ -10481,8 +10486,10 @@ const App = () => {
|
||||
const followMargin = 120;
|
||||
if (edgePx > scrollLeft + rect.width - followMargin) {
|
||||
wrapper.scrollLeft = edgePx - rect.width + followMargin;
|
||||
setCanvasRedrawCount(n => n + 1);
|
||||
} else if (edgePx < scrollLeft + followMargin) {
|
||||
wrapper.scrollLeft = Math.max(0, edgePx - followMargin);
|
||||
setCanvasRedrawCount(n => n + 1);
|
||||
}
|
||||
};
|
||||
const handleMouseUp = () => {
|
||||
@@ -14875,7 +14882,8 @@ const App = () => {
|
||||
onPlayheadSet: handlePlayheadSet,
|
||||
snapValue: snapValue,
|
||||
onRulerMouseDown: handleRulerMouseDown,
|
||||
scrollLeft: scrollLeft
|
||||
scrollLeft: scrollLeft,
|
||||
canvasRedrawCount: canvasRedrawCount
|
||||
}))), /*#__PURE__*/React.createElement("div", {
|
||||
className: "flex-1 flex flex-col divide-y divide-[#141414] relative bg-[#111111] min-h-full"
|
||||
}, activeTracks.map((track, idx) => {
|
||||
@@ -15386,8 +15394,11 @@ const App = () => {
|
||||
bpm: parseInt(bpm) || 120,
|
||||
zoom: zoom,
|
||||
timelineWidth: subTabTimelineWidth,
|
||||
viewportWidth: viewportWidth,
|
||||
onPlayheadSet: setCurrentTime,
|
||||
snapValue: snapValue
|
||||
snapValue: snapValue,
|
||||
scrollLeft: scrollLeft,
|
||||
canvasRedrawCount: canvasRedrawCount
|
||||
}))), /*#__PURE__*/React.createElement("div", {
|
||||
className: "flex-1 flex flex-col relative bg-[#111111] min-h-full"
|
||||
}, vTrack && /*#__PURE__*/React.createElement("div", {
|
||||
|
||||
Reference in New Issue
Block a user