ujs/src/main.js

import { Settings } from './settings.js';
import { Pointer } from './pointer.js';
import { Scene, SceneLayer } from './scene.js';
import { Rect, StrokeRect, Sprite, TiledSprite, Empty } from './objects.js';

export class App {
  #version;

  constructor(
    width,
    height,
    options = {
      backgroundColor: '#ffcc68',
      welcome: true,
    }
  ) {
    this.#version = 'beeeeeeta';

    // Create CANVAS element
    this.view = document.createElement('canvas');
    this.canvas = this.view;
    this.context = this.canvas.getContext('2d');

    this.options = options;
    // check options || FIXIT:
    if (typeof this.options.backgroundColor === 'undefined') {
      this.options.backgroundColor = '#ffcc68';
    }
    if (typeof this.options.welcome === 'undefined') {
      this.options.welcome = true;
    }

    this.scene = new Scene(this, width, height);

    const logStrings = [
      'ujs engine',
      `version: ${this.#version}`,
      'feedback: iiiypuk {dog} fastmail.fm',
      'sources: https://git.a2s.su/emilecok/ujs',
    ];

    if (this.options.welcome) {
      logStrings.forEach((str) => {
        console.log(str);
      });
    }

    Pointer.init();
    Settings.fpsPrevTime = Date.now();

    // Start :)
    this.#run();
  }

  #run = () => {
    // Calculating FPS
    let fpsNewTime = Date.now();
    Settings.fpsDelta = (fpsNewTime - Settings.fpsPrevTime) / 1000;
    Settings.fpsPrevTime = fpsNewTime;
    Settings.fps = Math.round(1 / Settings.fpsDelta);

    // Clear canvas
    this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);

    // Fill canvas by default background color
    this.context.fillStyle = this.options.backgroundColor;
    this.context.fillRect(0, 0, this.canvas.width, this.canvas.height);

    // Draw scene
    this.scene.run();

    requestAnimationFrame(this.#run);
  };
}

export { Scene, SceneLayer, Empty, Rect, StrokeRect, Sprite, TiledSprite };