react-simple-game-engine 0.2.73 → 0.2.75

package/lib/ui-components/control-container.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement } from "react";
+declare type ControlContainerProps = {
+    full?: boolean;
+    children: ReactElement | ReactElement[];
+};
+export declare function ControlContainer({ full, children }: ControlContainerProps): JSX.Element;
+export {};
+//# sourceMappingURL=control-container.d.ts.map

package/lib/ui-components/control-container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"control-container.d.ts","sourceRoot":"","sources":["../../src/ui-components/control-container.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAE9C,aAAK,qBAAqB,GAAG;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;CACzC,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,qBAAqB,eAsBzE"}

package/lib/ui-components/control-container.js

@@ -0,0 +1,30 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+export function ControlContainer(_a) {
+    var full = _a.full, children = _a.children;
+    var _children = useMemo(function () {
+        var _children = Array.isArray(children) ? children : [children];
+        return _children
+            .reduce(function (arr, child) {
+            arr.push.apply(arr, (Array.isArray(child) ? child : [child]));
+            return arr;
+        }, [])
+            .filter(Boolean);
+    }, [children]);
+    return (_jsx("div", __assign({ style: {
+            width: "100%",
+            height: full ? "100%" : undefined,
+            position: "relative",
+        } }, { children: _children })));
+}

package/lib/ui-components/control.d.ts

@@ -1,14 +1,12 @@
-import { ReactElement, ReactNode } from "react";
-import { Scene } from "../classes/scene";
-import { IJoystickProps } from "./react-joystick-component/Joystick";
+import { ReactNode } from "react";
 export declare type ControlProps = {
-    scene: Scene;
     top?: number;
     left?: number;
     right?: number;
     bottom?: number;
-    render?: (el: ReactElement) => ReactNode;
-    props?: Omit<IJoystickProps, "start" | "move" | "stop">;
+    children: ReactNode;
+    xAxisOriginCenter?: false;
+    yAxisOriginCenter?: false;
 };
-export declare function Control({ scene, render, top, left, right, bottom, props, }: ControlProps): JSX.Element;
+export declare function Control({ xAxisOriginCenter, yAxisOriginCenter, top, left, right, bottom, children, }: ControlProps): JSX.Element;
 //# sourceMappingURL=control.d.ts.map

package/lib/ui-components/control.d.ts.map

@@ -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;AAIzC,OAAO,EACL,cAAc,EAEf,MAAM,qCAAqC,CAAC;AAE7C,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,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC,CAAC;CACzD,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,MAAM,EACN,GAAG,EACH,IAAS,EACT,KAAK,EACL,MAAW,EACX,KAAK,GACN,EAAE,YAAY,eAwDd"}
+{"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../src/ui-components/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,oBAAY,YAAY,GAAG;IACzB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAC;IAC1B,iBAAiB,CAAC,EAAE,KAAK,CAAC;CAC3B,CAAC;AAEF,wBAAgB,OAAO,CAAC,EACtB,iBAAyB,EACzB,iBAAyB,EACzB,GAAO,EACP,IAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAQ,GACT,EAAE,YAAY,eAgBd"}

package/lib/ui-components/control.js

@@ -10,44 +10,14 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
-import { JoystickActionType } from "../export-enums";
-import { Watcher } from "../utilities";
-import { Joystick } from "./react-joystick-component";
 export function Control(_a) {
-    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;
-    var defaultShow = useMemo(function () {
-        return scene.getInitialData();
-    }, [scene]).joystick;
-    var el = useMemo(function () {
-        var onAction = function (e) {
-            if (e.type === JoystickActionType.MOVE) {
-                scene.emitJoystickAction({
-                    type: e.type,
-                    vector: Renderer.createVector(e.x, -e.y).normalize(),
-                    weight: e.distance / 100,
-                    length: e.distance,
-                    direction: e.direction,
-                });
-            }
-            else {
-                scene.emitJoystickAction({
-                    type: e.type,
-                });
-            }
-        };
-        return (_jsx("div", __assign({ style: {
-                position: "absolute",
-                left: left,
-                top: top,
-                bottom: bottom,
-                right: right,
-            } }, { children: _jsx(Joystick, __assign({ size: 60, baseColor: "#2D2D2D", stickColor: "rgb(120,121,122)", throttle: 100 }, props, { start: onAction, move: onAction, stop: onAction })) })));
-    }, [props]);
-    return (_jsx(Watcher, __assign({ initialValues: {
-            isShow: defaultShow,
-        }, scene: scene, names: "control-visible" }, { children: function (_a) {
-            var isShow = _a.isShow;
-            return (isShow ? (render ? render(el) : el) : null);
-        } })));
+    var _b = _a.xAxisOriginCenter, xAxisOriginCenter = _b === void 0 ? false : _b, _c = _a.yAxisOriginCenter, yAxisOriginCenter = _c === void 0 ? false : _c, _d = _a.top, top = _d === void 0 ? 0 : _d, _e = _a.left, left = _e === void 0 ? 0 : _e, right = _a.right, bottom = _a.bottom, children = _a.children;
+    return (_jsx("div", __assign({ style: {
+            position: "absolute",
+            top: top,
+            left: left,
+            right: right,
+            bottom: bottom,
+            translate: "\n        ".concat(xAxisOriginCenter ? "-50%" : 0, " ").concat(yAxisOriginCenter ? "-50%" : 0),
+        } }, { children: children })));
 }

package/lib/ui-components/movement-control.d.ts

@@ -0,0 +1,14 @@
+import { ReactElement, ReactNode } from "react";
+import { Scene } from "../classes/scene";
+import { IJoystickProps } from "./react-joystick-component/Joystick";
+export declare type MovementControlProps = {
+    scene: Scene;
+    top?: number;
+    left?: number;
+    right?: number;
+    bottom?: number;
+    render?: (el: ReactElement) => ReactNode;
+    props?: Omit<IJoystickProps, "start" | "move" | "stop">;
+};
+export declare function MovementControl({ scene, render, top, left, right, bottom, props, }: MovementControlProps): JSX.Element;
+//# sourceMappingURL=movement-control.d.ts.map

package/lib/ui-components/movement-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"movement-control.d.ts","sourceRoot":"","sources":["../../src/ui-components/movement-control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAW,MAAM,OAAO,CAAC;AAEzD,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAIzC,OAAO,EACL,cAAc,EAEf,MAAM,qCAAqC,CAAC;AAE7C,oBAAY,oBAAoB,GAAG;IACjC,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,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC,CAAC;CACzD,CAAC;AAEF,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,MAAM,EACN,GAAG,EACH,IAAS,EACT,KAAK,EACL,MAAW,EACX,KAAK,GACN,EAAE,oBAAoB,eAwDtB"}

package/lib/ui-components/movement-control.js

@@ -0,0 +1,53 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { JoystickActionType } from "../export-enums";
+import { Watcher } from "../utilities";
+import { Joystick } from "./react-joystick-component";
+export function MovementControl(_a) {
+    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;
+    var defaultShow = useMemo(function () {
+        return scene.getInitialData();
+    }, [scene]).joystick;
+    var el = useMemo(function () {
+        var onAction = function (e) {
+            if (e.type === JoystickActionType.MOVE) {
+                scene.emitJoystickAction({
+                    type: e.type,
+                    vector: Renderer.createVector(e.x, -e.y).normalize(),
+                    weight: e.distance / 100,
+                    length: e.distance,
+                    direction: e.direction,
+                });
+            }
+            else {
+                scene.emitJoystickAction({
+                    type: e.type,
+                });
+            }
+        };
+        return (_jsx("div", __assign({ style: {
+                position: "absolute",
+                left: left,
+                top: top,
+                bottom: bottom,
+                right: right,
+            } }, { children: _jsx(Joystick, __assign({ size: 60, baseColor: "#2D2D2D", stickColor: "rgb(120,121,122)", throttle: 100 }, props, { start: onAction, move: onAction, stop: onAction })) })));
+    }, [props]);
+    return (_jsx(Watcher, __assign({ initialValues: {
+            isShow: defaultShow,
+        }, scene: scene, names: "control-visible" }, { children: function (_a) {
+            var isShow = _a.isShow;
+            return (isShow ? (render ? render(el) : el) : null);
+        } })));
+}

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

@@ -1,8 +1,8 @@
 import { ComponentType, ReactNode } from "react";
 import { Scene } from "../classes/scene";
 import { LayoutMode } from "../export-enums";
-import { ControlProps } from "./control";
 import { AssetsFailBehavior } from "../export-types";
+import { MovementControlProps } from "./movement-control";
 export declare type SceneRunnerPublicProps = {
     width: number;
     height: number;
@@ -11,7 +11,7 @@ export declare type SceneRunnerPublicProps = {
     assetsFailBehavior?: AssetsFailBehavior;
     layoutMode?: LayoutMode;
     voidSpace?: ReactNode;
-    joystick?: Omit<ControlProps, "scene"> | true;
+    joystick?: Omit<MovementControlProps, "scene"> | true;
 };
 declare type SceneRunnerProps = SceneRunnerPublicProps & {
     current: Scene;

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;AAQzC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAW,YAAY,EAAE,MAAM,WAAW,CAAC;AAElD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAErD,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,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC;CAC/C,CAAC;AAEF,aAAK,gBAAgB,GAAG,sBAAsB,GAAG;IAC/C,OAAO,EAAE,KAAK,CAAC;CAChB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,MAAM,EACN,OAAO,EACP,UAAiC,EAEjC,SAAS,EACT,WAAW,EACX,kBAAkB,EAClB,YAAY,EAAE,YAAY,EAC1B,QAAQ,GACT,EAAE,gBAAgB,eAsJlB"}
+{"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;AAC7C,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAIrD,OAAO,EAAmB,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAG3E,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,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,IAAI,CAAC,oBAAoB,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC;CACvD,CAAC;AAEF,aAAK,gBAAgB,GAAG,sBAAsB,GAAG;IAC/C,OAAO,EAAE,KAAK,CAAC;CAChB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,MAAM,EACN,OAAO,EACP,UAAiC,EAEjC,SAAS,EACT,WAAW,EACX,kBAAkB,EAClB,YAAY,EAAE,YAAY,EAC1B,QAAQ,GACT,EAAE,gBAAgB,eAsJlB"}

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

@@ -12,11 +12,11 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState, } from "react";
 import { Scaler } from "../classes/scaler";
-import { ScalerContainer } from "./scaler-container";
-import { Sketch } from "./sketch";
 import { useWindowSize } from "../utils";
 import { LayoutMode } from "../export-enums";
-import { Control } from "./control";
+import { ScalerContainer } from "./scaler-container";
+import { Sketch } from "./sketch";
+import { MovementControl } from "./movement-control";
 import { FloatContainer } from "./float-container";
 export function SceneRunner(_a) {
     var width = _a.width, height = _a.height, current = _a.current, _b = _a.layoutMode, layoutMode = _b === void 0 ? LayoutMode.LANDSCAPE : _b, 
@@ -93,7 +93,7 @@ export function SceneRunner(_a) {
                             }
                             return rendered;
                         })()
-                        : assetsLoader })) : (_jsx(_Fragment, { children: isBootDone ? (_jsxs(_Fragment, { children: [_jsx(current.UI, __assign({ scene: current }, current.getUIProps())), joystick && (_jsx(Control, __assign({ scene: current }, (joystick === true ? {} : joystick)))), _jsx("div", { id: "scene-modal-stack", style: {
+                        : assetsLoader })) : (_jsx(_Fragment, { children: isBootDone ? (_jsxs(_Fragment, { children: [_jsx(current.UI, __assign({ scene: current }, current.getUIProps())), joystick && (_jsx(MovementControl, __assign({ scene: current }, (joystick === true ? {} : joystick)))), _jsx("div", { id: "scene-modal-stack", style: {
                                     position: "absolute",
                                     top: 0,
                                     left: 0,

package/lib/utilities.d.ts

@@ -1,4 +1,6 @@
 export * from "./classes/watcher";
 export * from "./classes/sound-watcher";
 export * from "./ui-components/modal";
+export * from "./ui-components/control";
+export * from "./ui-components/control-container";
 //# sourceMappingURL=utilities.d.ts.map

package/lib/utilities.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utilities.d.ts","sourceRoot":"","sources":["../src/utilities.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC"}
+{"version":3,"file":"utilities.d.ts","sourceRoot":"","sources":["../src/utilities.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC;AAClC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,mCAAmC,CAAC"}

package/lib/utilities.js

@@ -1,3 +1,5 @@
 export * from "./classes/watcher";
 export * from "./classes/sound-watcher";
 export * from "./ui-components/modal";
+export * from "./ui-components/control";
+export * from "./ui-components/control-container";

package/package.json

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