pihkaal/pihkaal-me
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(nds): use deltaTime in frame based-motion

Browse Source
This commit is contained in:
Stevan
2026-02-13 17:10:32 +01:00
parent 555ecf8d80
commit f674404ff2
4 changed files with 59 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
app/components/Settings/BottomScreen/Menus/TouchScreen/TapTap.vue
View File

@@ -12,16 +12,17 @@ const { onRender, onClick } = useScreen();
const BAR_HEIGHT = 24;
const MAX_RADIUS = 27;
const MIN_RADIUS = 3;
const BASE_SHRINK_SPEED = 0.09;
const MAX_SHRINK_SPEED = 0.14;
const BASE_SPAWN_INTERVAL = 90;
const MIN_SPAWN_INTERVAL = 45;
const BASE_SHRINK_SPEED = 0.18;
const MAX_SHRINK_SPEED = 0.28;
const BASE_SPAWN_INTERVAL = 45;
const MIN_SPAWN_INTERVAL = 23;
const DIFFICULTY_SCORE_CAP = 100;
const RING_STROKE_WIDTH = 5;
const RING_EXPAND_SPEED = 0.3;
const RING_FADE_SPEED = 0.05;
const RING_EXPAND_SPEED = 0.6;
const RING_FADE_SPEED = 0.1;
const MAX_LIVES = 3;
const CROSSHAIR_MOVE_SPEED = 5;
const CROSSHAIR_MOVE_SPEED = 10;
const FRAME_TIME = 1000 / 60;
const getDifficulty = () => {
const progress = Math.min(score / DIFFICULTY_SCORE_CAP, 1);
@@ -120,7 +121,7 @@ const animateIntro = async () => {
const animateOutro = async () => {
isAnimating.value = true;
targetX = 0;
targetY = LOGICAL_HEIGHT * 2 - 20;
targetY = LOGICAL_HEIGHT;
await gsap
.timeline({
@@ -200,12 +201,12 @@ const handleActivateA = async () => {
}
};
const moveTowards = (current: number, target: number) => {
const moveTowards = (current: number, target: number, dt: number) => {
if (current === target) return current;
const direction = Math.sign(target - current);
return (
current +
direction * Math.min(CROSSHAIR_MOVE_SPEED, Math.abs(target - current))
direction * Math.min(CROSSHAIR_MOVE_SPEED * dt, Math.abs(target - current))
);
};
@@ -303,15 +304,17 @@ onClick((mx, my) => {
}
});
onRender((ctx) => {
onRender((ctx, deltaTime) => {
const dt = deltaTime / FRAME_TIME;
// update crosshair position in all modes except paused
if (state.value !== "paused") {
if (horizontalFirst) {
if (x !== targetX) x = moveTowards(x, targetX);
else y = moveTowards(y, targetY);
if (x !== targetX) x = moveTowards(x, targetX, dt);
else y = moveTowards(y, targetY, dt);
} else {
if (y !== targetY) y = moveTowards(y, targetY);
else x = moveTowards(x, targetX);
if (y !== targetY) y = moveTowards(y, targetY, dt);
else x = moveTowards(x, targetX, dt);
}
}
@@ -320,15 +323,15 @@ onRender((ctx) => {
const { shrinkSpeed, spawnInterval } = getDifficulty();
// spawn circles
spawnTimer++;
if (spawnTimer >= spawnInterval) {
spawnTimer += deltaTime;
if (spawnTimer >= spawnInterval * FRAME_TIME) {
spawnCircle();
spawnTimer = 0;
}
// update circles and rings
circles = circles.filter((circle) => {
circle.radius -= shrinkSpeed;
circle.radius -= shrinkSpeed * dt;
if (circle.radius < MIN_RADIUS) {
lives--;
if (lives <= 0) {
@@ -341,8 +344,8 @@ onRender((ctx) => {
});
rings = rings.filter((ring) => {
ring.radius += RING_EXPAND_SPEED;
ring.alpha -= RING_FADE_SPEED;
ring.radius += RING_EXPAND_SPEED * dt;
ring.alpha -= RING_FADE_SPEED * dt;
return ring.alpha > 0;
});
}