fantasy/ui/canvas.js

import UI from "./ui.js";

class Canvas extends UI {
    constructor(width, height) {
        super(document.createElement("canvas"), width, height);
        this._ctx = this.element.getContext("2d");
    }
    clear() {
        this.resetStyle();
        this._ctx.clearRect(0, 0, this._width, this._height);
    }
    setFillColor(color) {
        this._ctx.fillStyle = color.rgba();
    }
    resetStyle() {
        this._ctx.fillStyle = "";
    }
    draw(shape) {
        this._ctx.fillStyle = shape.color.rgba();
        shape.draw(this._ctx);
        this.resetStyle();
    }
    setSize(width, height) {
        super.setSize(width, height);

        this.element.width = width;
        this.element.height = height;
    }
}

export default Canvas;