react-simple-game-engine 0.1.69 → 0.1.72
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/classes/camera.d.ts +1 -9
- package/lib/classes/camera.d.ts.map +1 -1
- package/lib/classes/camera.js +1 -27
- package/lib/classes/p5.d.ts +3 -1
- package/lib/classes/p5.d.ts.map +1 -1
- package/lib/classes/p5.js +2 -1
- package/lib/classes/particle.d.ts.map +1 -1
- package/lib/classes/particle.js +1 -1
- package/lib/classes/scaler.d.ts +18 -0
- package/lib/classes/scaler.d.ts.map +1 -0
- package/lib/classes/scaler.js +60 -0
- package/lib/classes/sprites/sprite.d.ts.map +1 -1
- package/lib/classes/sprites/sprite.js +1 -1
- package/lib/export-enums.d.ts +4 -0
- package/lib/export-enums.d.ts.map +1 -1
- package/lib/export-enums.js +5 -0
- package/lib/export-types.d.ts +4 -0
- package/lib/export-types.d.ts.map +1 -1
- package/lib/ui-components/scene-runner.d.ts +3 -1
- package/lib/ui-components/scene-runner.d.ts.map +1 -1
- package/lib/ui-components/scene-runner.js +44 -13
- package/lib/ui-components/sketch.d.ts +3 -3
- package/lib/ui-components/sketch.d.ts.map +1 -1
- package/lib/ui-components/sketch.js +10 -5
- package/lib/utils.d.ts +4 -0
- package/lib/utils.d.ts.map +1 -1
- package/lib/utils.js +17 -0
- package/package.json +1 -1
package/lib/classes/camera.d.ts
CHANGED
@@ -1,14 +1,6 @@
|
|
1
1
|
export declare class Camera {
|
2
|
-
private _width;
|
3
|
-
private _height;
|
4
2
|
x: number;
|
5
3
|
y: number;
|
6
|
-
|
7
|
-
scaleY: number;
|
8
|
-
constructor(_width: number, _height: number);
|
9
|
-
get width(): number;
|
10
|
-
get height(): number;
|
11
|
-
set width(width: number);
|
12
|
-
set height(height: number);
|
4
|
+
constructor();
|
13
5
|
}
|
14
6
|
//# sourceMappingURL=camera.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"camera.d.ts","sourceRoot":"","sources":["../../src/classes/camera.ts"],"names":[],"mappings":"AAAA,qBAAa,MAAM;
|
1
|
+
{"version":3,"file":"camera.d.ts","sourceRoot":"","sources":["../../src/classes/camera.ts"],"names":[],"mappings":"AAAA,qBAAa,MAAM;IACjB,CAAC,EAAE,MAAM,CAAK;IACd,CAAC,EAAE,MAAM,CAAK;;CAGf"}
|
package/lib/classes/camera.js
CHANGED
@@ -1,34 +1,8 @@
|
|
1
1
|
var Camera = /** @class */ (function () {
|
2
|
-
function Camera(
|
3
|
-
this._width = _width;
|
4
|
-
this._height = _height;
|
2
|
+
function Camera() {
|
5
3
|
this.x = 0;
|
6
4
|
this.y = 0;
|
7
|
-
this.scaleX = 1;
|
8
|
-
this.scaleY = 1;
|
9
5
|
}
|
10
|
-
Object.defineProperty(Camera.prototype, "width", {
|
11
|
-
get: function () {
|
12
|
-
return this._width;
|
13
|
-
},
|
14
|
-
set: function (width) {
|
15
|
-
this._width = width;
|
16
|
-
Renderer.resizeCanvas(this._width, this._height);
|
17
|
-
},
|
18
|
-
enumerable: false,
|
19
|
-
configurable: true
|
20
|
-
});
|
21
|
-
Object.defineProperty(Camera.prototype, "height", {
|
22
|
-
get: function () {
|
23
|
-
return this._height;
|
24
|
-
},
|
25
|
-
set: function (height) {
|
26
|
-
this._height = height;
|
27
|
-
Renderer.resizeCanvas(this._width, this._height);
|
28
|
-
},
|
29
|
-
enumerable: false,
|
30
|
-
configurable: true
|
31
|
-
});
|
32
6
|
return Camera;
|
33
7
|
}());
|
34
8
|
export { Camera };
|
package/lib/classes/p5.d.ts
CHANGED
@@ -1,10 +1,12 @@
|
|
1
1
|
import p5 from "p5";
|
2
|
+
import { Scaler } from "./scaler";
|
2
3
|
declare type ItemWithPercent<I> = [I, number];
|
3
4
|
declare type LastItem<I> = [I];
|
4
5
|
export declare type Collection<I> = [...ItemWithPercent<I>[], LastItem<I>];
|
5
6
|
export declare class P5 extends p5 {
|
7
|
+
scaler: Scaler;
|
6
8
|
running: boolean;
|
7
|
-
constructor(sketch: (p5: P5) => void);
|
9
|
+
constructor(sketch: (p5: P5) => void, scaler: Scaler);
|
8
10
|
choose<I = any>(collection: Collection<I>): I;
|
9
11
|
}
|
10
12
|
export {};
|
package/lib/classes/p5.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"p5.d.ts","sourceRoot":"","sources":["../../src/classes/p5.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,CAAC;
|
1
|
+
{"version":3,"file":"p5.d.ts","sourceRoot":"","sources":["../../src/classes/p5.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,CAAC;AACpB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,aAAK,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;AACtC,aAAK,QAAQ,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;AAEvB,oBAAY,UAAU,CAAC,CAAC,IAAI,CAAC,GAAG,eAAe,CAAC,CAAC,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;AAEnE,qBAAa,EAAG,SAAQ,EAAE;IAGqB,MAAM,EAAE,MAAM;IAF3D,OAAO,UAAQ;gBAEH,MAAM,EAAE,CAAC,EAAE,EAAE,EAAE,KAAK,IAAI,EAAS,MAAM,EAAE,MAAM;IAK3D,MAAM,CAAC,CAAC,GAAG,GAAG,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC;CA+B9C"}
|
package/lib/classes/p5.js
CHANGED
@@ -16,8 +16,9 @@ var __extends = (this && this.__extends) || (function () {
|
|
16
16
|
import p5 from "p5";
|
17
17
|
var P5 = /** @class */ (function (_super) {
|
18
18
|
__extends(P5, _super);
|
19
|
-
function P5(sketch) {
|
19
|
+
function P5(sketch, scaler) {
|
20
20
|
var _this = _super.call(this, sketch) || this;
|
21
|
+
_this.scaler = scaler;
|
21
22
|
_this.running = true;
|
22
23
|
window.Renderer = _this;
|
23
24
|
return _this;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"particle.d.ts","sourceRoot":"","sources":["../../src/classes/particle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,CAAC;AACpB,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,oBAAY,qBAAqB,GAAG;IAClC,GAAG,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,qBAAa,QACX,SAAQ,EAAE,CAAC,MACX,YAAW,UAAU,CAAC,qBAAqB,CAAC;IAE5C,OAAO,CAAC,GAAG,CAAsC;IACjD,OAAO,CAAC,GAAG,CAAsC;IACjD,OAAO,CAAC,KAAK,CAAa;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,KAAK,CAAmB;IAC/B,IAAI,EAAE,MAAM,CAAK;IACjB,cAAc,EAAE,MAAM,CAAiB;IAE9C,OAAO,CAAC,eAAe,CAAkB;IACzC,OAAO,CAAC,SAAS,CAAa;IAE9B,IAAI,QAAQ,CAAC,QAAQ,EAAE,MAAM,EAG5B;IAED,IAAI,QAAQ,IALW,MAAM,CAO5B;IAED,OAAO,CAAC,EAAE,GAAG,EAAE,GAAG,MAAM,EAAE,EAAE,qBAAqB;IAOjD,UAAU,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM;IAI3B,MAAM;IAIN,MAAM;IAQN,IAAI;
|
1
|
+
{"version":3,"file":"particle.d.ts","sourceRoot":"","sources":["../../src/classes/particle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,CAAC;AACpB,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,oBAAY,qBAAqB,GAAG;IAClC,GAAG,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF,qBAAa,QACX,SAAQ,EAAE,CAAC,MACX,YAAW,UAAU,CAAC,qBAAqB,CAAC;IAE5C,OAAO,CAAC,GAAG,CAAsC;IACjD,OAAO,CAAC,GAAG,CAAsC;IACjD,OAAO,CAAC,KAAK,CAAa;IACnB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,KAAK,CAAmB;IAC/B,IAAI,EAAE,MAAM,CAAK;IACjB,cAAc,EAAE,MAAM,CAAiB;IAE9C,OAAO,CAAC,eAAe,CAAkB;IACzC,OAAO,CAAC,SAAS,CAAa;IAE9B,IAAI,QAAQ,CAAC,QAAQ,EAAE,MAAM,EAG5B;IAED,IAAI,QAAQ,IALW,MAAM,CAO5B;IAED,OAAO,CAAC,EAAE,GAAG,EAAE,GAAG,MAAM,EAAE,EAAE,qBAAqB;IAOjD,UAAU,CAAC,KAAK,EAAE,EAAE,CAAC,MAAM;IAI3B,MAAM;IAIN,MAAM;IAQN,IAAI;IAsCJ,MAAM,CAAC,CAAC,EAAE,KAAK;CAGhB"}
|
package/lib/classes/particle.js
CHANGED
@@ -82,7 +82,7 @@ var Particle = /** @class */ (function (_super) {
|
|
82
82
|
Particle.prototype.draw = function () {
|
83
83
|
Renderer.push();
|
84
84
|
Renderer.noStroke();
|
85
|
-
Renderer.translate(this.x - this.camera.x, this.y - this.camera.y);
|
85
|
+
Renderer.translate(this.x - this.camera.x + Renderer.width, this.y - this.camera.y + Renderer.height / 2);
|
86
86
|
Renderer.rotate(this.angle);
|
87
87
|
var color = __spreadArray([], this.color, true);
|
88
88
|
var alpha = Renderer.map(this.lifetimeRemain, 0, this.lifetime, 0, 255);
|
@@ -0,0 +1,18 @@
|
|
1
|
+
import { LayoutMode } from "../export-enums";
|
2
|
+
import { Size } from "../export-types";
|
3
|
+
export declare class Scaler {
|
4
|
+
private readonly _canvasSize;
|
5
|
+
private readonly _gameSize;
|
6
|
+
private _layoutMode;
|
7
|
+
private _value;
|
8
|
+
constructor(_canvasSize: Size, _gameSize: Size, _layoutMode: LayoutMode);
|
9
|
+
get value(): number;
|
10
|
+
get gameSize(): Size;
|
11
|
+
get canvasSize(): Size;
|
12
|
+
get layoutMode(): LayoutMode;
|
13
|
+
set gameSize(_gameSize: Size);
|
14
|
+
set canvasSize(_canvasSize: Size);
|
15
|
+
set layoutMode(_layoutMode: LayoutMode);
|
16
|
+
private update;
|
17
|
+
}
|
18
|
+
//# sourceMappingURL=scaler.d.ts.map
|
@@ -0,0 +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,IAYY,IAAI,CAV3B;IAED,IAAI,UAAU,IAac,IAAI,CAX/B;IAED,IAAI,UAAU,IAcc,UAAU,CAZrC;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"}
|
@@ -0,0 +1,60 @@
|
|
1
|
+
import { LayoutMode } from "../export-enums";
|
2
|
+
import { copyProperties } from "../utils";
|
3
|
+
var Scaler = /** @class */ (function () {
|
4
|
+
function Scaler(_canvasSize, _gameSize, _layoutMode) {
|
5
|
+
this._canvasSize = _canvasSize;
|
6
|
+
this._gameSize = _gameSize;
|
7
|
+
this._layoutMode = _layoutMode;
|
8
|
+
this.update();
|
9
|
+
}
|
10
|
+
Object.defineProperty(Scaler.prototype, "value", {
|
11
|
+
get: function () {
|
12
|
+
return this._value;
|
13
|
+
},
|
14
|
+
enumerable: false,
|
15
|
+
configurable: true
|
16
|
+
});
|
17
|
+
Object.defineProperty(Scaler.prototype, "gameSize", {
|
18
|
+
get: function () {
|
19
|
+
return this._gameSize;
|
20
|
+
},
|
21
|
+
set: function (_gameSize) {
|
22
|
+
copyProperties(this._gameSize, _gameSize);
|
23
|
+
this.update();
|
24
|
+
},
|
25
|
+
enumerable: false,
|
26
|
+
configurable: true
|
27
|
+
});
|
28
|
+
Object.defineProperty(Scaler.prototype, "canvasSize", {
|
29
|
+
get: function () {
|
30
|
+
return this._canvasSize;
|
31
|
+
},
|
32
|
+
set: function (_canvasSize) {
|
33
|
+
copyProperties(this._canvasSize, _canvasSize);
|
34
|
+
this.update();
|
35
|
+
},
|
36
|
+
enumerable: false,
|
37
|
+
configurable: true
|
38
|
+
});
|
39
|
+
Object.defineProperty(Scaler.prototype, "layoutMode", {
|
40
|
+
get: function () {
|
41
|
+
return this._layoutMode;
|
42
|
+
},
|
43
|
+
set: function (_layoutMode) {
|
44
|
+
this._layoutMode = _layoutMode;
|
45
|
+
this.update();
|
46
|
+
},
|
47
|
+
enumerable: false,
|
48
|
+
configurable: true
|
49
|
+
});
|
50
|
+
Scaler.prototype.update = function () {
|
51
|
+
if (this._layoutMode === LayoutMode.LANDSCAPE) {
|
52
|
+
this._value = this._canvasSize.height / this._gameSize.height;
|
53
|
+
}
|
54
|
+
else {
|
55
|
+
this._value = this._canvasSize.width / this._gameSize.width;
|
56
|
+
}
|
57
|
+
};
|
58
|
+
return Scaler;
|
59
|
+
}());
|
60
|
+
export { Scaler };
|
@@ -1 +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;
|
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"}
|
@@ -44,7 +44,7 @@ var Sprite = /** @class */ (function () {
|
|
44
44
|
var _a = this.entity, body = _a.body, position = _a.position, camera = _a.camera;
|
45
45
|
Renderer.push();
|
46
46
|
Renderer.noStroke();
|
47
|
-
Renderer.translate(position.x - camera.x, position.y - camera.y);
|
47
|
+
Renderer.translate(position.x - camera.x + Renderer.width / 2, position.y - camera.y + Renderer.height / 2);
|
48
48
|
Renderer.rotate(body.angle);
|
49
49
|
this.onDraw();
|
50
50
|
Renderer.pop();
|
package/lib/export-enums.d.ts
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"export-enums.d.ts","sourceRoot":"","sources":["../src/export-enums.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,IAAI,IAAA;IACJ,UAAU,IAAA;CACX"}
|
1
|
+
{"version":3,"file":"export-enums.d.ts","sourceRoot":"","sources":["../src/export-enums.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,IAAI,IAAA;IACJ,UAAU,IAAA;CACX;AAED,oBAAY,UAAU;IACpB,SAAS,IAAA;IACT,QAAQ,IAAA;CACT"}
|
package/lib/export-enums.js
CHANGED
@@ -3,3 +3,8 @@ export var SoundType;
|
|
3
3
|
SoundType[SoundType["ONCE"] = 0] = "ONCE";
|
4
4
|
SoundType[SoundType["BACKGROUND"] = 1] = "BACKGROUND";
|
5
5
|
})(SoundType || (SoundType = {}));
|
6
|
+
export var LayoutMode;
|
7
|
+
(function (LayoutMode) {
|
8
|
+
LayoutMode[LayoutMode["LANDSCAPE"] = 0] = "LANDSCAPE";
|
9
|
+
LayoutMode[LayoutMode["PORTRAIT"] = 1] = "PORTRAIT";
|
10
|
+
})(LayoutMode || (LayoutMode = {}));
|
package/lib/export-types.d.ts
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"export-types.d.ts","sourceRoot":"","sources":["../src/export-types.ts"],"names":[],"mappings":"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"}
|
1
|
+
{"version":3,"file":"export-types.d.ts","sourceRoot":"","sources":["../src/export-types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,KAAK,EAAE,IAAI,EAAE,0BAA0B,EAAE,MAAM,WAAW,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE3C,YAAY,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,oBAAY,MAAM,GAAG,UAAU,CAAC,OAAO,cAAc,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;AACxE,oBAAY,KAAK,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;AAEtD,oBAAY,aAAa,CAAC,CAAC,SAAS,MAAM,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC;AAC/D,oBAAY,UAAU,GAAG,IAAI,GAAG;IAC9B,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,oBAAY,gBAAgB,CAC1B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IACjD;IACF,SAAS,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,CAAC,CAAC;IAC3C,WAAW,CAAC,EAAE,0BAA0B,CAAC;CAC1C,CAAC;AAGF,aAAK,aAAa,CAAC,CAAC,SAAS,MAAM,IAAI,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAGxE,aAAK,eAAe,CAAC,CAAC,SAAS,MAAM,IAAI,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAE1E,oBAAY,aAAa,CAAC,CAAC,SAAS,MAAM,IAAI;IAC5C,SAAS,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC;IAC7B,WAAW,CAAC,EAAE,eAAe,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,CAAC,EAAE,OAAO,2BAA2B,EAAE,cAAc,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;IACzE,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,KAAK,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;CAC7B,CAAC;AAEF,oBAAY,WAAW,CAAC,CAAC,SAAS,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAE5E,oBAAY,UAAU,CAAC,CAAC,SAAS,UAAU,GAAG,UAAU,IACpD;IACE,QAAQ,CAAC,CAAC;CACX,GACD,CAAC;IAAE,QAAQ,CAAC,CAAA;CAAE,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC;AAEpC,oBAAY,eAAe,GAAG,MAAM,CAClC,SAAS,EACT;IACE,OAAO,EAAE,OAAO,CAAC;IACjB,IAAI,EAAE,OAAO,CAAC;CACf,CACF,CAAC;AAEF,oBAAY,UAAU,GAAG;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,WAAW,GAAG;IACxB,WAAW,EAAE,MAAM,CAAC;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,oBAAY,eAAe,GAAG,WAAW,CAAC,eAAe,CAAC,CAAC;AAE3D,oBAAY,IAAI,GAAG;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC"}
|
@@ -1,14 +1,16 @@
|
|
1
1
|
import { ComponentType, ReactNode } from "react";
|
2
2
|
import { Scene } from "../classes/scene";
|
3
|
+
import { LayoutMode } from "../export-enums";
|
3
4
|
export declare type SceneRunnerPublicProps = {
|
4
5
|
width: number;
|
5
6
|
height: number;
|
6
7
|
assetsLoader?: ReactNode | ComponentType;
|
7
8
|
assetsDelay?: number;
|
9
|
+
layoutMode?: LayoutMode;
|
8
10
|
};
|
9
11
|
declare type SceneRunnerProps = SceneRunnerPublicProps & {
|
10
12
|
current: Scene;
|
11
13
|
};
|
12
|
-
export declare function SceneRunner({ assetsDelay, current, width, height, assetsLoader: AssetsLoader, }: SceneRunnerProps): JSX.Element;
|
14
|
+
export declare function SceneRunner({ assetsDelay, current, width, height, assetsLoader: AssetsLoader, layoutMode, }: SceneRunnerProps): JSX.Element;
|
13
15
|
export {};
|
14
16
|
//# sourceMappingURL=scene-runner.d.ts.map
|
@@ -1 +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,
|
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,UAAiC,GAClC,EAAE,gBAAgB,eA4FlB"}
|
@@ -9,12 +9,35 @@ var __assign = (this && this.__assign) || function () {
|
|
9
9
|
};
|
10
10
|
return __assign.apply(this, arguments);
|
11
11
|
};
|
12
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
13
|
-
import { useEffect, useMemo, useState, } from "react";
|
12
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
13
|
+
import { useEffect, useMemo, useRef, useState, } from "react";
|
14
14
|
import { Sketch } from "./sketch";
|
15
|
+
import { useWindowSize } from "../utils";
|
16
|
+
import { LayoutMode } from "../export-enums";
|
17
|
+
import { Scaler } from "../classes/scaler";
|
15
18
|
export function SceneRunner(_a) {
|
16
|
-
var assetsDelay = _a.assetsDelay, current = _a.current, width = _a.width, height = _a.height, AssetsLoader = _a.assetsLoader;
|
17
|
-
var
|
19
|
+
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;
|
20
|
+
var windowSize = useWindowSize();
|
21
|
+
var refScaler = useRef(new Scaler(windowSize, { width: width, height: height }, layoutMode));
|
22
|
+
var _c = useState(false), isBootDone = _c[0], setBootDone = _c[1];
|
23
|
+
useEffect(function () {
|
24
|
+
if (window.Renderer) {
|
25
|
+
window.Renderer.resizeCanvas(windowSize.width, windowSize.height);
|
26
|
+
}
|
27
|
+
refScaler.current.canvasSize = {
|
28
|
+
width: windowSize.width,
|
29
|
+
height: windowSize.height,
|
30
|
+
};
|
31
|
+
}, [windowSize]);
|
32
|
+
useEffect(function () {
|
33
|
+
refScaler.current.gameSize = {
|
34
|
+
width: width,
|
35
|
+
height: height,
|
36
|
+
};
|
37
|
+
}, [width, height]);
|
38
|
+
useEffect(function () {
|
39
|
+
refScaler.current.layoutMode = layoutMode;
|
40
|
+
}, [layoutMode]);
|
18
41
|
useEffect(function () {
|
19
42
|
current.loadAssets(assetsDelay);
|
20
43
|
}, [current, assetsDelay]);
|
@@ -31,13 +54,21 @@ export function SceneRunner(_a) {
|
|
31
54
|
}
|
32
55
|
return (AssetsLoader !== null && AssetsLoader !== void 0 ? AssetsLoader : _jsx("div", { children: "Assets loading..." }));
|
33
56
|
}, [AssetsLoader]);
|
34
|
-
return
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
57
|
+
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: {
|
58
|
+
position: "absolute",
|
59
|
+
top: 0,
|
60
|
+
bottom: 0,
|
61
|
+
left: 0,
|
62
|
+
right: 0,
|
63
|
+
userSelect: "none",
|
64
|
+
zIndex: 2,
|
65
|
+
} }, { children: isBootDone ? (_jsx("div", __assign({ style: {
|
66
|
+
width: "100%",
|
67
|
+
height: "100%",
|
68
|
+
transform: "scale(".concat(refScaler.current.value, ")"),
|
69
|
+
} }, { children: _jsx(current.UI, __assign({ scene: current }, current.UIProps)) }))) : (_jsx("div", {})) }))] })) : (_jsx("div", __assign({ style: {
|
70
|
+
width: "100%",
|
71
|
+
height: "100%",
|
72
|
+
transform: "scale(".concat(refScaler.current.value, ")"),
|
73
|
+
} }, { children: assetsLoader }))) })));
|
43
74
|
}
|
@@ -1,12 +1,12 @@
|
|
1
1
|
/// <reference types="react" />
|
2
2
|
import { Camera } from "../classes/camera";
|
3
|
+
import { Scaler } from "../classes/scaler";
|
3
4
|
declare type SketchProps = {
|
4
5
|
onSetup: (camera: Camera) => void;
|
5
6
|
onDraw: () => void;
|
6
7
|
onPreload?: () => void;
|
7
|
-
|
8
|
-
height: number;
|
8
|
+
scaler: Scaler;
|
9
9
|
};
|
10
|
-
export declare function Sketch({ onSetup, onDraw, onPreload,
|
10
|
+
export declare function Sketch({ onSetup, onDraw, onPreload, scaler }: SketchProps): JSX.Element;
|
11
11
|
export {};
|
12
12
|
//# sourceMappingURL=sketch.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"sketch.d.ts","sourceRoot":"","sources":["../../src/ui-components/sketch.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;
|
1
|
+
{"version":3,"file":"sketch.d.ts","sourceRoot":"","sources":["../../src/ui-components/sketch.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE3C,aAAK,WAAW,GAAG;IACjB,OAAO,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,wBAAgB,MAAM,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,WAAW,eAyCzE"}
|
@@ -3,27 +3,32 @@ import { useEffect, useRef } from "react";
|
|
3
3
|
import { Camera } from "../classes/camera";
|
4
4
|
import { P5 } from "../classes/p5";
|
5
5
|
export function Sketch(_a) {
|
6
|
-
var onSetup = _a.onSetup, onDraw = _a.onDraw, onPreload = _a.onPreload,
|
6
|
+
var onSetup = _a.onSetup, onDraw = _a.onDraw, onPreload = _a.onPreload, scaler = _a.scaler;
|
7
7
|
var refContainer = useRef(null);
|
8
|
+
useEffect(function () {
|
9
|
+
if (window.Renderer) {
|
10
|
+
window.Renderer.scaler = scaler;
|
11
|
+
}
|
12
|
+
}, [scaler]);
|
8
13
|
useEffect(function () {
|
9
14
|
var sketch = function (s) {
|
10
|
-
var camera = new Camera(
|
15
|
+
var camera = new Camera();
|
11
16
|
s.preload = function () {
|
12
17
|
return onPreload === null || onPreload === void 0 ? void 0 : onPreload();
|
13
18
|
};
|
14
19
|
s.setup = function () {
|
15
|
-
s.createCanvas(width, height).parent(refContainer.current);
|
20
|
+
s.createCanvas(scaler.canvasSize.width, scaler.canvasSize.height).parent(refContainer.current);
|
16
21
|
onSetup(camera);
|
17
22
|
};
|
18
23
|
s.draw = function () {
|
19
|
-
s.scale(
|
24
|
+
s.scale(scaler.value);
|
20
25
|
s.background(0);
|
21
26
|
s.imageMode(s.CENTER);
|
22
27
|
s.rectMode(s.CENTER);
|
23
28
|
onDraw();
|
24
29
|
};
|
25
30
|
};
|
26
|
-
var p5 = new P5(sketch);
|
31
|
+
var p5 = new P5(sketch, scaler);
|
27
32
|
return function () {
|
28
33
|
p5.remove();
|
29
34
|
};
|
package/lib/utils.d.ts
CHANGED
@@ -9,4 +9,8 @@ export declare function parallel<T = any, S = T>(items: T[], each: (t: T, iter:
|
|
9
9
|
index: number;
|
10
10
|
realIndex: number;
|
11
11
|
}) => Promise<S>, limit?: number): Promise<S[]>;
|
12
|
+
export declare function useWindowSize(): {
|
13
|
+
width: number;
|
14
|
+
height: number;
|
15
|
+
};
|
12
16
|
//# sourceMappingURL=utils.d.ts.map
|
package/lib/utils.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAiBxC,wBAAsB,gBAAgB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAInE;AAED,wBAAsB,gBAAgB,CACpC,GAAG,EAAE,MAAM,EACX,IAAI,CAAC,EAAE,SAAS,GACf,OAAO,CAAC,KAAK,CAAC,CAWhB;AAED,wBAAsB,IAAI,CAAC,KAAK,CAAC,EAAE,MAAM,oBAQxC;AAED,wBAAgB,cAAc,CAC5B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC3B,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAO5B;AAED,wBAAsB,QAAQ,CAAC,CAAC,GAAG,GAAG,EAAE,CAAC,GAAG,CAAC,EAC3C,KAAK,EAAE,CAAC,EAAE,EACV,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,MAAM,CAAA;CAAE,KAAK,OAAO,CAAC,CAAC,CAAC,EACtE,KAAK,SAAI,GACR,OAAO,CAAC,CAAC,EAAE,CAAC,CAkBd;AAED,wBAAgB,aAAa;;;EAiB5B"}
|
package/lib/utils.js
CHANGED
@@ -35,6 +35,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
35
35
|
}
|
36
36
|
};
|
37
37
|
import OutofScopeP5 from "p5";
|
38
|
+
import { useEffect, useState } from "react";
|
38
39
|
import { Sound } from "./classes/sound";
|
39
40
|
var outofScopeP5;
|
40
41
|
document.addEventListener("DOMContentLoaded", function () {
|
@@ -138,3 +139,19 @@ export function parallel(items, each, limit) {
|
|
138
139
|
});
|
139
140
|
});
|
140
141
|
}
|
142
|
+
export function useWindowSize() {
|
143
|
+
var _a = useState({
|
144
|
+
width: window.outerWidth,
|
145
|
+
height: window.outerHeight,
|
146
|
+
}), size = _a[0], setSize = _a[1];
|
147
|
+
useEffect(function () {
|
148
|
+
function onResize() {
|
149
|
+
setSize({ width: window.outerWidth, height: window.outerHeight });
|
150
|
+
}
|
151
|
+
window.addEventListener("resize", onResize);
|
152
|
+
return function () {
|
153
|
+
window.removeEventListener("resize", onResize);
|
154
|
+
};
|
155
|
+
}, []);
|
156
|
+
return size;
|
157
|
+
}
|