fix: AI items at playhead + context menu scrollable within viewport

- Revert AI item startTime to currentTime (playhead position)
- Context menu: maxHeight 60vh + overflow-y-auto, top clamped to
  window.innerHeight - 200 to prevent bottom clipping
- Same fix for both main session and sub-tab context menus
This commit is contained in:
2026-07-27 07:42:01 +07:00
parent 509da0c724
commit 993610ca37
2 changed files with 11 additions and 18 deletions
+8 -15
View File
@@ -13854,17 +13854,8 @@ const App = () => {
}; };
updatedTracks.push(targetTrack); updatedTracks.push(targetTrack);
} }
const itemStartTimeSec = (() => { // Place MIDI item at current playhead position
// Auto-align: place new AI tracks right after the last existing item const itemStartTimeSec = currentTime;
let maxEnd = 0;
updatedTracks.forEach(t => {
(t.midiItems || []).forEach(mi => {
const miEnd = (mi.startTime || 0) + (mi.duration || 0);
if (miEnd > maxEnd) maxEnd = miEnd;
});
});
return maxEnd > 0 ? maxEnd : 0;
})();
const newMidiItem = { const newMidiItem = {
id: 'item_ai_' + Date.now() + '_' + Math.random().toString(36).substr(2, 5), id: 'item_ai_' + Date.now() + '_' + Math.random().toString(36).substr(2, 5),
name: `${composition_title || 'AI Theme'} - ${aiTrack.track_name}`, name: `${composition_title || 'AI Theme'} - ${aiTrack.track_name}`,
@@ -16593,10 +16584,11 @@ const App = () => {
"data-lucide": "keyboard", "data-lucide": "keyboard",
className: "w-3 h-3 text-zinc-600" className: "w-3 h-3 text-zinc-600"
})), " Ctrl+Scroll: Playhead"))), contextMenu && (contextMenu.isSubTab ? /*#__PURE__*/React.createElement("div", { })), " Ctrl+Scroll: Playhead"))), contextMenu && (contextMenu.isSubTab ? /*#__PURE__*/React.createElement("div", {
className: "fixed z-[60] bg-[#2a2a2a] border border-zinc-700 rounded-lg shadow-2xl py-1 w-64", className: "fixed z-[60] bg-[#2a2a2a] border border-zinc-700 rounded-lg shadow-2xl py-1 w-64 overflow-y-auto",
style: { style: {
left: contextMenu.x, left: contextMenu.x,
top: contextMenu.y top: Math.min(contextMenu.y, window.innerHeight - 200),
maxHeight: '60vh'
}, },
onClick: e => e.stopPropagation() onClick: e => e.stopPropagation()
}, /*#__PURE__*/React.createElement("div", { }, /*#__PURE__*/React.createElement("div", {
@@ -16681,10 +16673,11 @@ const App = () => {
}, "Loop Selection 4 times"), /*#__PURE__*/React.createElement("span", { }, "Loop Selection 4 times"), /*#__PURE__*/React.createElement("span", {
className: "text-purple-400 text-xs font-semibold font-mono ml-auto" className: "text-purple-400 text-xs font-semibold font-mono ml-auto"
}, "Ctrl+L"))) : /*#__PURE__*/React.createElement("div", { }, "Ctrl+L"))) : /*#__PURE__*/React.createElement("div", {
className: "fixed z-[60] bg-[#2a2a2a] border border-zinc-700 rounded-lg shadow-2xl py-1 w-64", className: "fixed z-[60] bg-[#2a2a2a] border border-zinc-700 rounded-lg shadow-2xl py-1 w-64 overflow-y-auto",
style: { style: {
left: contextMenu.x, left: contextMenu.x,
top: contextMenu.y top: Math.min(contextMenu.y, window.innerHeight - 200),
maxHeight: '60vh'
}, },
onClick: e => e.stopPropagation() onClick: e => e.stopPropagation()
}, contextMenu.sectionId ? /*#__PURE__*/React.createElement("button", { }, contextMenu.sectionId ? /*#__PURE__*/React.createElement("button", {
File diff suppressed because one or more lines are too long