1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
type Component = (ctx: CanvasRenderingContext2D) => void
function base(fill: string, stroke?: string, stroke_width?: number): Component {
return c => {
c.fillStyle = fill;
c.strokeStyle = stroke ?? "black";
c.lineWidth = stroke_width ?? 0.05
c.lineJoin = "miter"
c.lineCap = "square"
c.fillRect(-0.5, -0.5, 1,1)
if (stroke) c.strokeRect(-0.5 + c.lineWidth / 2, -0.5 + c.lineWidth / 2, 1 - c.lineWidth, 1 - c.lineWidth)
}
}
function circle(radius: number, fill: string, stroke?: string, stroke_width?: number): Component {
return c => {
c.fillStyle = fill;
c.strokeStyle = stroke ?? "black";
c.lineWidth = stroke_width ?? 0.05
c.beginPath()
c.arc(0.0, 0.0, radius, 0, Math.PI * 2)
if (stroke) c.stroke()
c.fill()
}
}
const table = [base("rgb(133, 76, 38)")];
const floor = [base("#333", "#222", 0.05)];
export const FALLBACK_TILE: Component[] = [base("#f0f")];
export const TILES: { [key: string]: Component[] } = {
"floor": floor,
"table": table,
"pan": [...table, circle(0.4, "#444", "#999")],
"flour_bag": [...floor, circle(0.5, "#fff", "#ddd")],
}
export const FALLBACK_ITEM: Component[] = [circle(0.3, "#f0f")];
export const ITEMS: { [key: string]: Component[] } = {
"raw-steak": [circle(0.3, "rgb(204, 55, 5)")],
"steak": [circle(0.3, "rgb(112, 34, 0)")],
}
|
