122 lines
4.4 KiB
TypeScript
122 lines
4.4 KiB
TypeScript
import { describe, expect, test } from "bun:test";
|
|
import type { Dispatch } from "@commands/dispatcher";
|
|
import { commandIds } from "@commands/ids";
|
|
import type { PointerInputEvent } from "./pointer";
|
|
import { createViewportPanInputController } from "./viewport-pan";
|
|
|
|
const ignoredState = undefined as never;
|
|
|
|
describe("viewport pan store integration", () => {
|
|
test("space key input updates actual tool mode", () => {
|
|
const store = createInputStore();
|
|
const controller = createController(store);
|
|
|
|
expect(controller.keyDown(keyEvent("Space"))).toBe(true);
|
|
expect(store.state.tools.interactionMode).toEqual({ type: "temporary-pan", previousTool: "select" });
|
|
|
|
expect(controller.keyUp(keyEvent("Space"))).toBe(true);
|
|
expect(store.state.tools.interactionMode).toEqual({ type: "tool", tool: "select" });
|
|
});
|
|
|
|
test("left-drag only pans while temporary pan is active", () => {
|
|
const store = createInputStore();
|
|
const controller = createController(store);
|
|
|
|
expect(controller.pointerDown(pointerEvent({ buttons: 1, position: { x: 0, y: 0 } }))).toBe(false);
|
|
expect(controller.pointerMove(pointerEvent({ buttons: 1, position: { x: 10, y: 0 } }))).toBe(false);
|
|
expect(store.state.viewport.center).toEqual({ x: 0, y: 0 });
|
|
|
|
store.dispatch(commandIds.toolEnterTemporaryPan, undefined);
|
|
|
|
expect(controller.pointerDown(pointerEvent({ buttons: 1, position: { x: 0, y: 0 } }))).toBe(true);
|
|
expect(controller.pointerMove(pointerEvent({ buttons: 1, position: { x: 10, y: 0 } }))).toBe(true);
|
|
expect(store.state.viewport.center).toEqual({ x: -10, y: 0 });
|
|
});
|
|
|
|
test("left-drag pans while pan tool is active", () => {
|
|
const store = createInputStore();
|
|
const controller = createController(store);
|
|
|
|
store.dispatch(commandIds.toolSetActive, { tool: "pan" });
|
|
|
|
expect(controller.pointerDown(pointerEvent({ buttons: 1, position: { x: 0, y: 0 } }))).toBe(true);
|
|
expect(controller.pointerMove(pointerEvent({ buttons: 1, position: { x: 4, y: -2 } }))).toBe(true);
|
|
expect(store.state.viewport.center).toEqual({ x: -4, y: 2 });
|
|
});
|
|
});
|
|
|
|
type InputToolId = "select" | "brush" | "eraser" | "pan";
|
|
|
|
type InputStore = ReturnType<typeof createInputStore>;
|
|
|
|
function createInputStore() {
|
|
const store = {
|
|
state: {
|
|
viewport: { center: { x: 0, y: 0 }, zoom: 1 },
|
|
tools: {
|
|
activeTool: "select" as InputToolId,
|
|
interactionMode: { type: "tool" as const, tool: "select" as InputToolId },
|
|
},
|
|
},
|
|
dispatch: ((commandId, payload) => {
|
|
switch (commandId) {
|
|
case commandIds.toolSetActive:
|
|
store.state.tools.activeTool = payload.tool;
|
|
store.state.tools.interactionMode = { type: "tool", tool: payload.tool };
|
|
break;
|
|
case commandIds.toolEnterTemporaryPan:
|
|
store.state.tools.interactionMode = { type: "temporary-pan", previousTool: store.state.tools.activeTool };
|
|
break;
|
|
case commandIds.toolExitTemporaryPan: {
|
|
const mode = store.state.tools.interactionMode;
|
|
if (mode.type === "temporary-pan") {
|
|
store.state.tools.activeTool = mode.previousTool;
|
|
store.state.tools.interactionMode = { type: "tool", tool: mode.previousTool };
|
|
}
|
|
break;
|
|
}
|
|
case commandIds.viewportPan:
|
|
store.state.viewport.center = {
|
|
x: store.state.viewport.center.x + payload.delta.x,
|
|
y: store.state.viewport.center.y + payload.delta.y,
|
|
};
|
|
break;
|
|
}
|
|
return ignoredState;
|
|
}) as Dispatch,
|
|
};
|
|
|
|
return store;
|
|
}
|
|
|
|
function createController(store: InputStore) {
|
|
return createViewportPanInputController({
|
|
globalKeyConsumer: () => false,
|
|
globalPointerConsumer: () => false,
|
|
getCurrentZoom: () => store.state.viewport.zoom,
|
|
isPanMode: () => {
|
|
const mode = store.state.tools.interactionMode;
|
|
return mode.type === "temporary-pan" || (mode.type === "tool" && mode.tool === "pan");
|
|
},
|
|
dispatch: store.dispatch,
|
|
});
|
|
}
|
|
|
|
function keyEvent(code: string) {
|
|
return { key: code === "Space" ? " " : code, code, altKey: false, ctrlKey: false, metaKey: false, shiftKey: false };
|
|
}
|
|
|
|
function pointerEvent(overrides: Partial<PointerInputEvent>): PointerInputEvent {
|
|
return {
|
|
pointerId: 1,
|
|
pointerType: "mouse",
|
|
position: { x: 0, y: 0 },
|
|
buttons: 0,
|
|
altKey: false,
|
|
ctrlKey: false,
|
|
metaKey: false,
|
|
shiftKey: false,
|
|
...overrides,
|
|
};
|
|
}
|