@rpgjs/server 4.0.0-beta.1 → 4.0.0-beta.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rpgjs/server",
-  "version": "4.0.0-beta.1",
+  "version": "4.0.0-beta.3",
   "description": "",
   "main": "./lib/index.js",
   "types": "./lib/express/index.d.ts",
@@ -15,17 +15,14 @@
     ".": "./lib/index.js",
     "./express": "./lib/express/server.js"
   },
-  "files": [
-    "lib"
-  ],
   "keywords": [],
   "author": "Samuel Ronce",
   "license": "MIT",
   "dependencies": {
-    "@rpgjs/common": "^4.0.0-beta.1",
-    "@rpgjs/database": "^4.0.0-beta.1",
-    "@rpgjs/tiled": "^4.0.0-beta.1",
-    "@rpgjs/types": "^4.0.0-beta.1",
+    "@rpgjs/common": "^4.0.0-beta.3",
+    "@rpgjs/database": "^4.0.0-beta.3",
+    "@rpgjs/tiled": "^4.0.0-beta.3",
+    "@rpgjs/types": "^4.0.0-beta.3",
     "axios": "^1.3.6",
     "express": "^4.18.2",
     "lodash.merge": "^4.6.2",
@@ -36,11 +33,12 @@
     "simple-room": "^2.0.2",
     "socket.io": "^4.6.1"
   },
-  "gitHead": "b12826ef87716da2691da3bae02d7d7c66772789",
+  "gitHead": "952bdc2cecd04ad8dd9341ca0d51bf64efcd2bab",
   "devDependencies": {
     "typescript": "^5.0.4"
   },
   "alias": {
     "express": "./lib/express/server"
-  }
+  },
+  "type": "module"
 }

package/src/Game/Map.ts

@@ -0,0 +1,513 @@
+import { RpgCommonMap, Utils, RpgShape, RpgCommonGame, AbstractObject } from '@rpgjs/common'
+import { TiledParserFile, TiledParser, TiledTileset } from '@rpgjs/tiled'
+import { EventOptions } from '../decorators/event'
+import { RpgPlayer, EventMode, RpgEvent, RpgClassEvent } from '../Player/Player'
+import { Move } from '../Player/MoveManager'
+import { RpgServerEngine } from '../server'
+import { Observable } from 'rxjs'
+import path from 'path'
+import { HitBox, MovingHitbox, Position } from '@rpgjs/types'
+import { World } from 'simple-room'
+
+export type EventPosOption = {
+    x: number,
+    y: number,
+    z?: number,
+    event: EventOptions
+}
+export type EventOption = EventPosOption | EventOptions
+
+export type PlayersList = {
+    [eventId: string]: RpgEvent
+}
+
+export type EventsList = {
+    [playerId: string]: RpgPlayer
+}
+
+class AutoEvent extends RpgEvent {
+    static mode: EventMode
+    static hitbox: any = {}
+
+    onInit() {
+        const { graphic, direction, speed, frequency, move } = this.properties
+        if (graphic) {
+            this.setGraphic(graphic)
+        }
+        if (direction) {
+            this.changeDirection(direction)
+        }
+        if (speed) {
+            this.speed = speed
+        }
+        if (frequency) {
+            this.frequency = frequency
+        }
+        if (move == 'random') {
+            this.infiniteMoveRoute([Move.tileRandom()])
+        }
+    }
+
+    async onAction(player: RpgPlayer) {
+        const { text } = this.properties
+        if (text) {
+            await player.showText(text, {
+                talkWith: this
+            })
+        }
+    }
+}
+
+export class RpgMap extends RpgCommonMap {
+
+    public _events: EventOption[]
+    public file: any
+
+    /** 
+    * @title event list
+    * @prop { { [eventId: string]: RpgEvent } } [events]
+    * @memberof Map
+    * */
+    public events: EventsList = {}
+
+    constructor(private _server: RpgServerEngine) {
+        super()
+    }
+
+    // alias of users property in simple-room package
+    /**
+     * @title Players list
+     * @prop { { [playerId: string]: RpgPlayer } } [players]
+     * @readonly
+     * @memberof Map
+     */
+    get players(): PlayersList {
+        return this['users']
+    }
+
+    /**
+     * @title Number of players
+     * @prop {number} [nbPlayers]
+     * @readonly
+     * @memberof Map
+     */
+    get nbPlayers(): number {
+        return Object.keys(this.players).length
+    }
+
+    async load() {
+        if (RpgCommonMap.buffer.has(this.id)) {
+            return
+        }
+        const data = await this.parseTmx(this.file)
+        super.load(data)
+        this.getAllObjects().forEach(this.createShape.bind(this))
+        this.loadProperties((data as any).properties)
+        this._server.workers?.call('loadMap', {
+            id: this.id,
+            data
+        })
+        RpgCommonMap.buffer.set(this.id, this)
+        this.loadCommonEvents(this._server.inputOptions.events)
+        this.createDynamicEvent(this._events as EventPosOption[])
+        if (this.onLoad) this.onLoad()
+    }
+
+    /**
+     * Update the map with new data. Data can be a string (TMX content) or an object (parsed TMX content)
+     * New Map data will be sent to all players on the map
+     *
+     * @title Update map
+     * @method map.update(data)
+     * @since 4.0.0
+     * @returns {Promise<void>}
+     * @param {object | string} data
+     * @memberof Map
+     */
+    async update(data: object | string): Promise<void> {
+        let objectData
+        // Data is XML (TMX content)
+        if (typeof data == 'string') {
+            objectData = await this.parseTmx(data, this.file)
+        }
+        else {
+            objectData = data
+        }
+        super.load(objectData)
+        RpgCommonMap.buffer.set(this.id, this)
+        this.clearShapes()
+        this.getAllObjects().forEach(this.createShape.bind(this))
+        for (let playerId in this.players) {
+            const player = this.players[playerId]
+            player.emitSceneMap()
+        }
+    }
+
+    /**
+     * Update tileset with new data. Data can be a string (TSX content) or an object (TiledTileset)
+     * Cache will be removed for this tileset
+     * New tileset data will be sent to all players on the map
+     * Warning: tileset is not updated for all maps, only for the current map
+     * 
+     * @title Update tileset
+     * @method map.updateTileset(data)
+     * @since 4.0.0
+     * @returns {<void>}
+     * @param {TiledTileset | string} data
+     * @memberof Map
+     */
+    updateTileset(data: TiledTileset | string) {
+        let objectData: TiledTileset
+        // Data is XML (TMX content)
+        if (typeof data == 'string') {
+            const parser = new TiledParser(data, this.file)
+            objectData = parser.parseTileset()
+        }
+        else {
+            objectData = data
+        }
+        this.removeCacheTileset(objectData.name)
+        this.update({
+            ...this.data,
+            tilesets: this.data.tilesets.map((tileset: any) => {
+                if (tileset.name == objectData.name) {
+                    objectData.firstgid = tileset.firstgid
+                    return objectData
+                }
+                return tileset
+            })
+        })
+    }
+
+    /**
+     * Remove the map from the server. If there are still players on the map, an error will be thrown
+     * Not delete the map file, only in memory
+     * 
+     * @title Remove map
+     * @method map.remove()
+     * @since 4.0.0
+     * @returns {void}
+     * @throws {Error} If there are still players on the map
+     * @memberof Map
+     * */
+    remove(ignorePlayers = false): never | void {
+        const players = Object.values(this.players)
+        if (players.length > 0 && !ignorePlayers) {
+            throw new Error(`Cannot remove map ${this.id} because there are still players on it`)
+        }
+        for (let eventId in this.events) {
+            this.removeEvent(eventId)
+        }
+        RpgCommonMap.buffer.delete(this.id)
+        World.removeRoom(this.id)
+    }
+
+    private async parseTmx(file: string, relativePath: string = '') {
+        // @ts-ignore
+        const hasAssetsPath = !!import.meta.env.VITE_BUILT
+        const parser = new TiledParserFile(
+            file,
+            {
+                basePath: process.env.NODE_ENV == 'test' ? '.' : '',
+                staticDir: hasAssetsPath ? path.join(this._server.inputOptions.basePath, this._server.assetsPath) : '',
+                relativePath
+            }
+        )
+        const data = await parser.parseFilePromise({
+            getOnlyBasename: hasAssetsPath
+        })
+
+        return data
+    }
+
+    private loadProperties(properties: {
+        [key: string]: any
+    }) {
+        for (let key in properties) {
+            this[key] = properties[key]
+        }
+    }
+
+    get game(): RpgCommonGame {
+        return this._server.gameEngine
+    }
+
+    // Hook: called by simple-room package
+    onLeave(player: RpgPlayer) {
+        this.removeObject(player)
+    }
+
+    private loadCommonEvents(commonEvents: RpgClassEvent<RpgEvent>[]) {
+        let events: EventPosOption[] = []
+        this.getShapes().forEach(shape => {
+            const findEvent = commonEvents.find(event => event._name == shape.name)
+            if (!findEvent) return
+            const { x, y, } = shape.hitbox
+            events.push({
+                x,
+                y,
+                event: findEvent
+            })
+        })
+        this.createDynamicEvent(events)
+    }
+
+    // TODO
+    autoLoadEvent() {
+        this.getShapes().forEach(shape => {
+            const { properties } = shape
+            const { x, y, pos, w, h } = shape.hitbox
+            if (shape.isEvent() && !this.events[shape.name]) {
+                const mode = properties.mode || EventMode.Shared
+                AutoEvent.prototype['_name'] = shape.name
+                AutoEvent.mode = mode
+                AutoEvent.hitbox = {
+                    width: 32,
+                    height: 16
+                }
+                const event = this.createEvent({
+                    x,
+                    y,
+                    event: AutoEvent
+                }, mode, shape)
+                if (event) this.events[shape.name] = event
+            }
+        })
+    }
+
+    /**
+     * Edit a tile on the map. All players on the map will see the modified tile
+     * 
+     * 
+     * @title Change Tile in map
+     * @since 3.0.0-beta.4
+     * @method map.setTile(x,y,layer,tileInfo)
+     * @param {number} x Position X
+     * @param {number} y Position Y
+     * @param {string | ((layer: any) => boolean)} layer Name of the layer where you want to put a tile. OYou can also put a function that will act as a filter. The first parameter is the layer and you return a boolean to indicate if you modify the tile of this layer or not
+     * @param {object} tileInfo Object with the following properties:
+     *  - {number} gid: The tile number in tileset (from 1)
+     *  - {object} properties Property of the tile. You own object. To set a collision, set the `collision:true` property
+     * @example
+     * ```ts
+     * map.setTile(15, 18, 'mylayer', { gid: 2 })
+     * ```
+     * @returns {void}
+     * @memberof Map
+     */
+    setTile(x: number, y: number, layerFilter: string | ((layer: any) => boolean), tileInfo: {
+        gid: number,
+        properties?: object
+    }): any {
+        const tiles = super.setTile(x, y, layerFilter, tileInfo)
+        const players: RpgPlayer[] = Object.values(this['users'])
+        for (let player of players) {
+            player.emit('changeTile', tiles)
+        }
+        return tiles
+    }
+
+    getEventShape(eventName: string): RpgShape | undefined {
+        return this.getShapes().find(shape => shape.name == eventName)
+    }
+
+    /**
+     * Dynamically create an event in Shared mode
+     * 
+     * ```ts
+     * @EventData({
+     *  name: 'EV-1'
+     * })
+     * class MyEvent extends RpgEvent {
+     *  onAction() {
+     *      console.log('ok')
+     *  }
+     * } 
+     *
+     * map.createDynamicEvent({
+     *      x: 100,
+     *      y: 100,
+     *      event: MyEvent
+     * })
+     * ```
+     * 
+     * You can also put an array of objects to create several events at once
+     * 
+     * @title Create Dynamic Event
+     * @since 3.0.0-beta.4
+     * @method map.createDynamicEvent(eventObj|eventObj[])
+     * @param { { x: number, y: number, z?: number, event: eventClass } } eventsList
+     * @returns { { [eventId: string]: RpgEvent } }
+     * @memberof Map
+     */
+    createDynamicEvent(eventsList: EventPosOption | EventPosOption[]): {
+        [eventId: string]: RpgEvent
+    } {
+        if (!eventsList) return {}
+        if (!Utils.isArray(eventsList)) {
+            eventsList = [eventsList as EventPosOption]
+        }
+        const events = this.createEvents(eventsList as EventPosOption[], EventMode.Shared)
+        let ret = {}
+        for (let key in events) {
+            this.events[key] = events[key]
+            this.events[key].updateInVirtualGrid()
+            this.events[key].execMethod('onInit')
+            // force to get Proxy object to sync with client
+            ret = { ...ret, [key]: this.events[key] }
+        }
+        return ret
+    }
+
+    /**
+     * Get Event in current map
+     * @title Get Event
+     * @since 3.0.0-beta.7
+     * @method map.getEvent(eventId)
+     * @param {string} eventId Event Id
+     * @returns {RpgEvent | undefined}
+     * @memberof Map
+     */
+    getEvent<T extends RpgEvent>(eventId: string): T | undefined {
+        return this.events[eventId] as T
+    }
+
+    /**
+     * Removes an event from the map. Returns false if the event is not found
+     * @title Remove Event
+     * @since 3.0.0-beta.4
+     * @method map.removeEvent(eventId)
+     * @param {string} eventId Event Name
+     * @returns {boolean}
+     * @memberof Map
+     */
+    removeEvent(eventId: string): boolean {
+        if (!this.events[eventId]) return false
+        this.removeObject(this.events[eventId])
+        delete this.events[eventId]
+        return true
+    }
+
+    createEvent(obj: EventPosOption, mode: EventMode, shape?: RpgShape): RpgEvent | null {
+        let event: any, position: Position | undefined
+
+        // We retrieve the information of the event ([Event] or [{event: Event, x: number, y: number}])
+        if (obj.x === undefined) {
+            event = obj
+        }
+        else {
+            event = obj.event
+            position = { x: obj.x, y: obj.y, z: 0 }
+        }
+
+        // The event is ignored if the mode is different.
+        if (event.mode != mode) {
+            return null
+        }
+
+        // Create an instance of RpgEvent and assign its options
+        const ev = this.game.addEvent<RpgEvent>(event)
+        const _shape = shape || this.getEventShape(ev.name)
+        ev.map = this.id
+        ev.server = this._server
+        ev.width = event.width || this.tileWidth
+        ev.height = event.height || this.tileHeight
+        if (_shape && _shape.properties) ev.properties = _shape.properties
+        if (event.hitbox) ev.setHitbox(event.hitbox.width, event.hitbox.height)
+        ev.teleport(position || ev.name)
+        return ev
+    }
+
+    createEvents(eventsList: EventOption[], mode: EventMode): EventsList {
+        const events = {}
+
+        if (!eventsList) return events
+
+        for (let obj of eventsList) {
+            const ev = this.createEvent(obj as EventPosOption, mode)
+            if (ev) {
+                events[ev.id] = ev
+            }
+        }
+
+        return events
+    }
+
+    private removeObject(object: RpgPlayer | RpgEvent) {
+        this.getShapes().forEach(shape => shape.out(object))
+        const events: RpgPlayer[] = Object.values(this.game.world.getObjectsOfGroup(this.id, object))
+        for (let event of events) {
+            object.getShapes().forEach(shape => shape.out(event))
+            event.getShapes().forEach(shape => shape.out(object))
+        }
+        object._destroy$.next()
+        object._destroy$.complete()
+        this.grid.clearObjectInCells(object.id)
+        for (let playerId in this.players) {
+            if (object.id == playerId) continue
+            const otherPlayer = this.players[playerId]
+            if (otherPlayer.following?.id == object.id) {
+                otherPlayer.cameraFollow(otherPlayer)
+            }
+        }
+        // last player before removed of this map 
+        if (this.nbPlayers === 1 && object.type === 'player') {
+            // clear cache for this map
+            this.remove(true)
+        }
+    }
+
+    /**
+     * Allows to create a temporary hitbox on the map that can have a movement
+For example, you can use it to explode a bomb and find all the affected players, or during a sword strike, you can create a moving hitbox and find the affected players again
+     * @title Create a temporary and moving hitbox
+     * @since 3.2.0
+     * @method map.createMovingHitbox(hitboxes,options)
+     * @param {Array<{ width: number, height: number, x: number, y: number }>} hitboxes Create several hitboxes that will give an effect of movement
+     * @param {object} [options]
+     * @param {speed} [options.speed=1] speed of movement (in frames)
+     * @returns {Observable<AbstractObject>} You find the methods of position and movement of an event
+     * @memberof Map
+     * @example
+     * 
+     * ```ts
+     * // Two hitboxes that will be done very quickly
+     * map.createMovingHitbox(
+     *   [ 
+     *      { x: 0, y: 0, width: 100, height: 100 },
+     *      { x: 20, y: 0, width: 100, height: 100 } 
+     *   ]
+     * ).subscribe({
+     *      next(hitbox) {
+     *          console.log(hitbox.otherPlayersCollision)
+     *      },
+     *      complete() {
+     *          console.log('finish')
+     *      }
+     * })
+     * ```
+     */
+    createMovingHitbox(
+        hitboxes: Pick<HitBox, 'width' | 'height' | 'x' | 'y'>[],
+        options: MovingHitbox = {}): Observable<AbstractObject> {
+        return this._createMovingHitbox<RpgCommonGame>(
+            this.game,
+            this._server.tick as any,
+            this.id,
+            hitboxes,
+            options) as any
+    }
+
+    setSync(schema: any) {
+        return this.$setSchema(schema)
+    }
+}
+
+export interface RpgMap {
+    sounds: string[]
+    $schema: any
+    $setSchema: (schema: any) => void
+    $patchSchema: (schema: any) => void
+    $snapshotUser: (userId: string) => any
+    onLoad()
+}

package/src/Game/WorldMaps.ts

@@ -0,0 +1,45 @@
+import { RpgCommonWorldMaps, Utils } from '@rpgjs/common'
+import { TiledWorld, TiledMap, TiledWorldMap } from '@rpgjs/tiled'
+import { RpgClassMap, SceneMap } from '../Scenes/Map'
+import { RpgMap } from './Map'
+
+export type RpgTiledWorldMap = {
+    id?: string
+    fileName: string | TiledMap
+} & TiledWorldMap
+
+export type RpgTiledWorld  = {
+    maps: RpgTiledWorldMap[]
+} & TiledWorld
+
+export interface WorldMap extends RpgTiledWorld {
+    id?: string,
+    basePath?: string
+}
+
+export class RpgWorldMaps extends RpgCommonWorldMaps {
+    load(world: WorldMap, sceneMap: SceneMap) {
+        for (let worldMap of world.maps) {
+            const { fileName } = worldMap
+            let id, map: RpgClassMap<RpgMap>
+            if (worldMap.id) {
+                id = worldMap.id
+            }
+            else if (Utils.isString(fileName)) {
+                id = Utils.extractId(fileName)
+            }
+            const create = () => sceneMap.createDynamicMap({
+                id,
+                file: world.basePath ? `${world.basePath}/${fileName}` : fileName
+            })
+            if (!id) {
+                map = create()
+            }
+            else {
+                map = sceneMap.getMapBydId(id) ?? create()
+            }
+            this.addMap(worldMap, map)
+        }
+        return this
+    }
+}

package/src/Gui/DialogGui.ts

@@ -0,0 +1,67 @@
+import { PrebuiltGui } from '@rpgjs/common'
+import { Gui } from './Gui'
+import { RpgPlayer } from '../Player/Player'
+import { IGui } from '../Interfaces/Gui'
+import { Move } from '../Player/MoveManager'
+
+export enum DialogPosition {
+    Top = 'top',
+    Bottom = 'bottom',
+    Middle = 'middle'
+}
+
+export type Choice = { text: string, value: any }
+
+export interface DialogOptions {
+    choices?: Choice[],
+    position?: DialogPosition,
+    fullWidth?: boolean,
+    autoClose?: boolean,
+    tranparent?: boolean,
+    typewriterEffect?: boolean,
+    talkWith?: RpgPlayer
+}
+
+export class DialogGui extends Gui implements IGui {
+    constructor(player: RpgPlayer) {
+        super(PrebuiltGui.Dialog, player)
+    }
+
+    openDialog(message: string, options: DialogOptions): Promise<any> {
+        if (!options.choices) options.choices = []
+        if (options.autoClose == undefined) options.autoClose = false
+        if (!options.position) options.position = DialogPosition.Bottom
+        if (options.fullWidth == undefined) options.fullWidth = true
+        if (options.typewriterEffect  == undefined) options.typewriterEffect = true
+        const event = options.talkWith
+        let memoryDir
+        if (event) {
+            memoryDir = event.direction
+            event.breakRoutes(true)
+            event.moveRoutes([ Move.turnTowardPlayer(this.player) ])
+        }
+        const data = {
+            autoClose: options.autoClose,
+            position: options.position,
+            fullWidth: options.fullWidth,
+            typewriterEffect: options.typewriterEffect,
+            // remove value property. It is not useful to know this on the client side.
+            choices: options.choices.map(choice => ({
+                text: choice.text
+            }))
+        }
+        return super.open({
+            message,
+            ...data
+        }, {
+            waitingAction: true,
+            blockPlayerInput: true
+        }).then((val: any) => {
+            if (event) {
+                event.replayRoutes()
+                event.direction = memoryDir
+            }
+            return val
+        })
+    }
+}