sdf
parent
17deaaa873
commit
06633fa7b5
|
|
@ -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");
|
||||||
|
|
@ -642,14 +626,26 @@ export class CurveEditor {
|
||||||
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;
|
|
||||||
|
// Apply zoom based on modifier keys
|
||||||
|
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);
|
const after = this.inverseTransform(mouse);
|
||||||
|
|
||||||
this.offset.x += (after.x - before.x) * this.scale;
|
this.offset.x += (after.x - before.x) * this.scaleX;
|
||||||
this.offset.y += (after.y - before.y) * this.scale;
|
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 });
|
||||||
|
|
|
||||||
|
|
@ -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> -->
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue