@rpgjs/client 4.2.2 → 5.0.0-alpha.0

package/lib/Gui/Gui.js

@@ -1,490 +0,0 @@
-import { Utils } from '@rpgjs/common';
-import { RpgSound } from '../Sound/RpgSound.js';
-import { RpgClientEngine, RpgResource } from '../index.js';
-import { RpgRenderer } from '../Renderer.js';
-import { GameEngineClient } from '../GameEngine.js';
-import { VueGui } from './Vue.js';
-import { map, combineLatest, filter } from 'rxjs';
-const { elementToPositionAbsolute } = Utils;
-const COMPONENT_LIBRARIES = [
-    VueGui
-];
-export class Gui {
-    constructor() {
-        this.gui = {};
-        this.currentScene = null;
-        this.librariesInstances = [];
-    }
-    async _initialize(context, guiEl) {
-        this.clientEngine = context.inject(RpgClientEngine);
-        this.renderer = context.inject(RpgRenderer);
-        this.gameEngine = context.inject(GameEngineClient);
-        const { gui } = this.renderer.options;
-        for (let ui of gui) {
-            let name = ui.name;
-            if (Utils.isFunction(ui)) {
-                name = Utils.camelToKebab(name);
-            }
-            this.gui[name] = {
-                data: ui.data,
-                attachToSprite: ui.rpgAttachToSprite,
-                display: false,
-                name: name,
-                isFunction: Utils.isFunction(ui),
-                gui: ui
-            };
-        }
-        if (this.clientEngine.envs?.['VITE_REACT']) {
-            console.warn('[RPGJS] React GUI is experimental feature. So, its use may change over time. Not yet in production');
-            COMPONENT_LIBRARIES.push(await import('./React.js').then(m => m.ReactGui));
-        }
-        for (let componentClass of COMPONENT_LIBRARIES) {
-            const el = document.createElement('div');
-            elementToPositionAbsolute(el);
-            el.style['pointer-events'] = 'none';
-            guiEl.appendChild(el);
-            this.librariesInstances.push(new componentClass(el, this));
-        }
-        guiEl.style['pointer-events'] = 'none';
-    }
-    _setSceneReady(scene) {
-        this.currentScene = scene;
-        this.librariesInstances.forEach(instance => {
-            if (instance._setSceneReady)
-                instance._setSceneReady(scene);
-        });
-    }
-    getInjectObject() {
-        const self = this;
-        return {
-            /**
-             * Recovery of the current scene
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgScene'],
-             *      mounted() {
-             *          const scene = this.rpgScene()
-             *          scene.stopInputs()
-             *      }
-             * }
-             * ```
-             *
-             * @prop {Function returns RpgScene} [rpgScene]
-             * @memberof VueInject
-             * */
-            rpgScene: this.renderer.getScene.bind(this.renderer),
-            /**
-            * Retrieve the main container of the game
-            *
-            * ```js
-            * export default {
-            *      inject: ['rpgStage'],
-            *      mounted() {
-            *          const blur = new PIXI.BlurFilter()
-                       this.rpgStage.filters = [blur]
-            *      }
-            * }
-            * ```
-            *
-            * @prop {PIXI.Container} [rpgStage]
-            * @memberof VueInject
-            * */
-            rpgStage: this.renderer.stage,
-            /**
-             * Listen to all the objects present in the room (events and players)
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgObjects'],
-             *      mounted() {
-             *          this.obs = this.rpgObjects.subscribe((objects) => {
-             *              for (let id in objects) {
-             *                  const obj = objects[id]
-             *                  console.log(obj.object, obj.paramsChanged)
-             *              }
-             *          })
-             *      },
-             *      unmounted() {
-             *          this.obs.unsubscribe()
-             *      }
-             * }
-             * ```
-             *
-             * > remember to unsubscribe for memory leaks
-             *
-             * It is an observable that returns an object:
-             *
-             * * the key is the object identifier
-             * * The value is an object comprising:
-             *      * `object`: The entire object
-             *      * `paramsChanged`: Only the representation of the properties that have been changed on this object
-             *
-             * @prop {Observable<{ [objectId]: { object: object, paramsChanged: object } }>} [rpgObjects]
-             * @memberof VueInject
-             * */
-            rpgObjects: this.clientEngine.objects,
-            /**
-             * Recovers and listens to the current player
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgCurrentPlayer'],
-             *      mounted() {
-             *          this.obs = this.rpgCurrentPlayer.subscribe((obj) => {
-             *              console.log(obj.object, obj.paramsChanged)
-             *          })
-             *      },
-             *      unmounted() {
-             *          this.obs.unsubscribe()
-             *      }
-             * }
-             * ```
-             *
-             * * `object`: The whole player
-             * * `paramsChanged`: Only the representation of the properties that have been changed on this player
-             *
-             * @prop {Observable<{ object: object, paramsChanged: object }>} [rpgCurrentPlayer]
-             * @memberof VueInject
-             * */
-            rpgCurrentPlayer: this.clientEngine.objects
-                .pipe(map((objects) => objects[this.gameEngine.playerId]), filter(player => !!player)),
-            rpgGameEngine: this.gameEngine,
-            /**
-             * Tell the server to close the GUI.
-             *
-             * It is a function with 2 parameters:
-             * * `name`: The name of the component
-             * * `data`: The data you want to pass to the server
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgGuiClose'],
-             *      methods: {
-             *          close() {
-             *              this.rpgGuiClose('gui-name', {
-             *                  amount: 1000
-             *              })
-             *          }
-             *      }
-             * }
-             * ```
-             *
-             * @prop {Function(name, data)} [rpgGuiClose]
-             * @memberof VueInject
-             * */
-            rpgGuiClose(name, data) {
-                const guiId = name || this.$options?.name;
-                self.socket.emit('gui.exit', {
-                    guiId,
-                    data
-                });
-            },
-            /**
-             * Perform an interaction with the open GUI
-             *
-             * It is a function with 2 parameters:
-             * * `guiId`: The name of the component/Gui
-             * * `name`: The name of the interaction (defined on the server side)
-             * * `data`: Data to be sent
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgGuiInteraction'],
-             *      methods: {
-             *          changeGold() {
-             *              this.rpgGuiInteraction('gui-name', 'change-gold', {
-             *                  amount: 100
-             *              })
-             *          }
-             *      }
-             * }
-             * ```
-             *
-             * @prop {Function(guiId, name, data = {})} [rpgGuiInteraction]
-             * @memberof VueInject
-             * */
-            rpgGuiInteraction: (guiId, name, data = {}) => {
-                this.socket.emit('gui.interaction', {
-                    guiId,
-                    name,
-                    data
-                });
-            },
-            /**
-             * Listen to the keys that are pressed on the keyboard
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgKeypress'],
-             *      mounted() {
-             *          this.obs = this.rpgKeypress.subscribe(({ inputName, control }) => {
-             *              console.log(inputName) // "escape"
-             *              console.log(control.actionName) // "back"
-             *          })
-             *      },
-             *      unmounted() {
-             *          this.obs.unsubscribe()
-             *      }
-             * }
-             * ```
-             *
-             * @prop {Observable<{ inputName: string, control: { actionName: string, options: any } }>} [rpgKeypress]
-             * @memberof VueInject
-             * */
-            rpgKeypress: this.clientEngine.keyChange
-                .pipe(map(name => {
-                const control = this.clientEngine.controls.getControl(name);
-                return {
-                    inputName: name,
-                    control
-                };
-            })),
-            /**
-             * Recovers the socket.
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgSocket'],
-             *      mounted() {
-             *          const socket = this.rpgSocket()
-             *          socket.emit('foo', 'bar')
-             *      }
-             * }
-             * ```
-             *
-             * @prop {Function returns RpgScene} [rpgSocket]
-             * @memberof VueInject
-             * */
-            rpgSocket: () => this.socket,
-            /**
-             * The RpgGui object to control GUIs
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgGui'],
-             *      mounted() {
-             *         const guis = this.rpgGui.getAll()
-             *      }
-             * }
-             * ```
-             *
-             * @prop {RpgGui} [rpgGui]
-             * @memberof VueInject
-             * */
-            rpgGui: this,
-            /**
-             * Equivalent to RpgSound
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgSound'],
-             *      mounted() {
-             *         this.rpgSound.get('my-sound-id').play()
-             *      }
-             * }
-             * ```
-             *
-             * @prop {RpgSound} [rpgSound]
-             * @memberof VueInject
-             * */
-            rpgSound: RpgSound,
-            /**
-             * Find the game's image and sound library
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgResource'],
-             *      mounted() {
-             *         const resourceImage = this.rpgResource.spritesheets.get('image_id')
-             *         const resourceSound = this.rpgResource.sounds.get('sound_id')
-             *      }
-             * }
-             * ```
-             *
-             * @prop { { spritesheets: Map, sounds: Map } } [rpgResource]
-             * @memberof VueInject
-             * */
-            rpgResource: RpgResource,
-            /**
-             * Get RpgClientEngine instance
-             *
-             * ```js
-             * export default {
-             *      inject: ['rpgEngine'],
-             *      mounted() {
-             *         const vueInstance = this.rpgEngine.vueInstance
-             *      }
-             * }
-             * ```
-             *
-             * @prop {RpgClientEngine} [rpgEngine]
-             * @memberof VueInject
-             * */
-            rpgEngine: this.clientEngine
-        };
-    }
-    /** @internal */
-    _setSocket(socket) {
-        this.socket = socket;
-        this.socket.on('gui.open', ({ guiId, data }) => {
-            this.display(guiId, data);
-        });
-        this.socket.on('gui.tooltip', ({ players, display }) => {
-            for (let playerId of players) {
-                const sprite = this.renderer.getScene()?.getSprite(playerId);
-                if (sprite)
-                    sprite.guiDisplay = display;
-            }
-        });
-        this.socket.on('gui.exit', (guiId) => {
-            this.hide(guiId);
-        });
-    }
-    /** @internal */
-    _setGui(id, obj) {
-        const guiObj = this.get(id);
-        if (!guiObj) {
-            throw `The GUI named ${id} is non-existent. Please add the component in the gui property of the decorator @RpgClient`;
-        }
-        for (let key in obj) {
-            guiObj[key] = obj[key];
-        }
-        this.librariesInstances.forEach(instance => {
-            instance.gui = Object.assign({}, this.gui);
-        });
-    }
-    /**
-   * Get a GUI. You retrieve GUI data and information whether it is displayed or not
-   *
-   * ```ts
-   * import { RpgGui } from '@rpgjs/client'
-   *
-   * const gui = RpgGui.get('my-gui')
-   * console.log(gui.display) // false
-   * ```
-   *
-   * @title Get a GUI
-   * @method RpgGui.get(id)
-   * @param {string} id
-   * @returns { { data: any, display: boolean } }
-   * @memberof RpgGui
-   */
-    get(id) {
-        if (typeof id != 'string') {
-            id = id.name;
-        }
-        return this.gui[id];
-    }
-    /**
-     * Get all GUI. You retrieve GUI data and information whether it is displayed or not
-     *
-     * ```ts
-     * import { RpgGui } from '@rpgjs/client'
-     *
-     * const gui = RpgGui.getAll()
-     * console.log(gui) // { 'rpg-dialog': { data: {}, display: true } }
-     * ```
-     *
-     * @title Get all GUI
-     * @method RpgGui.getAll()
-     * @returns { { [guiName]: { data: any, display: boolean }  }}
-     * @memberof RpgGui
-     */
-    getAll() {
-        return this.gui;
-    }
-    /**
-     * Checks if the GUI exists RpgClient's gui array
-     *
-     * ```ts
-     * import { RpgGui } from '@rpgjs/client'
-     *
-     * RpgGui.exists('my-gui') // true
-     * ```
-     *
-     * @title GUI Exists ?
-     * @method RpgGui.exists(id)
-     * @param {string} id
-     * @returns {boolean}
-     * @memberof RpgGui
-     */
-    exists(id) {
-        return !!this.get(id);
-    }
-    /**
-     * Calls a GUI according to identifier. You can send retrievable data in the component
-     *
-     * ```ts
-     * import { RpgGui } from '@rpgjs/client'
-     *
-     * RpgGui.display('my-gui')
-     * ```
-     *
-     * @title Display GUI
-     * @method RpgGui.display(id,data)
-     * @param {string} id
-     * @param {object} [data]
-     * @returns {void}
-     * @memberof RpgGui
-     */
-    display(id, data = {}) {
-        this._setGui(id, {
-            display: true,
-            data
-        });
-    }
-    /**
-     * Hide a GUI according to its identifier
-     *
-     * ```ts
-     * import { RpgGui } from '@rpgjs/client'
-     *
-     * RpgGui.hide('my-gui')
-     * ```
-     *
-     * @title Hide GUI
-     * @method RpgGui.hide(id)
-     * @param {string} id
-     * @returns {void}
-     * @memberof RpgGui
-     */
-    hide(id) {
-        this._setGui(id, {
-            display: false
-        });
-    }
-    /** @internal */
-    clear() {
-        this.gui = {};
-    }
-    /** @internal */
-    tooltipPosition(position) {
-        const scene = this.renderer.getScene();
-        const viewport = scene?.viewport;
-        if (viewport) {
-            const currentZoom = viewport.scale.x;
-            const left = (position.x - viewport.left) * currentZoom;
-            const top = (position.y - viewport.top) * currentZoom;
-            return {
-                transform: `translate(${left}px,${top}px)`
-            };
-        }
-        return {};
-    }
-    /** @internal */
-    tooltipFilter(sprites) {
-        return sprites.filter(tooltip => tooltip.guiDisplay);
-    }
-    /** @internal */
-    get listenTooltipObjects() {
-        return combineLatest([
-            this.clientEngine.gameEngine.all,
-            this.currentScene?.objectsMoving
-        ]).pipe(map(([objects]) => {
-            return Object.values(objects).map((obj) => obj.object);
-        }));
-    }
-}
-export const RpgGui = new Gui();
-//# sourceMappingURL=Gui.js.map

package/lib/Gui/Gui.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Gui.js","sourceRoot":"","sources":["../../src/Gui/Gui.ts"],"names":[],"mappings":"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"}

package/lib/Gui/React.d.ts

@@ -1,15 +0,0 @@
-/// <reference types="react" />
-import type { Gui } from './Gui.js';
-export { useStore } from '@nanostores/react';
-export declare const RpgReactContext: import("react").Context<any>;
-export declare const useObjects: () => any[];
-export declare const useCurrentPlayer: () => {};
-export declare const useEventPropagator: () => import("react").MutableRefObject<null>;
-export declare class ReactGui {
-    private app;
-    private clientEngine;
-    private renderer;
-    private _gui;
-    constructor(rootEl: HTMLDivElement, parentGui: Gui);
-    set gui(val: any);
-}

package/lib/Gui/React.js

@@ -1,113 +0,0 @@
-import { createRoot } from 'react-dom/client';
-import { createElement, useState, createContext, useEffect, useContext, useSyncExternalStore, useRef } from 'react';
-import { EVENTS_MAP, RpgRenderer } from '../Renderer.js';
-import { BehaviorSubject, map, tap } from 'rxjs';
-import { inject } from '../inject.js';
-export { useStore } from '@nanostores/react';
-export const RpgReactContext = createContext({});
-// TODO
-export const useObjects = () => {
-    const [objects, setObjects] = useState([]);
-    const { rpgObjects } = useContext(RpgReactContext);
-    useEffect(() => {
-        rpgObjects
-            .pipe(map((objects) => Object.values(objects).map((obj) => obj.object)))
-            .subscribe(setObjects);
-    }, []);
-    return objects;
-};
-// TODO
-export const useCurrentPlayer = () => {
-    const { rpgCurrentPlayer } = useContext(RpgReactContext);
-    const currentPlayerRef = useRef({});
-    let _onChanges;
-    const subscribe = (onChanges) => {
-        _onChanges = onChanges;
-        return () => {
-            _onChanges = null;
-        };
-    };
-    useEffect(() => {
-        const ob$ = rpgCurrentPlayer
-            .pipe(map((player) => player.object), tap((player) => currentPlayerRef.current = player));
-        const subscription = ob$.subscribe(() => {
-            _onChanges?.();
-        });
-        return () => subscription.unsubscribe();
-    }, []);
-    return useSyncExternalStore(subscribe, () => currentPlayerRef.current);
-};
-export const useEventPropagator = () => {
-    const ref = useRef(null);
-    useEffect(() => {
-        if (ref.current) {
-            const element = ref.current;
-            const eventListeners = {};
-            const renderer = inject(RpgRenderer);
-            EVENTS_MAP.MouseEvent.forEach(eventType => {
-                const listener = event => renderer.propagateEvent(event);
-                element.addEventListener(eventType, listener);
-                eventListeners[eventType] = listener;
-            });
-            return () => {
-                EVENTS_MAP.MouseEvent.forEach(eventType => {
-                    element.removeEventListener(eventType, eventListeners[eventType]);
-                });
-            };
-        }
-    }, [ref]);
-    return ref;
-};
-export class ReactGui {
-    //private _tooltips: BehaviorSubject<any[]> = new BehaviorSubject([] as any)
-    constructor(rootEl, parentGui) {
-        this._gui = new BehaviorSubject([]);
-        this.app = createRoot(rootEl);
-        this.clientEngine = parentGui.clientEngine;
-        this.renderer = this.clientEngine.renderer;
-        const GuiTooltip = (ui) => {
-            return () => {
-                const [_tooltip, setTooltip] = useState([]);
-                useEffect(() => {
-                    parentGui.listenTooltipObjects.subscribe(setTooltip);
-                    // force combineLatest to emit first value
-                    parentGui.currentScene?.objectsMoving.next({});
-                }, [parentGui.currentScene]);
-                return parentGui.tooltipFilter(_tooltip).map(sprite => createElement('div', {
-                    style: parentGui.tooltipPosition({ x: sprite.position.x, y: sprite.position.y }),
-                    key: sprite.id,
-                }, createElement(ui.gui, {
-                    spriteData: sprite,
-                    ...(ui.data || {}),
-                })));
-            };
-        };
-        const GuiWrapper = () => {
-            const [_gui, setGui] = useState([]);
-            useEffect(() => {
-                this._gui.subscribe(gui => setGui(gui));
-            }, []);
-            return createElement(RpgReactContext.Provider, {
-                value: parentGui.getInjectObject()
-            }, ..._gui.filter(ui => ui.display && !ui.attachToSprite).map(ui => createElement('div', {
-                key: ui.name,
-                style: { 'pointerEvents': 'auto' },
-            }, createElement(ui.gui, ui.data || {}))), ..._gui.filter(ui => ui.display && ui.attachToSprite).map(ui => createElement('div', {
-                key: ui.name,
-                style: { 'pointerEvents': 'auto' },
-            }, createElement(GuiTooltip(ui)))));
-        };
-        this.app.render(createElement(GuiWrapper));
-    }
-    set gui(val) {
-        let array = [];
-        for (let key in val) {
-            // ignore vuejs component
-            if (!val[key].isFunction)
-                continue;
-            array.push(val[key]);
-        }
-        this._gui.next(array);
-    }
-}
-//# sourceMappingURL=React.js.map

package/lib/Gui/React.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"React.js","sourceRoot":"","sources":["../../src/Gui/React.ts"],"names":[],"mappings":"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"}

package/lib/Gui/Vue.d.ts

@@ -1,13 +0,0 @@
-import type { Gui } from './Gui.js';
-export declare class VueGui {
-    private parentGui;
-    private renderer;
-    private gameEngine;
-    private clientEngine;
-    private app;
-    private vm;
-    private socket;
-    constructor(rootEl: HTMLDivElement, parentGui: Gui);
-    _setSceneReady(): void;
-    set gui(val: any);
-}