teetopia/client/js/viewer/SheetView.js

import { FiniteStateMachine } from "../libraries/FiniteStateMachine.js";
import { SpritesheetAtlas } from "../libraries/SpritesheetAtlas.js";

import { SheetTileSelectorState } from "./states/SheetTileSelectorState.js";

export class SheetView {
    constructor() {
        this.stateMachine = new FiniteStateMachine();
        this.characterAtlas = new SpritesheetAtlas()
        this.worldAtlas = new SpritesheetAtlas()
        this.indoorAtlas = new SpritesheetAtlas()
        this.cityAtlas = new SpritesheetAtlas()
        this.dungeonAtlas = new SpritesheetAtlas()


        this.stateMachine.registerState("sheet", new SheetTileSelectorState(this))
    }
    async init() {
        let assetLoading = []
        assetLoading.push(this.characterAtlas.load("./assets/roguelikeChar_transparent.png", {width: 16, height: 16, margin: 1}))
        assetLoading.push(this.worldAtlas.load("./assets/roguelikeSheet_transparent.png", {width: 16, height: 16, margin: 1}))
        assetLoading.push(this.indoorAtlas.load("./assets/roguelikeIndoor_transparent.png", {width: 16, height: 16, margin: 1}))
        assetLoading.push(this.cityAtlas.load("./assets/roguelikeCity_transparent.png", {width: 16, height: 16, margin: 1}))
        assetLoading.push(this.dungeonAtlas.load("./assets/roguelikeDungeon_transparent.png", {width: 16, height: 16, margin: 1}))
        
        await Promise.all(assetLoading)
        this.stateMachine.setCurrentState("sheet");
        this.stateMachine.getCurrentState().enter();
    }

    draw(ctx, scaledCanvas) {
        this.stateMachine.getCurrentState().draw(ctx, scaledCanvas);
    }

    update(delta) {
        this.stateMachine.getCurrentState().update(delta);
    }
}