forked from eros/curltastic
refactor(frontend): introduce DrawableStone interface and use in renderer
Replace the ad-hoc StoneState | {...} union in drawStone/draw with a named DrawableStone type.
Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent)
Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
parent
23a0cafe18
commit
ef5349dfe3
@ -26,6 +26,13 @@ export interface StoneState {
|
|||||||
active: boolean
|
active: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface DrawableStone {
|
||||||
|
x: number
|
||||||
|
y: number
|
||||||
|
rotation: number
|
||||||
|
team: Team
|
||||||
|
}
|
||||||
|
|
||||||
export interface ClientThrowMessage {
|
export interface ClientThrowMessage {
|
||||||
type: 'throw'
|
type: 'throw'
|
||||||
broom_x: number
|
broom_x: number
|
||||||
|
|||||||
@ -9,8 +9,8 @@ import {
|
|||||||
STONE_RADIUS,
|
STONE_RADIUS,
|
||||||
TWELVE_FT_RADIUS,
|
TWELVE_FT_RADIUS,
|
||||||
HOUSE_CENTER,
|
HOUSE_CENTER,
|
||||||
|
type DrawableStone,
|
||||||
type StoneState,
|
type StoneState,
|
||||||
type Team,
|
|
||||||
} from './protocol'
|
} from './protocol'
|
||||||
|
|
||||||
export interface Renderer {
|
export interface Renderer {
|
||||||
@ -23,7 +23,7 @@ export interface Renderer {
|
|||||||
stones: StoneState[]
|
stones: StoneState[]
|
||||||
broom: { x: number; y: number } | null
|
broom: { x: number; y: number } | null
|
||||||
animating: boolean
|
animating: boolean
|
||||||
activeStonePos: { x: number; y: number; rotation: number; team: Team } | null
|
activeStonePos: DrawableStone | null
|
||||||
}) => void
|
}) => void
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -102,7 +102,7 @@ export function createRenderer(canvas: HTMLCanvasElement): Renderer {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const drawStone = (stone: StoneState | { x: number; y: number; rotation: number; team: Team }) => {
|
const drawStone = (stone: DrawableStone) => {
|
||||||
const c = worldToScreen(stone.x, stone.y)
|
const c = worldToScreen(stone.x, stone.y)
|
||||||
const r = STONE_RADIUS * scale()
|
const r = STONE_RADIUS * scale()
|
||||||
const color = stone.team === 'red' ? '#d93025' : '#f9ab00'
|
const color = stone.team === 'red' ? '#d93025' : '#f9ab00'
|
||||||
@ -129,7 +129,7 @@ export function createRenderer(canvas: HTMLCanvasElement): Renderer {
|
|||||||
stones: StoneState[]
|
stones: StoneState[]
|
||||||
broom: { x: number; y: number } | null
|
broom: { x: number; y: number } | null
|
||||||
animating: boolean
|
animating: boolean
|
||||||
activeStonePos: { x: number; y: number; rotation: number; team: Team } | null
|
activeStonePos: DrawableStone | null
|
||||||
}) => {
|
}) => {
|
||||||
ctx.clearRect(0, 0, window.innerWidth, window.innerHeight)
|
ctx.clearRect(0, 0, window.innerWidth, window.innerHeight)
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user