reactive controls
This commit is contained in:
parent
b100a75f7d
commit
d3750fde3c
2 changed files with 252 additions and 37 deletions
|
|
@ -6,6 +6,8 @@ import { TouchListener } from '../frontend/src/scripts/commands/touch-listener';
|
|||
import { JoinFormHandler } from '../frontend/src/scripts/join-form-handler';
|
||||
import { initializeOptions, options } from '../frontend/src/scripts/options-handler';
|
||||
import { loadStoredValue, saveStoredValue } from '../frontend/src/scripts/helper/storage';
|
||||
import { ChargeIndicator } from '../frontend/src/scripts/charge-indicator';
|
||||
import { localCharacterPredictor } from '../frontend/src/scripts/helper/prediction/local-character-predictor';
|
||||
|
||||
const { connect } = vi.hoisted(() => ({ connect: vi.fn() }));
|
||||
vi.mock('../frontend/node_modules/socket.io-client/build/esm-debug/index.js', () => ({
|
||||
|
|
@ -30,8 +32,16 @@ class Element extends EventTarget {
|
|||
public className = '';
|
||||
public checked = false;
|
||||
public disabled = false;
|
||||
public hidden = false;
|
||||
private attributes = new Map<string, string>();
|
||||
public onsubmit: ((event: Event) => void) | null = null;
|
||||
|
||||
public setAttribute(name: string, value: string) {
|
||||
this.attributes.set(name, value);
|
||||
}
|
||||
public getAttribute(name: string) {
|
||||
return this.attributes.get(name) ?? null;
|
||||
}
|
||||
public appendChild(child: Element) {
|
||||
child.remove();
|
||||
this.children.push(child);
|
||||
|
|
@ -81,6 +91,7 @@ let sockets: Socket[];
|
|||
|
||||
beforeEach(() => {
|
||||
vi.useFakeTimers();
|
||||
localCharacterPredictor.reset();
|
||||
windowTarget = new EventTarget();
|
||||
sockets = [];
|
||||
vi.stubGlobal('window', windowTarget);
|
||||
|
|
@ -103,6 +114,7 @@ afterEach(() => {
|
|||
vi.useRealTimers();
|
||||
vi.unstubAllGlobals();
|
||||
vi.clearAllMocks();
|
||||
vi.restoreAllMocks();
|
||||
});
|
||||
|
||||
const chooser = () => {
|
||||
|
|
@ -194,10 +206,16 @@ const touchControls = () => {
|
|||
const canvas = new Element();
|
||||
const overlay = new Element();
|
||||
const send = vi.fn();
|
||||
const character = {
|
||||
health: 100,
|
||||
bodyCenter: [0, 0],
|
||||
facingDirection: [1, 0],
|
||||
strengthFraction: 1,
|
||||
};
|
||||
const game = {
|
||||
displayToWorldCoordinates: (position: number[]) => position,
|
||||
gameObjects: {
|
||||
localPlayer: { bodyCenter: [0, 0], facingDirection: [1, 0], strengthFraction: 1 },
|
||||
localPlayer: character as typeof character | undefined,
|
||||
},
|
||||
};
|
||||
const listener = new TouchListener(
|
||||
|
|
@ -207,9 +225,86 @@ const touchControls = () => {
|
|||
send,
|
||||
);
|
||||
listener.update();
|
||||
return { canvas, overlay, send, listener, fire: overlay.children[0] };
|
||||
return {
|
||||
canvas,
|
||||
overlay,
|
||||
send,
|
||||
listener,
|
||||
game,
|
||||
character,
|
||||
fire: overlay.children[0],
|
||||
leap: overlay.children[1],
|
||||
};
|
||||
};
|
||||
|
||||
describe('touch action availability', () => {
|
||||
it('cancels a held shot on death and requires a fresh press after respawn', () => {
|
||||
const { fire, send, listener, game, character } = touchControls();
|
||||
touchEvent(fire, 'touchstart', [touch(1)]);
|
||||
touchEvent(fire, 'touchmove', [touch(1, 100, 50)]);
|
||||
expect(fire.children[1].style.opacity).toBe('1');
|
||||
|
||||
character.health = 0;
|
||||
listener.update();
|
||||
expect(fire.getAttribute('aria-disabled')).toBe('true');
|
||||
expect(fire.children[1].style.opacity).toBe('0');
|
||||
expect(ChargeIndicator.end).toHaveBeenCalled();
|
||||
vi.mocked(ChargeIndicator.begin).mockClear();
|
||||
touchEvent(fire, 'touchstart', [touch(2)]);
|
||||
touchEvent(fire, 'touchend', [touch(2)], []);
|
||||
expect(ChargeIndicator.begin).not.toHaveBeenCalled();
|
||||
expect(send).not.toHaveBeenCalled();
|
||||
|
||||
game.gameObjects.localPlayer = undefined;
|
||||
listener.update();
|
||||
touchEvent(fire, 'touchstart', [touch(3)]);
|
||||
touchEvent(fire, 'touchend', [touch(3)], []);
|
||||
expect(send).not.toHaveBeenCalled();
|
||||
|
||||
game.gameObjects.localPlayer = { ...character, health: 100 };
|
||||
listener.update();
|
||||
expect(fire.getAttribute('aria-disabled')).toBe('false');
|
||||
touchEvent(fire, 'touchend', [touch(1)], []);
|
||||
expect(send).not.toHaveBeenCalled();
|
||||
touchEvent(fire, 'touchstart', [touch(4)]);
|
||||
touchEvent(fire, 'touchend', [touch(4)], []);
|
||||
expect(send).toHaveBeenCalledTimes(1);
|
||||
listener.destroy();
|
||||
});
|
||||
|
||||
it('rejects a shot released after death before the controls update', () => {
|
||||
const { fire, send, listener, character } = touchControls();
|
||||
touchEvent(fire, 'touchstart', [touch(1)]);
|
||||
character.health = 0;
|
||||
touchEvent(fire, 'touchend', [touch(1)], []);
|
||||
expect(send).not.toHaveBeenCalled();
|
||||
listener.destroy();
|
||||
});
|
||||
|
||||
it('only shows and accepts jumps while the living player can leap', () => {
|
||||
const canLeap = vi.spyOn(localCharacterPredictor, 'canLeap', 'get');
|
||||
canLeap.mockReturnValue(false);
|
||||
const { leap, send, listener, character } = touchControls();
|
||||
expect(leap.hidden).toBe(true);
|
||||
touchEvent(leap, 'touchstart', [touch(1)]);
|
||||
expect(send).not.toHaveBeenCalled();
|
||||
|
||||
canLeap.mockReturnValue(true);
|
||||
listener.update();
|
||||
expect(leap.hidden).toBe(false);
|
||||
touchEvent(leap, 'touchstart', [touch(2)]);
|
||||
expect(send.mock.lastCall?.[0].constructor.name).toBe('LeapActionCommand');
|
||||
expect(leap.hidden).toBe(true);
|
||||
|
||||
character.health = 0;
|
||||
listener.update();
|
||||
expect(leap.hidden).toBe(true);
|
||||
touchEvent(leap, 'touchstart', [touch(3)]);
|
||||
expect(send).toHaveBeenCalledTimes(1);
|
||||
listener.destroy();
|
||||
});
|
||||
});
|
||||
|
||||
describe('touch ownership', () => {
|
||||
it('keeps the first canvas gesture when a second finger lands before dragging', () => {
|
||||
const { canvas, send, listener } = touchControls();
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import { describe, it, expect } from 'vitest';
|
||||
import { settings } from '../shared/src/settings';
|
||||
import {
|
||||
LocalCharacterPredictor,
|
||||
setFrameTimeMs,
|
||||
|
|
@ -313,3 +314,84 @@ describe('leap prediction', () => {
|
|||
expect(leapHeight(0.2, true)).toEqual(leapHeight(0.2, false));
|
||||
});
|
||||
});
|
||||
|
||||
describe('leap availability', () => {
|
||||
const prepare = (
|
||||
cooldown = 0,
|
||||
strength = settings.leapStrengthCost,
|
||||
groundPlanetId: number | null = ground.id,
|
||||
) => {
|
||||
const predictor = new LocalCharacterPredictor();
|
||||
setFrameTimeMs(1000);
|
||||
const pose = poseAt(0, 900);
|
||||
predictor.acknowledge(
|
||||
1000,
|
||||
{
|
||||
...movementState(),
|
||||
groundPlanetId,
|
||||
secondsSinceOnSurface: 0,
|
||||
leapCooldownRemaining: cooldown,
|
||||
} as never,
|
||||
-Infinity,
|
||||
);
|
||||
predictor.setStrength(strength);
|
||||
predictor.setAuthoritative(
|
||||
pose.head as never,
|
||||
pose.leftFoot as never,
|
||||
pose.rightFoot as never,
|
||||
);
|
||||
predictor.update([ground] as never);
|
||||
return { predictor, pose };
|
||||
};
|
||||
|
||||
it('requires a planet, sufficient strength, and an expired cooldown', () => {
|
||||
expect(new LocalCharacterPredictor().canLeap).toBe(false);
|
||||
expect(prepare().predictor.canLeap).toBe(true);
|
||||
expect(prepare(0.2).predictor.canLeap).toBe(false);
|
||||
expect(prepare(0, settings.leapStrengthCost - 1).predictor.canLeap).toBe(false);
|
||||
expect(prepare(0, settings.playerMaxStrength, null).predictor.canLeap).toBe(false);
|
||||
});
|
||||
|
||||
it('becomes available as the predicted cooldown and strength recover', () => {
|
||||
const { predictor } = prepare(0.02, settings.leapStrengthCost - 1);
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
setFrameTimeMs(1030);
|
||||
predictor.update([ground] as never);
|
||||
expect(predictor.canLeap).toBe(true);
|
||||
});
|
||||
|
||||
it('disables immediately after a leap and stays unavailable in flight', () => {
|
||||
const { predictor } = prepare();
|
||||
predictor.recordLeap();
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
setFrameTimeMs(1002);
|
||||
predictor.update([ground] as never);
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
setFrameTimeMs(1380);
|
||||
predictor.update([ground] as never);
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
});
|
||||
|
||||
it('clears availability on death, reset, spawn animation, and game end', () => {
|
||||
const { predictor, pose } = prepare();
|
||||
predictor.setAlive(false);
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
predictor.update([ground] as never);
|
||||
predictor.setAlive(true);
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
predictor.update([ground] as never);
|
||||
expect(predictor.canLeap).toBe(true);
|
||||
|
||||
predictor.enabled = false;
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
predictor.enabled = true;
|
||||
predictor.setAuthoritative(
|
||||
{ ...pose.head, radius: 10 } as never,
|
||||
pose.leftFoot as never,
|
||||
pose.rightFoot as never,
|
||||
);
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
predictor.reset();
|
||||
expect(predictor.canLeap).toBe(false);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue