fix(tcp): move vol/pan ruler wheel+dblclick handler to whole row

Scroll wheel giảm/tăng volume chỉ hoạt động trên input 4px; chuyển
onWheel+onDoubleClick lên row div (label+dB span cũng ăn), giữ bubbling
từ input. Áp dụng cho main TCP và sub-tab, cả app.jsx và precompiled.
This commit is contained in:
2026-08-19 12:29:11 +07:00
parent dbbcb85ffe
commit 8874e42596
3 changed files with 137 additions and 38 deletions
+36 -36
View File
@@ -30855,7 +30855,15 @@ STRICT CONSTRAINTS:
className: "flex flex-col gap-0.5 text-xs",
onClick: e => e.stopPropagation()
}, /*#__PURE__*/React.createElement("div", {
className: "flex items-center gap-1"
className: "flex items-center gap-1",
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('vol:' + track.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const nv = Math.max(-50, Math.min(7, (track.volumeDb ?? 0) + steps * 0.5));
updateTrackVolumeDb(track.id, nv);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackVolumeDb(track.id, 0); },
}, /*#__PURE__*/React.createElement("span", {
className: "w-8 text-right text-zinc-500 text-xs"
}, "Vol:"), /*#__PURE__*/React.createElement("input", {
@@ -30865,14 +30873,6 @@ STRICT CONSTRAINTS:
step: "0.5",
value: track.volumeDb ?? 0,
onChange: e => updateTrackVolumeDb(track.id, parseFloat(e.target.value)),
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('vol:' + track.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const nv = Math.max(-50, Math.min(7, (track.volumeDb ?? 0) + steps * 0.5));
updateTrackVolumeDb(track.id, nv);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackVolumeDb(track.id, 0); },
className: "flex-1 h-1 bg-zinc-700 rounded-lg appearance-none cursor-pointer accent-cyan-500",
style: {
height: '4px'
@@ -30880,7 +30880,15 @@ STRICT CONSTRAINTS:
}), /*#__PURE__*/React.createElement("span", {
className: "w-12 text-right font-mono text-zinc-300 text-xs"
}, track.volumeDb ?? 0, "dB")), /*#__PURE__*/React.createElement("div", {
className: "flex items-center gap-1"
className: "flex items-center gap-1",
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('pan:' + track.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const np = Math.max(-100, Math.min(100, (track.pan ?? 0) + steps * 5));
updateTrackPan(track.id, np);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackPan(track.id, 0); },
}, /*#__PURE__*/React.createElement("span", {
className: "w-8 text-right text-zinc-500 text-xs"
}, "Pan:"), /*#__PURE__*/React.createElement("input", {
@@ -30890,14 +30898,6 @@ STRICT CONSTRAINTS:
step: "1",
value: track.pan ?? 0,
onChange: e => updateTrackPan(track.id, parseInt(e.target.value)),
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('pan:' + track.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const np = Math.max(-100, Math.min(100, (track.pan ?? 0) + steps * 5));
updateTrackPan(track.id, np);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackPan(track.id, 0); },
className: "flex-1 h-1 bg-zinc-700 rounded-lg appearance-none cursor-pointer accent-purple-500",
style: {
height: '4px'
@@ -31411,7 +31411,15 @@ STRICT CONSTRAINTS:
}, "S"))), /*#__PURE__*/React.createElement("div", {
className: "flex flex-col gap-2.5 text-[14px] mb-3"
}, /*#__PURE__*/React.createElement("div", {
className: "flex items-center gap-1"
className: "flex items-center gap-1",
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('vol:' + vTrack.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const nv = Math.max(-50, Math.min(7, (vTrack.volumeDb ?? 0) + steps * 0.5));
updateTrackVolumeDb(vTrack.id, nv);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackVolumeDb(vTrack.id, 0); },
}, /*#__PURE__*/React.createElement("span", {
className: "w-10 text-right text-zinc-500 text-[14px]"
}, "Vol:"), /*#__PURE__*/React.createElement("input", {
@@ -31422,14 +31430,6 @@ STRICT CONSTRAINTS:
id: `tcp-vol-${st.id}`,
value: vTrack.volumeDb ?? 0,
onChange: e => updateTrackVolumeDb(vTrack.id, parseFloat(e.target.value)),
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('vol:' + vTrack.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const nv = Math.max(-50, Math.min(7, (vTrack.volumeDb ?? 0) + steps * 0.5));
updateTrackVolumeDb(vTrack.id, nv);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackVolumeDb(vTrack.id, 0); },
className: "flex-1 h-1 bg-zinc-700 rounded-lg appearance-none cursor-pointer accent-cyan-500",
style: {
height: '4px'
@@ -31438,7 +31438,15 @@ STRICT CONSTRAINTS:
className: "w-16 text-right font-mono text-zinc-300 text-[14px]",
id: `tcp-vol-label-${st.id}`
}, vTrack.volumeDb ?? 0, "dB")), /*#__PURE__*/React.createElement("div", {
className: "flex items-center gap-1"
className: "flex items-center gap-1",
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('pan:' + vTrack.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const np = Math.max(-100, Math.min(100, (vTrack.pan ?? 0) + steps * 5));
updateTrackPan(vTrack.id, np);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackPan(vTrack.id, 0); },
}, /*#__PURE__*/React.createElement("span", {
className: "w-10 text-right text-zinc-500 text-[14px]"
}, "Pan:"), /*#__PURE__*/React.createElement("input", {
@@ -31449,14 +31457,6 @@ STRICT CONSTRAINTS:
id: `tcp-pan-${st.id}`,
value: vTrack.pan ?? 0,
onChange: e => updateTrackPan(vTrack.id, parseInt(e.target.value)),
onWheel: e => {
e.preventDefault();
const steps = wheelSteps('pan:' + vTrack.id, e.deltaY, e.deltaMode, 100);
if (!steps) return;
const np = Math.max(-100, Math.min(100, (vTrack.pan ?? 0) + steps * 5));
updateTrackPan(vTrack.id, np);
},
onDoubleClick: e => { e.stopPropagation(); updateTrackPan(vTrack.id, 0); },
className: "flex-1 h-1 bg-zinc-700 rounded-lg appearance-none cursor-pointer accent-purple-500",
style: {
height: '4px'
File diff suppressed because one or more lines are too long