more assets, more workring

src/classes/Bastion.ts

@@ -2,20 +2,47 @@ import * as PIXI from 'pixi.js';
 import DynamicObject from './DynamicObject';
 
 export class Foundation {
+    public static _PIXIApp: PIXI.Application;
     public static Master: Master;
     public static WindowHeight: number;
     public static WindowWidth: number;
+    public static AspectRatio: number = 4 / 3;
 }
 
 export default class Master {
-    public DynamicObjects: DynamicObject[];
-    public ticker: PIXI.Ticker;
+    private DynamicObjects: DynamicObject[];
+    private ticker: PIXI.Ticker;
+    public stage: PIXI.Container = new PIXI.Container({
+        width: Foundation.WindowWidth,
+        height: Foundation.WindowHeight,
+    });
+
     constructor() {
         Foundation.Master = this;
         this.ticker = new PIXI.Ticker();
         this.ticker.maxFPS = 60;
         this.ticker.minFPS = 30;
-        this.ticker.add(() => this.update(this.ticker.elapsedMS)); // bruh
+        this.ticker.add(() => this.update(this.ticker.elapsedMS));
+    }
+
+    public _CreateDynamicObject(object: DynamicObject) {
+        this.DynamicObjects.push(object);
+    }
+
+    public _RemoveDynamicObject(object: DynamicObject) {
+        this.DynamicObjects.splice(this.DynamicObjects.indexOf(object), 1);
+    }
+
+    public RefreshStage() {
+        Foundation._PIXIApp.stage.removeChildren();
+        this.stage.width = Foundation.WindowWidth;
+        this.stage.height = Foundation.WindowHeight;
+        Foundation._PIXIApp.stage.addChild(this.stage);
+    }
+
+    public update(elapsedMS) {
+        this.DynamicObjects.forEach((element) => {
+            element.update(elapsedMS);
+        });
     }
-    public update(elapsedMS) {}
 }

src/classes/DynamicObject.ts

@@ -2,27 +2,30 @@ import * as PIXI from 'pixi.js';
 import { Foundation } from './Bastion';
 
 export default abstract class DynamicObject {
-    protected _container: PIXI.Container;
+    public readonly name: string = this.constructor.name;
 
-    protected bounds: PIXI.Rectangle;
+    protected _container: PIXI.Container = new PIXI.Container();
 
-    private _events: PIXI.EventEmitter = new PIXI.EventEmitter();
-
-    public abstract events: Enumerator;
+    protected _events: PIXI.EventEmitter = new PIXI.EventEmitter();
 
     public destroy() {
         this._events.removeAllListeners();
         if (this._container.parent) this._container.parent.removeChild(this._container);
         this._container.destroy();
+        Foundation.Master._RemoveDynamicObject(this);
     }
 
     public get container(): PIXI.Container {
         return this._container;
     }
 
-    constructor(bounds?: PIXI.Rectangle) {
-        this.bounds = bounds ?? new PIXI.Rectangle(0, 0, 0, 0);
-        this._container = new PIXI.Container();
-        Foundation.Master.DynamicObjects.push(this);
+    public get events(): PIXI.EventEmitter {
+        return this._events;
+    }
+
+    public update(elapsedMS) {}
+
+    constructor() {
+        Foundation.Master._CreateDynamicObject(this);
     }
 }

src/classes/GuiObject.ts

@@ -0,0 +1,41 @@
+import * as PIXI from 'pixi.js';
+
+export default abstract class GuiObject {
+    public readonly name: string = this.constructor.name;
+
+    protected _container: PIXI.Container;
+
+    protected _events: PIXI.EventEmitter = new PIXI.EventEmitter();
+
+    public destroy() {
+        this._events.removeAllListeners();
+        if (this._container.parent) this._container.parent.removeChild(this._container);
+        this._container.destroy();
+    }
+
+    public get container(): PIXI.Container {
+        return this._container;
+    }
+
+    public get events(): PIXI.EventEmitter {
+        return this._events;
+    }
+
+    public onClick(e: PIXI.FederatedPointerEvent) {
+        console.warn(`[${this.name} does not implement GuiObject.onClick()]`);
+    }
+    public onWheel(e: PIXI.FederatedWheelEvent) {
+        console.warn(`[${this.name} does not implement GuiObject.onWheel()]`);
+    }
+
+    constructor() {
+        this._container = new PIXI.Container();
+        this._container.interactive = true;
+        this._container.onwheel = (e) => {
+            this.onWheel(e);
+        };
+        this._container.onclick = (e) => {
+            this.onClick(e);
+        };
+    }
+}

src/main.ts

@@ -3,13 +3,14 @@ import Master, { Foundation } from './classes/Bastion';
 
 (async () => {
     const app = new PIXI.Application();
-    const aspectRatio = 4 / 3;
+    const aspectRatio = Foundation.AspectRatio;
     const maxWidth = window.innerWidth;
     const maxHeight = window.innerHeight;
     const width = Math.min(maxWidth * 0.75, maxHeight * aspectRatio);
     const height = width / aspectRatio;
     Foundation.WindowWidth = width;
     Foundation.WindowHeight = height;
+    Foundation._PIXIApp = app;
 
     await app.init({
         width: width,
@@ -20,19 +21,14 @@ import Master, { Foundation } from './classes/Bastion';
     });
 
     document.body.appendChild(app.canvas);
+    let master = new Master();
+    master.RefreshStage();
     window.addEventListener('resize', () => {
         const newWidth = Math.min(window.innerWidth * 0.75, window.innerHeight * aspectRatio);
         const newHeight = newWidth / aspectRatio;
         Foundation.WindowWidth = newWidth;
         Foundation.WindowHeight = newHeight;
         app.renderer.resize(newWidth, newHeight);
+        master.RefreshStage();
     });
-    new Master();
-    // await Assets.LoadAssets();
-    // const game = new Game(app.screen);
-    // app.stage.addChild(game.container);
-    // window.addEventListener("resize", () => {
-    //   app.renderer.resize(window.innerWidth, window.innerHeight);
-    //   game.setBounds(0, 0, app.screen.width, app.screen.height);
-    // });
 })();