103 lines
3.1 KiB
JavaScript
103 lines
3.1 KiB
JavaScript
import { VisLevel } from "./index.js";
|
|
export class VisMain {
|
|
_canvas;
|
|
_context;
|
|
_startTimestamp = 0;
|
|
_active = true;
|
|
_ready = false;
|
|
_gap = 0;
|
|
_wallPattern;
|
|
_visLevel;
|
|
_simMain;
|
|
constructor(simMain, canvas) {
|
|
this._simMain = simMain;
|
|
this._canvas = canvas;
|
|
this._context = this._canvas.getContext("2d");
|
|
this._context.globalCompositeOperation = "source-over";
|
|
this._wallPattern = this.createPattern(this._simMain.gdRoot.image("wall.png"), 48);
|
|
this._visLevel = new VisLevel(this, this._simMain, this._simMain.gdRoot);
|
|
const host = this;
|
|
requestAnimationFrame(function step(timestamp) {
|
|
host.step(timestamp);
|
|
});
|
|
}
|
|
get simMain() {
|
|
return this._simMain;
|
|
}
|
|
get visLevel() {
|
|
return this._visLevel;
|
|
}
|
|
get canvas() {
|
|
return this._canvas;
|
|
}
|
|
get context() {
|
|
return this._context;
|
|
}
|
|
get wallPattern() {
|
|
return this._wallPattern;
|
|
}
|
|
createPattern(image, size) {
|
|
const tempCanvas = document.createElement("canvas");
|
|
const tempContext = tempCanvas.getContext("2d");
|
|
tempCanvas.width = size;
|
|
tempCanvas.height = size;
|
|
tempContext.drawImage(image, 0, 0, image.width, image.height, 0, 0, size, size);
|
|
return this._context.createPattern(tempCanvas, 'repeat');
|
|
}
|
|
step(timestamp) {
|
|
if (!this._active) {
|
|
return;
|
|
}
|
|
const host = this;
|
|
requestAnimationFrame((timestamp) => {
|
|
host.step(timestamp);
|
|
});
|
|
if (!this._startTimestamp) {
|
|
this._startTimestamp = timestamp;
|
|
}
|
|
const simLevel = this._simMain.currentLevel;
|
|
let targetStep = (timestamp - this._startTimestamp) * this._simMain.gdRoot.simulation.stepsPerSecond / 1000 - this._gap;
|
|
if (simLevel.paused) {
|
|
this._gap += targetStep - simLevel.currentStep;
|
|
targetStep = simLevel.currentStep;
|
|
}
|
|
this._simMain.executeUntilStep(targetStep);
|
|
this._visLevel.updateEveryFrame(targetStep);
|
|
this.onRender();
|
|
}
|
|
;
|
|
onResized() {
|
|
const gameHost = document.getElementById("game-host");
|
|
const width = gameHost.clientWidth;
|
|
const height = gameHost.clientHeight;
|
|
const ratio = window.devicePixelRatio;
|
|
this._canvas.width = width * ratio;
|
|
this._canvas.height = height * ratio;
|
|
this._canvas.style.width = width + "px";
|
|
this._canvas.style.height = height + "px";
|
|
this._context.scale(ratio, ratio);
|
|
this._visLevel.updateSize();
|
|
}
|
|
;
|
|
onRender() {
|
|
this.clear();
|
|
const ctx = this._context;
|
|
ctx.font = "12px Tahoma";
|
|
const simLevel = this._simMain.currentLevel;
|
|
if (!!simLevel) {
|
|
if (!this._ready) {
|
|
this.onResized();
|
|
this._ready = true;
|
|
}
|
|
this._visLevel.draw();
|
|
}
|
|
}
|
|
;
|
|
clear() {
|
|
this._context.clearRect(0, 0, this._canvas.width, this._canvas.height);
|
|
}
|
|
stop() {
|
|
this._active = false;
|
|
}
|
|
}
|
|
//# sourceMappingURL=VisMain.js.map
|