# Common Commands


# Read/Give a name

  • Property: player.name
  • Type: string
  • Optional: false
  • Usage:
player.name = 'Link'

# Set Graphic

  • Method: player.setGraphic(graphic)
  • Arguments:
    • {string | number | (string | number)[]} graphic. (Optional: false)
  • Return: void
  • Usage:

Give the spritesheet identifier

Since version 3.0.0-rc, you can define several graphic elements. If you put a number, it represents the tile ID in the tileset

Example 1:

player.setGraphic(['body', 'shield'])

Example 2:

player.setGraphic(3) // Use tile #3

You must, on the client side, create the spritesheet in question. Guide: Create Sprite


# Change Map

  • Method: player.changeMap(mapId,positions)
  • Arguments:
    • {string} mapId. (Optional: false)
    • { {x: number, y: number, z?: number} | string } positions. (Optional: true)
  • Return: Promise< RpgMap | null> if map not exists
  • Usage:

Change your map. Indicate the positions to put the player at a place on the map

The map must be added to RpgServer beforehand. Guide: Create Map

You don't have to give positions but you can put a starting position in the TMX file. Guide: Start Position


# Create Dynamic Event

  • Since: 3.0.0-beta.4
  • Method: player.createDynamicEvent(eventObj
  • Arguments:
    • { { x: number, y: number, z?: number, event: eventClass } } eventsList. (Optional: true)
  • Return: { [eventId: string]: RpgEvent }
  • Usage:

Dynamically create an event in Scenario mode on the current map

@EventData({
 name: 'EV-1'
})
class MyEvent extends RpgEvent {
 onAction() {
     console.log('ok')
 }
} 

player.createDynamicEvent({
     x: 100,
     y: 100,
     event: MyEvent
})

You can also put an array of objects to create several events at once


# Remove Event

  • Since: 3.0.0-beta.4
  • Method: player.removeEvent(eventId)
  • Arguments:
    • {string} eventId. Event Name (Optional: false)
  • Return: boolean
  • Usage:

Removes an event from the map (Scenario Mode). Returns false if the event is not found


# Teleport on the map

  • Method: player.teleport(positions)
  • Arguments:
    • { {x: number, y: number, z?: number} | string } positions. (Optional: true)
  • Return: Promise<{ {x: number, y: number, z: number} }>
  • Usage:

Allows to change the positions of the player on the current map. You can put the X and Y positions or the name of the created shape on Tiled Map Editor. If you have several shapes with the same name, one position will be chosen randomly.

player.teleport({ x: 100, y: 500 })

or

player.teleport('my-shape-name')

If no parameter:

player.teleport() // { x: 0, y: 0, z: 0 }

# Load progress

  • Method: player.load(json)
  • Arguments:
    • {string} json. The JSON sent by the method save() (Optional: false)
  • Return: string
  • Usage:

Load the saved data with the method save() If the player was on a map, it repositions the player on the map.

const json = player.save()
player.load(json)

# Save progress

  • Method: player.save()
  • Return: string
  • Usage:

Returns a JSON with all the data to keep in memory. Then use the load() method to load the data

You can also use the JSON.stringify

const json = player.save() // or JSON.stringify(player)
player.load(json)

# Run Sync Changes

  • Method: player.syncChanges()
  • Return: void
  • Usage:

Run the change detection cycle. Normally, as soon as a hook is called in a class, the cycle is started. But you can start it manually The method calls the onChanges method on events and synchronizes all map data with the client.


# Get Current Map

  • Method: player.getCurrentMap()
  • Return: RpgMap | null
  • Usage:

Retrieves data from the current map

returns null if the player is not assigned to a map


# Show Animation

  • Method: player.showAnimation(graphic,animationName,replaceGraphic=false)
  • Arguments:
    • {string | string[]} graphic. spritesheet identifier (Optional: false)
    • {string} animationName. Name of the animation in the spritesheet (Optional: false)
    • {boolean} replaceGraphic. Replace the event graphic with the animation. After the end of the animation, the original graphic is reapplied (Optional: true)
  • Return: void
  • Usage:

Calls the showAnimation() method on the client side to display an animation on the player You must remember to create the spritesheet beforehand

For this type of spritesheet:

@Spritesheet({
 id: 'fire',
 image: require('')
 textures: {
     default: {
         animations: [
         
         ]
     }
  }
})
export class FireAnimation {}

Here is the call of the method:

player.showAnimation('fire', 'default')

If you don't want to put an animation on top of the event but replace the event graphic with another one, set true as last parameter. This is useful, if for example, you want to make an animated character (sword stroke when pressing a key) When the animation is finished, the original graphic is displayed again

player.showAnimation('sword_stroke', 'default', true)

Since version 3.0.0-rc, you can define several graphic elements. This allows you to animate them all at once

player.showAnimation(['body', 'sword_stroke'], 'default', true)

# Emit to client

  • Method: player.emit(key,value)
  • Arguments:
    • {string} key. (Optional: false)
    • {any} value. (Optional: false)
  • Return: void
  • Usage:

Emit data to clients with socket


# Listen to data from the client

  • Method: player.on(key,cb)
  • Arguments:
    • {string} key. (Optional: false)
    • {function} cb. (Optional: false)
  • Return: void
  • Usage:

Listen to the data (socket) sent by the client


# Listen one-time to data from the client

  • Since: 3.0.0-beta.5
  • Method: player.once(key,cb)
  • Arguments:
    • {string} key. (Optional: false)
    • {function} cb. (Optional: false)
  • Return: void
  • Usage:

Adds a one-time listener function for the event named eventName


# Removes all listeners of the client

  • Since: 3.0.0-beta.5
  • Method: player.off(key)
  • Arguments:
    • {string} key. (Optional: false)
  • Return: void
  • Usage:

Removes all listeners of the specified eventName.


# Play Sound

WARNING

Stability: 1 - Experimental This feature is subject to change, and is gated by a command line flag. It may change or be removed in future versions.

  • Since: 3.0.0-alpha.9
  • Method: player.playSound(soundId,allMap=false)
  • Arguments:
    • {string} soundId. Sound identifier, defined on the client side (Optional: false)
    • {boolean} allMap. Indicate if the sound is heard by the players on the map (Optional: true)
  • Return: void
  • Usage:

Allows to play a sound, heard only by the player or by the players of the map

Here is a sound, client side:

import { Sound } from '@rpgjs/client'
@Sound({
     id: 'town-music',
     sound: require('./sound/town.ogg')
})
export class TownMusic {}

Here is the call of the method, server side:

player.playSound('town-music')

If you want everyone to listen to the sound on the map:

player.playSound('town-music', true)

# Get/Set position

  • Property: position
  • Type: { x: number, y: number, z: number }
  • Optional: false
  • Usage:

Get/Set position x, y and z of player

z is the depth layer. By default, its value is 0. Collisions and overlays will be performed with other objects on the same z-position.


# Get Collision of tiles

  • Since: 3.0.0-beta.4
  • Property: tiles
  • Type: TileInfo[]
  • Optional: false
  • Read Only
  • Usage:

Recovers all the colliding tiles of the current player


# Get Collision of other players/events

  • Since: 3.0.0-beta.4
  • Property: otherPlayersCollision
  • Type: RpgPlayer | RpgEvent)[]
  • Optional: false
  • Read Only
  • Usage:

Recovers all other players and events colliding with the current player's hitbox


# Set Sizes

  • Method: player.setSizes(key,value)
  • Arguments:
    • { { width: number, height: number, hitbox?: { width: number, height: number } } } obj. (Optional: false)
  • Return: void
  • Usage:

Define the size of the player. You can set the hitbox for collisions

player.setSizes({
     width: 32,
     height: 32
})

and with hitbox:

player.setSizes({
    width: 32,
    height: 32,
    hitbox: {
        width: 20,
        height: 20
    }
})

# Set Hitbox

  • Method: player.setHitbox(width,height)
  • Arguments:
    • {number} width. (Optional: false)
    • {number} height. (Optional: false)
  • Return: void
  • Usage:

Define the hitbox of the player.

player.setHitbox(20, 20)

# Get Tile

  • Since: 3.0.0-beta.4
  • Method: player.getTile(x,y,z?)
  • Arguments:
    • {number} x. (Optional: false)
    • {number} y. (Optional: false)
    • {number} z. (Optional: true)
  • Return: object
  • Usage:

Retrieves a tile and checks if the player has a collision

const tileInfo = player.getTile(20, 30)
console.log(tileInfo)

Example of returns:

 {
     tiles: [
         {
             id: 0,
             terrain: [],
             probability: null,
             properties: [Object],
             animations: [],
             objectGroups: [],
             image: null,
             gid: 1
         }
     ],
     hasCollision: false,
     isOverlay: undefined,
     objectGroups: [],
     isClimbable: undefined,
     tileIndex: 93
 }

# Attach Shape

  • Since: 3.0.0-beta.3
  • Method: player.attachShape(parameters)
  • Arguments:
    • { { width: number, height: number, positioning?, name?, properties?: object } } obj. - positioning: Indicate where the shape is placed.
  • properties: An object in order to retrieve information when interacting with the shape
  • name: The name of the shape (Optional: false)
  • Return: RpgShape
  • Usage:

Attach a shape to the player (and allow interaction with it)

import { ShapePositioning } from '@rpgjs/server'

player.attachShape({
     width: 100,
     height: 100,
     positioning: ShapePositioning.Center
})

# Get Shapes

  • Since: 3.0.0-beta.3
  • Method: player.getShapes()
  • Return: RpgShape[]
  • Usage:

Returns all shapes assigned to this player


# Get In-Shapes

  • Since: 3.0.0-beta.3
  • Method: player.getInShapes()
  • Return: RpgShape[]
  • Usage:

Retrieves all shapes where the player is located


# Get Direction

  • Method: player.getDirection()
  • Return: Direction | number
  • Usage:

Get the current direction.

player.getDirection()

# Change direction

  • Enum: string
Tag Description
Direction.Left left
Direction.Right right
Direction.Up up
Direction.Down down
  • Method: player.changeDirection(direction)
  • Arguments:
    • {Direction} direction. (Optional: false)
  • Return: boolean direction has changed
  • Usage:

Changes the player's direction

import { Direction } from '@rpgjs/server'

player.changeDirection(Direction.Left)