feat: auto-follow dragged item in viewport for clip/section/MIDI drag and resize

This commit is contained in:
2026-07-25 09:21:19 +07:00
parent aa63a310fc
commit f1057ab7f2
2 changed files with 26 additions and 0 deletions
+21
View File
@@ -10218,6 +10218,13 @@ const App = () => {
const marginBar = maxDurationRef.current - secPerBar;
const clampedStart = Math.min(rawStart, marginBar);
const newStart = snapTime(clampedStart, snapValueRef.current, bpmRef.current);
const itemPx = newStart * zoom;
const followMargin = 120;
if (itemPx > scrollLeft + rect.width - followMargin) {
wrapper.scrollLeft = itemPx - rect.width + followMargin;
} else if (itemPx < scrollLeft + followMargin) {
wrapper.scrollLeft = Math.max(0, itemPx - followMargin);
}
const targetTrackId = hoveredTrackIdRef.current || drag.trackId;
updateActiveTracks(prev => prev.map(t => {
// Clear the clip from its previous track if it moved to a new track
@@ -10375,6 +10382,13 @@ const App = () => {
const secondsPerBar = beatSec * 4;
const marginBar = maxDurationRef.current - secondsPerBar;
const newStart = Math.max(beatSec, Math.min(time - drag.clickOffset, marginBar));
const itemPx = newStart * zoom;
const followMargin = 120;
if (itemPx > scrollLeft + rect.width - followMargin) {
wrapper.scrollLeft = itemPx - rect.width + followMargin;
} else if (itemPx < scrollLeft + followMargin) {
wrapper.scrollLeft = Math.max(0, itemPx - followMargin);
}
const targetTrackId = hoveredTrackIdRef.current || drag.trackId;
updateActiveTracks(prev => {
let movedItem = null;
@@ -10463,6 +10477,13 @@ const App = () => {
? { ...t, sections: items }
: { ...t, midiItems: items };
}));
const edgePx = (resize.side === 'left' ? Math.max(0, time) : time) * zoom;
const followMargin = 120;
if (edgePx > scrollLeft + rect.width - followMargin) {
wrapper.scrollLeft = edgePx - rect.width + followMargin;
} else if (edgePx < scrollLeft + followMargin) {
wrapper.scrollLeft = Math.max(0, edgePx - followMargin);
}
};
const handleMouseUp = () => {
const resize = resizedSectionItemRef.current;