boxes/js/graphics.mjs

55 lines
1.1 KiB
JavaScript

import * as graphics from "./graphics_core.mjs";
export * from "./graphics_core.mjs";
import { range, iter_2d } from "./utils/range.mjs";
import * as entity from "./entity.mjs";
const canvas = document.getElementById("canvas");
const canvas_context = canvas.getContext("2d");
graphics.set_size(canvas.width, canvas.height);
const SCALE = 81;
export function draw_tile (x, y) {
graphics.fill_rect(x * SCALE, y * SCALE, SCALE, SCALE);
}
function checkerboard (x, y) {
return ((x ^ y) & 1) === 0;
}
export function draw_floor (box_size) {
graphics.clear("#888");
graphics.set_color("#aaa");
iter_2d(range(0, box_size - 1), (x, y) => {
if (checkerboard(x, y)) draw_tile(x, y);
});
}
export function draw_world (box_size, get_tile) {
draw_floor(box_size);
iter_2d(range(0, box_size - 1), (x, y) => {
const tile = get_tile(x, y);
switch (tile.type) {
case "box": {
graphics.set_color("#ff0");
draw_tile(x, y);
break;
}
}
});
entity.for_each((entity, id) => {
graphics.set_color(entity.color);
draw_tile(entity.x, entity.y);
});
}
export function render () {
graphics.render(canvas_context);
}