react-simple-game-engine/lib/ui-components/sketch.js

[WIP] not able to use in currently. <!-- Document cumming soon... -->

import { jsx as _jsx } from "react/jsx-runtime";
import { useEffect, useRef } from "react";
import { P5 } from "../classes/p5";
import { SimpleCamera } from "../classes/simple-camera";
export function Sketch(_a) {
    var onSetup = _a.onSetup, onDraw = _a.onDraw, onMouseMove = _a.onMouseMove, onMousePressed = _a.onMousePressed, onMouseRelease = _a.onMouseRelease, onPreload = _a.onPreload, scaler = _a.scaler;
    var refContainer = useRef(null);
    useEffect(function () {
        var sketch = function (s) {
            var camera = new SimpleCamera();
            s.simpleCamera = camera;
            s.preload = function () {
                window.Renderer = s;
                window.Renderer.scaler = scaler;
                return onPreload === null || onPreload === void 0 ? void 0 : onPreload();
            };
            s.setup = function () {
                s.createCanvas(scaler.canvasSize.width, scaler.canvasSize.height).parent(refContainer.current);
                onSetup(camera);
            };
            s.mouseMoved = onMouseMove;
            s.mousePressed = onMousePressed;
            s.mouseReleased = onMouseRelease;
            s.draw = function () {
                s.imageMode(s.CENTER);
                s.rectMode(s.CENTER);
                onDraw();
            };
        };
        var p5 = new P5(sketch);
        return function () {
            p5.remove();
        };
        // eslint-disable-next-line
    }, []);
    return (_jsx("div", { style: {
            height: scaler.canvasSize.height,
            width: scaler.canvasSize.width,
        }, ref: refContainer }));
}