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()
    }
}
function cross(size: number, stroke: string, stroke_width = 0.05): Component {
    return c => {
        c.strokeStyle = stroke
        c.lineWidth = stroke_width
        c.lineCap = "round"
        c.beginPath()
        c.moveTo(-size, -size)
        c.lineTo(size, size)
        c.moveTo(size, -size)
        c.lineTo(-size, size)
        c.stroke()
    }
}

const plate = [circle(0.4, "#b6b6b6", "#f7f7f7", 0.02)];

export const FALLBACK_ITEM: Component[] = [circle(0.3, "#f0f")];
export const ITEMS: { [key: string]: Component[] } = {
    "raw-steak": [circle(0.3, "#cc3705")],
    "steak": [circle(0.3, "#702200")],
    "flour": [circle(0.3, "#d8c9c2")],
    "dough": [circle(0.3, "#b38d7d")],
    "tomato": [circle(0.3, "#d63838")],
    "dirty-plate": [circle(0.4, "#947a6f", "#d3a187", 0.02)],
    "plate": plate,
    "steak-meal": [...plate, circle(0.3, "#702200")],
}

const table = [base("rgb(133, 76, 38)")];
const floor = [base("#333", "#222", 0.05)];
const spawn = (i: string) => [base("#60701e", "#b9da37", 0.05), ...ITEMS[i]];

export const FALLBACK_TILE: Component[] = [base("#f0f")];
export const TILES: { [key: string]: Component[] } = {
    "floor": floor,
    "table": table,
    "counter": [base("rgb(182, 172, 164)")],
    "trash": [...floor, circle(0.4, "rgb(20, 20, 20)"), cross(0.3, "rgb(90, 36, 36)")],
    "sink": [base("rgb(131, 129, 161)", "rgb(177, 174, 226)", 0.2)],
    "pan": [...table, circle(0.4, "#444", "#999")],
    "flour-spawn": spawn("flour"),
    "dirty-plate-spawn": spawn("dirty-plate"),
    "raw-steak-spawn": spawn("raw-steak"),
    "tomato-spawn": spawn("tomato"),
}