react-simple-game-engine 0.2.32 → 0.2.33

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.
@@ -5,11 +5,20 @@ export declare class Scaler {
5
5
  private readonly _canvasSize;
6
6
  private _layoutMode;
7
7
  private _value;
8
+ private _scaledSize;
9
+ private _zoneDelta;
10
+ private _zoneDeltaHalf;
8
11
  constructor(_screenSize: Size, _canvasSize: Size, _layoutMode: LayoutMode);
9
12
  get value(): number;
10
13
  get layoutMode(): LayoutMode;
11
14
  get canvasSize(): Size;
12
15
  get screenSize(): Size;
16
+ get scaledSize(): Size;
17
+ get zoneDelta(): Size;
18
+ get zoneDeltaHalf(): Size;
19
+ set zoneDelta(_zoneDelta: Size);
20
+ set scaledSize(_scaledSize: Size);
21
+ set value(_value: number);
13
22
  set screenSize(_screenSize: Size);
14
23
  set canvasSize(_canvasSize: Size);
15
24
  set layoutMode(_layoutMode: LayoutMode);
@@ -1 +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,WAAW;IAC5B,OAAO,CAAC,WAAW;IAJrB,OAAO,CAAC,MAAM,CAAS;gBAEJ,WAAW,EAAE,IAAI,EACjB,WAAW,EAAE,IAAI,EAC1B,WAAW,EAAE,UAAU;IAKjC,IAAI,KAAK,WAER;IAED,IAAI,UAAU,IA6Bc,UAAU,CA3BrC;IAED,IAAI,UAAU,IAoBc,IAAI,CAlB/B;IAED,IAAI,UAAU,IAWc,IAAI,CAT/B;IASD,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAG/B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAG/B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,UAAU,EAGrC;IAED,sBAAsB,CAAC,EAAE,EAAE,MAAM;IAIjC,OAAO,CAAC,MAAM;CAef"}
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;IAMf,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,QAAQ,CAAC,WAAW;IAC5B,OAAO,CAAC,WAAW;IAPrB,OAAO,CAAC,MAAM,CAAS;IACvB,OAAO,CAAC,WAAW,CAAO;IAC1B,OAAO,CAAC,UAAU,CAAO;IACzB,OAAO,CAAC,cAAc,CAAO;gBAEV,WAAW,EAAE,IAAI,EACjB,WAAW,EAAE,IAAI,EAC1B,WAAW,EAAE,UAAU;IAKjC,IAAI,KAAK,IA4CS,MAAM,CA1CvB;IAED,IAAI,UAAU,IAiEc,UAAU,CA/DrC;IAED,IAAI,UAAU,IAwDc,IAAI,CAtD/B;IAED,IAAI,UAAU,IA+Cc,IAAI,CA7C/B;IAED,IAAI,UAAU,IAoBc,IAAI,CAlB/B;IAED,IAAI,SAAS,IAQa,IAAI,CAN7B;IAED,IAAI,aAAa,SAEhB;IAED,IAAI,SAAS,CAAC,UAAU,EAAE,IAAI,EAM7B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAM/B;IAED,IAAI,KAAK,CAAC,MAAM,EAAE,MAAM,EAMvB;IASD,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAG/B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,IAAI,EAG/B;IAED,IAAI,UAAU,CAAC,WAAW,EAAE,UAAU,EAGrC;IAED,sBAAsB,CAAC,EAAE,EAAE,MAAM;IAIjC,OAAO,CAAC,MAAM;CAef"}
@@ -11,6 +11,13 @@ var Scaler = /** @class */ (function () {
11
11
  get: function () {
12
12
  return this._value;
13
13
  },
14
+ set: function (_value) {
15
+ this._value = _value;
16
+ this.scaledSize = {
17
+ width: this._canvasSize.width * _value,
18
+ height: this._canvasSize.height * _value,
19
+ };
20
+ },
14
21
  enumerable: false,
15
22
  configurable: true
16
23
  });
@@ -53,24 +60,59 @@ var Scaler = /** @class */ (function () {
53
60
  enumerable: false,
54
61
  configurable: true
55
62
  });
63
+ Object.defineProperty(Scaler.prototype, "scaledSize", {
64
+ get: function () {
65
+ return this._scaledSize;
66
+ },
67
+ set: function (_scaledSize) {
68
+ this._scaledSize = _scaledSize;
69
+ this.zoneDelta = {
70
+ width: this._screenSize.width - _scaledSize.width,
71
+ height: this._screenSize.height - _scaledSize.height,
72
+ };
73
+ },
74
+ enumerable: false,
75
+ configurable: true
76
+ });
77
+ Object.defineProperty(Scaler.prototype, "zoneDelta", {
78
+ get: function () {
79
+ return this._zoneDelta;
80
+ },
81
+ set: function (_zoneDelta) {
82
+ this._zoneDelta = _zoneDelta;
83
+ this._zoneDeltaHalf = {
84
+ width: _zoneDelta.width / 2,
85
+ height: _zoneDelta.height / 2,
86
+ };
87
+ },
88
+ enumerable: false,
89
+ configurable: true
90
+ });
91
+ Object.defineProperty(Scaler.prototype, "zoneDeltaHalf", {
92
+ get: function () {
93
+ return this._zoneDeltaHalf;
94
+ },
95
+ enumerable: false,
96
+ configurable: true
97
+ });
56
98
  Scaler.prototype.screenUnitToCanvasUnit = function (px) {
57
99
  return px / this._value;
58
100
  };
59
101
  Scaler.prototype.update = function () {
60
102
  if (this._layoutMode === LayoutMode.LANDSCAPE) {
61
103
  if (this._screenSize.width >= this._screenSize.height) {
62
- this._value = this._screenSize.width / this._canvasSize.width;
104
+ this.value = this._screenSize.width / this._canvasSize.width;
63
105
  }
64
106
  else {
65
- this._value = this._screenSize.height / this._canvasSize.height;
107
+ this.value = this._screenSize.height / this._canvasSize.height;
66
108
  }
67
109
  }
68
110
  else {
69
111
  if (this._screenSize.height >= this._screenSize.width) {
70
- this._value = this._screenSize.width / this._canvasSize.width;
112
+ this.value = this._screenSize.width / this._canvasSize.width;
71
113
  }
72
114
  else {
73
- this._value = this._screenSize.height / this._canvasSize.height;
115
+ this.value = this._screenSize.height / this._canvasSize.height;
74
116
  }
75
117
  }
76
118
  };
@@ -1 +1 @@
1
- {"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../src/ui-components/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGzC,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AAErE,oBAAY,YAAY,GAAG;IACzB,KAAK,EAAE,KAAK,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,YAAY,KAAK,SAAS,CAAC;IACzC,KAAK,CAAC,EAAE,cAAc,CAAC;CACxB,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,MAAM,EACN,GAAG,EACH,IAAS,EACT,KAAK,EACL,MAAW,EACX,KAAK,GACN,EAAE,YAAY,eA8Dd"}
1
+ {"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../src/ui-components/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGzC,OAAO,EAAE,cAAc,EAAE,MAAM,qCAAqC,CAAC;AAErE,oBAAY,YAAY,GAAG;IACzB,KAAK,EAAE,KAAK,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,YAAY,KAAK,SAAS,CAAC;IACzC,KAAK,CAAC,EAAE,cAAc,CAAC;CACxB,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,MAAM,EACN,GAAG,EACH,IAAS,EACT,KAAK,EACL,MAAW,EACX,KAAK,GACN,EAAE,YAAY,eA6Dd"}
@@ -16,27 +16,25 @@ import { Joystick } from "./react-joystick-component";
16
16
  export function Control(_a) {
17
17
  var scene = _a.scene, render = _a.render, top = _a.top, _b = _a.left, left = _b === void 0 ? 50 : _b, right = _a.right, _c = _a.bottom, bottom = _c === void 0 ? 50 : _c, props = _a.props;
18
18
  var el = useMemo(function () {
19
- var _a = Renderer.scaler, screenSize = _a.screenSize, canvasSize = _a.canvasSize;
20
- var verDeltaScale = (screenSize.height - canvasSize.height) / 2;
21
- var horDeltaScale = (screenSize.width - canvasSize.width) / 2;
19
+ var zoneDeltaHalf = Renderer.scaler.zoneDeltaHalf;
22
20
  var positionLeft = left != null
23
21
  ? {
24
- left: left + horDeltaScale,
22
+ left: left + zoneDeltaHalf.width,
25
23
  }
26
24
  : undefined;
27
25
  var positionRight = right != null
28
26
  ? {
29
- right: right + horDeltaScale,
27
+ right: right + -zoneDeltaHalf.width,
30
28
  }
31
29
  : undefined;
32
30
  var positionTop = top != null
33
31
  ? {
34
- top: verDeltaScale,
32
+ top: zoneDeltaHalf.height,
35
33
  }
36
34
  : undefined;
37
35
  var positionBottom = bottom != null
38
36
  ? {
39
- bottom: bottom + verDeltaScale,
37
+ bottom: bottom + -zoneDeltaHalf.height,
40
38
  }
41
39
  : undefined;
42
40
  return (_jsx("div", __assign({ style: __assign(__assign(__assign(__assign({ position: "absolute" }, positionLeft), positionRight), positionTop), positionBottom) }, { children: _jsx(Joystick, __assign({ size: 100, baseColor: "#2D2D2D", stickColor: "##303134", throttle: 500 }, props)) })));
@@ -26,7 +26,7 @@ export function SceneRunner(_a) {
26
26
  var refScaler = useRef(new Scaler(screenSize, { width: width, height: height }, layoutMode));
27
27
  var _c = useState(false), isBootDone = _c[0], setBootDone = _c[1];
28
28
  useMemo(function () {
29
- refScaler.current.canvasSize = {
29
+ refScaler.current.screenSize = {
30
30
  width: screenSize.width,
31
31
  height: screenSize.height,
32
32
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-simple-game-engine",
3
- "version": "0.2.32",
3
+ "version": "0.2.33",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib",