node_mode
Jake 2025-10-27 22:24:57 +08:00
parent 17deaaa873
commit 06633fa7b5
2 changed files with 24 additions and 28 deletions

View File

@ -312,22 +312,6 @@ export class CurveEditor {
} }
// getPositionAtTime(timeInSeconds, curve, valueToX, transform) {
// // Convert time to pixel X position
// const targetX = valueToX(timeInSeconds);
// // Transform control points
// const p0 = transform(curve.startPoint);
// const h0 = transform(curve.startPointHandle);
// const h1 = transform(curve.endPointHandle);
// const p1 = transform(curve.endPoint);
// const t = solveTForX(targetX, p0, h0, h1, p1);
// return cubicBezier(t, p0, h0, h1, p1);
// }
getMotorPositionAtTime(motorID, timeInFrames) { getMotorPositionAtTime(motorID, timeInFrames) {
if (this.curveSets[motorID] === undefined || this.curveSets[motorID].length === 0) { if (this.curveSets[motorID] === undefined || this.curveSets[motorID].length === 0) {
console.log("THIS"); console.log("THIS");
@ -636,20 +620,32 @@ export class CurveEditor {
this.isPanning = false; this.isPanning = false;
}); });
this.canvas.addEventListener('wheel', e => { this.canvas.addEventListener('wheel', e => {
e.preventDefault(); e.preventDefault();
const mouse = { x: e.offsetX, y: e.offsetY }; const mouse = { x: e.offsetX, y: e.offsetY };
const zoomFactor = e.deltaY < 0 ? 1.1 : 0.9; const zoomFactor = e.deltaY < 0 ? 1.1 : 0.9;
const before = this.inverseTransform(mouse); const before = this.inverseTransform(mouse);
this.scale *= zoomFactor;
const after = this.inverseTransform(mouse);
this.offset.x += (after.x - before.x) * this.scale; // Apply zoom based on modifier keys
this.offset.y += (after.y - before.y) * this.scale; if (e.ctrlKey && !e.altKey) {
this.scaleX *= zoomFactor;
} else if (e.altKey && !e.ctrlKey) {
this.scaleY *= zoomFactor;
} else {
// Default: uniform zoom
this.scaleX *= zoomFactor;
this.scaleY *= zoomFactor;
}
const after = this.inverseTransform(mouse);
this.offset.x += (after.x - before.x) * this.scaleX;
this.offset.y += (after.y - before.y) * this.scaleY;
this.draw();
});
this.draw();
});
this.canvas.addEventListener('dblclick', e => { this.canvas.addEventListener('dblclick', e => {
const mouse = this.inverseTransform({ x: e.offsetX, y: e.offsetY }); const mouse = this.inverseTransform({ x: e.offsetX, y: e.offsetY });

View File

@ -155,7 +155,7 @@
<div class="tab-pane fade show active" id="animation" role="tabpanel" aria-labelledby="animation-tab"> <div class="tab-pane fade show active" id="animation" role="tabpanel" aria-labelledby="animation-tab">
<canvas id="curveCanvas" width="900" height="600"></canvas> <canvas id="curveCanvas" width="1920" height="800"></canvas>
<!-- <div style="margin-top: 10px; text-align: center;"> <!-- <div style="margin-top: 10px; text-align: center;">
<input type="range" id="timeSlider" min="0" step="1" style="width: 80%;"> <input type="range" id="timeSlider" min="0" step="1" style="width: 80%;">
</div> --> </div> -->