ujs/src/js/scene.js

107 lines
2.1 KiB
JavaScript

import { Pointer } from './pointer.js';
export class Scene {
#canvas;
#context;
#layers;
constructor(canvas, context, width, height) {
this.#canvas = canvas;
this.#context = context;
this.#layers = Array();
this.setScreenSize(width, height);
}
run() {
this.#update();
this.#draw();
}
#update() {
// read layers & draw items
this.#layers.forEach((layer) => {
layer.objects().forEach((item) => {
if (typeof item.ticker == 'function') {
item.ticker();
}
});
});
}
#draw() {
// read layers & draw items
this.#layers.forEach((layer) => {
layer.objects().forEach((item) => {
switch (item.constructor.name) {
case 'Rect':
this.#drawRect(item.x, item.y, item.width, item.height, item.fillColor);
break;
case 'StrokeRect':
this.#drawStrokeRect(
item.x,
item.y,
item.width,
item.height,
item.fillColor,
item.strokeColor,
item.strokeWidth
);
break;
default:
console.log(`⛔ Error display '${item.constructor.name}' object.`);
}
});
});
}
#drawRect(x, y, w, h, fillColor) {
this.#context.fillStyle = fillColor;
this.#context.fillRect(x, y, w, h);
}
#drawStrokeRect(x, y, w, h, fillColor, strokeColor, strokeWidth) {
this.#drawRect(x, y, w, h, fillColor);
this.#context.lineWidth = strokeWidth;
this.#context.strokeStyle = strokeColor;
this.#context.strokeRect(x, y, w, h);
}
addLayer(layer) {
this.#layers.push(layer);
}
removeLayers() {
this.#layers = Array();
}
setScreenSize(w, h) {
this.#canvas.width = w;
this.#canvas.height = h;
}
}
export class SceneLayer {
#objects;
constructor(name, objects = Array()) {
// TODO: check types
this.#objects = Array();
objects.forEach((object) => {
this.#objects.push(object);
});
}
add(object) {
this.#objects.push(object);
}
objects() {
return this.#objects;
}
}