react-simple-game-engine 0.1.71 → 0.1.74

package/lib/classes/entities/entity-sult.js

@@ -98,7 +98,7 @@ var EntitySult = /** @class */ (function () {
             this._scene = worldManagement.scene;
             this.camera = worldManagement.camera;
         }
-        console.log("Active entity (name : ".concat(this._name, ")"));
+        // console.log(`Active entity (name : ${this._name})`);
         this.onActive();
     };
     EntitySult.prototype.onActive = function () { };

package/lib/classes/scaler.d.ts

@@ -7,9 +7,20 @@ export declare class Scaler {
     private _value;
     constructor(_canvasSize: Size, _gameSize: Size, _layoutMode: LayoutMode);
     get value(): number;
+    get gameSize(): Size;
+    get canvasSize(): Size;
+    get layoutMode(): LayoutMode;
+    get scaledSize(): {
+        width: number;
+        height: number;
+    };
+    get deltaToCenter(): {
+        x: number;
+        y: number;
+    };
     set gameSize(_gameSize: Size);
     set canvasSize(_canvasSize: Size);
     set layoutMode(_layoutMode: LayoutMode);
-    update(): void;
+    private update;
 }
 //# sourceMappingURL=scaler.d.ts.map

package/lib/classes/scaler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scaler.d.ts","sourceRoot":"","sources":["../../src/classes/scaler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAGvC,qBAAa,MAAM;IAGf,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,WAAW;IAJrB,OAAO,CAAC,MAAM,CAAS;gBAEJ,WAAW,EAAE,IAAI,EACjB,SAAS,EAAE,IAAI,EACxB,WAAW,EAAE,UAAU;IAKjC,IAAI,KAAK,WAER;IAED,IAAI,QAAQ,CAAC,SAAS,EAAE,IAAI,EAG3B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAG/B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,UAAU,EAGrC;IAED,MAAM;CAOP"}
+{"version":3,"file":"scaler.d.ts","sourceRoot":"","sources":["../../src/classes/scaler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAGvC,qBAAa,MAAM;IAGf,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,SAAS;IAC1B,OAAO,CAAC,WAAW;IAJrB,OAAO,CAAC,MAAM,CAAS;gBAEJ,WAAW,EAAE,IAAI,EACjB,SAAS,EAAE,IAAI,EACxB,WAAW,EAAE,UAAU;IAKjC,IAAI,KAAK,WAER;IAED,IAAI,QAAQ,IA2BY,IAAI,CAzB3B;IAED,IAAI,UAAU,IA4Bc,IAAI,CA1B/B;IAED,IAAI,UAAU,IA6Bc,UAAU,CA3BrC;IAED,IAAI,UAAU;;;MAKb;IAED,IAAI,aAAa;;;MAMhB;IAED,IAAI,QAAQ,CAAC,SAAS,EAAE,IAAI,EAG3B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAG/B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,UAAU,EAGrC;IAED,OAAO,CAAC,MAAM;CAOf"}

package/lib/classes/scaler.js

@@ -15,6 +15,9 @@ var Scaler = /** @class */ (function () {
         configurable: true
     });
     Object.defineProperty(Scaler.prototype, "gameSize", {
+        get: function () {
+            return this._gameSize;
+        },
         set: function (_gameSize) {
             copyProperties(this._gameSize, _gameSize);
             this.update();
@@ -23,6 +26,9 @@ var Scaler = /** @class */ (function () {
         configurable: true
     });
     Object.defineProperty(Scaler.prototype, "canvasSize", {
+        get: function () {
+            return this._canvasSize;
+        },
         set: function (_canvasSize) {
             copyProperties(this._canvasSize, _canvasSize);
             this.update();
@@ -31,6 +37,9 @@ var Scaler = /** @class */ (function () {
         configurable: true
     });
     Object.defineProperty(Scaler.prototype, "layoutMode", {
+        get: function () {
+            return this._layoutMode;
+        },
         set: function (_layoutMode) {
             this._layoutMode = _layoutMode;
             this.update();
@@ -38,6 +47,27 @@ var Scaler = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(Scaler.prototype, "scaledSize", {
+        get: function () {
+            return {
+                width: this._gameSize.width * this._value,
+                height: this._gameSize.height * this._value,
+            };
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Scaler.prototype, "deltaToCenter", {
+        get: function () {
+            var _scaleSize = this.scaledSize;
+            return {
+                x: Math.abs(this._canvasSize.width - _scaleSize.width) / 2,
+                y: Math.abs(this._canvasSize.height - _scaleSize.height) / 2,
+            };
+        },
+        enumerable: false,
+        configurable: true
+    });
     Scaler.prototype.update = function () {
         if (this._layoutMode === LayoutMode.LANDSCAPE) {
             this._value = this._canvasSize.height / this._gameSize.height;

package/lib/classes/sprites/sprite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sprite.d.ts","sourceRoot":"","sources":["../../../src/classes/sprites/sprite.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD,oBAAY,UAAU,GAAG,MAAM,GAAG,KAAK,GAAG,SAAS,GAAG,IAAI,CAAC;AAE3D,oBAAY,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,IAAI;IAC1D,MAAM,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC;IACrB,SAAS,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;CAChD,CAAC;AAEF,8BAAsB,MAAM,CAAC,UAAU,SAAS,UAAU;IACjD,MAAM,EAAE,UAAU,CAAC;IAC1B,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,OAAO,CAAS;IAExB,OAAO,CAAC,UAAU,CAAoC;IAEtD,IAAI,SAAS,CAAC,GAAG,EAAE,eAAe,CAAC,IAAI,CAAC,EAGvC;IAED,IAAI,SAAS,IAAI,eAAe,CAAC,IAAI,CAAC,CAErC;IAED,IAAI,MAAM,CAAC,MAAM,EAAE,MAAM,EAKxB;IAED,IAAI,MAAM,IAPS,MAAM,CASxB;IAED,IAAI,KAAK,WAER;IAED,IAAI,MAAM,WAET;IAED,IAAI;IAaJ,QAAQ,CAAC,MAAM,IAAI,IAAI;IAEvB,OAAO,CAAC,MAAM,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC;CAexC"}
+{"version":3,"file":"sprite.d.ts","sourceRoot":"","sources":["../../../src/classes/sprites/sprite.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD,oBAAY,UAAU,GAAG,MAAM,GAAG,KAAK,GAAG,SAAS,GAAG,IAAI,CAAC;AAE3D,oBAAY,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,IAAI;IAC1D,MAAM,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC;IACrB,SAAS,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC;CAChD,CAAC;AAEF,8BAAsB,MAAM,CAAC,UAAU,SAAS,UAAU;IACjD,MAAM,EAAE,UAAU,CAAC;IAC1B,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,OAAO,CAAS;IAExB,OAAO,CAAC,UAAU,CAAoC;IAEtD,IAAI,SAAS,CAAC,GAAG,EAAE,eAAe,CAAC,IAAI,CAAC,EAGvC;IAED,IAAI,SAAS,IAAI,eAAe,CAAC,IAAI,CAAC,CAErC;IAED,IAAI,MAAM,CAAC,MAAM,EAAE,MAAM,EAKxB;IAED,IAAI,MAAM,IAPS,MAAM,CASxB;IAED,IAAI,KAAK,WAER;IAED,IAAI,MAAM,WAET;IAED,IAAI;IAeJ,QAAQ,CAAC,MAAM,IAAI,IAAI;IAEvB,OAAO,CAAC,MAAM,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC;CAexC"}

package/lib/classes/sprites/sprite.js

@@ -44,7 +44,8 @@ var Sprite = /** @class */ (function () {
         var _a = this.entity, body = _a.body, position = _a.position, camera = _a.camera;
         Renderer.push();
         Renderer.noStroke();
-        Renderer.translate(position.x - camera.x + Renderer.width / 2, position.y - camera.y + Renderer.height / 2);
+        var deltaToCenter = Renderer.scaler.deltaToCenter;
+        Renderer.translate(position.x - camera.x + deltaToCenter.x, position.y - camera.y + deltaToCenter.y);
         Renderer.rotate(body.angle);
         this.onDraw();
         Renderer.pop();

package/lib/ui-components/scene-runner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scene-runner.d.ts","sourceRoot":"","sources":["../../src/ui-components/scene-runner.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAEb,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAKzC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAG7C,oBAAY,sBAAsB,GAAG;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,aAAK,gBAAgB,GAAG,sBAAsB,GAAG;IAC/C,OAAO,EAAE,KAAK,CAAC;CAChB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,OAAO,EACP,KAAK,EACL,MAAM,EACN,YAAY,EAAE,YAAY,EAC1B,UAAU,GACX,EAAE,gBAAgB,eA4FlB"}
+{"version":3,"file":"scene-runner.d.ts","sourceRoot":"","sources":["../../src/ui-components/scene-runner.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,aAAa,EAEb,SAAS,EAKV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAKzC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAG7C,oBAAY,sBAAsB,GAAG;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,aAAK,gBAAgB,GAAG,sBAAsB,GAAG;IAC/C,OAAO,EAAE,KAAK,CAAC;CAChB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,OAAO,EACP,KAAK,EACL,MAAM,EACN,YAAY,EAAE,YAAY,EAC1B,UAAiC,GAClC,EAAE,gBAAgB,eAkGlB"}

package/lib/ui-components/scene-runner.js

@@ -13,12 +13,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useEffect, useMemo, useRef, useState, } from "react";
 import { Sketch } from "./sketch";
 import { useWindowSize } from "../utils";
+import { LayoutMode } from "../export-enums";
 import { Scaler } from "../classes/scaler";
 export function SceneRunner(_a) {
-    var assetsDelay = _a.assetsDelay, current = _a.current, width = _a.width, height = _a.height, AssetsLoader = _a.assetsLoader, layoutMode = _a.layoutMode;
+    var assetsDelay = _a.assetsDelay, current = _a.current, width = _a.width, height = _a.height, AssetsLoader = _a.assetsLoader, _b = _a.layoutMode, layoutMode = _b === void 0 ? LayoutMode.LANDSCAPE : _b;
     var windowSize = useWindowSize();
     var refScaler = useRef(new Scaler(windowSize, { width: width, height: height }, layoutMode));
-    var _b = useState(false), isBootDone = _b[0], setBootDone = _b[1];
+    var _c = useState(false), isBootDone = _c[0], setBootDone = _c[1];
     useEffect(function () {
         if (window.Renderer) {
             window.Renderer.resizeCanvas(windowSize.width, windowSize.height);
@@ -53,18 +54,22 @@ export function SceneRunner(_a) {
         }
         return (AssetsLoader !== null && AssetsLoader !== void 0 ? AssetsLoader : _jsx("div", { children: "Assets loading..." }));
     }, [AssetsLoader]);
-    return (_jsx("div", __assign({ style: { width: width, height: height, position: "relative" } }, { children: current.loadedAssets ? (_jsxs(_Fragment, { children: [_jsx(Sketch, { onSetup: setup, onDraw: draw, scaler: refScaler.current }), _jsx("div", __assign({ style: {
+    return (_jsx("div", __assign({ style: {
+            width: windowSize.width,
+            height: windowSize.height,
+            position: "relative",
+        } }, { children: current.loadedAssets ? (_jsxs(_Fragment, { children: [_jsx(Sketch, { onSetup: setup, onDraw: draw, scaler: refScaler.current }), _jsx("div", __assign({ style: {
                         position: "absolute",
                         top: 0,
-                        bottom: 0,
                         left: 0,
-                        right: 0,
+                        width: width,
+                        height: height,
                         userSelect: "none",
                         zIndex: 2,
+                        transform: "scale(".concat(refScaler.current.value, ")"),
                     } }, { children: isBootDone ? (_jsx("div", __assign({ style: {
                             width: "100%",
                             height: "100%",
-                            transform: "scale(".concat(refScaler.current.value, ")"),
                         } }, { children: _jsx(current.UI, __assign({ scene: current }, current.UIProps)) }))) : (_jsx("div", {})) }))] })) : (_jsx("div", __assign({ style: {
                 width: "100%",
                 height: "100%",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-simple-game-engine",
-  "version": "0.1.71",
+  "version": "0.1.74",
   "description": "",
   "main": "lib/index.js",
   "types": "lib",