RPGJS v4 Documentation

Appearance

On this page

RpgClientEngine ​

RpgEngineHooks ​

ts
import { RpgClientEngine, RpgClientEngineHooks } from '@rpgjs/client'

const engine: RpgClientEngineHooks = {
    onConnected(engine: RpgClientEngine) {
        console.log('client is connected')
    }
}

Summary

onStart ​

  • Property: onStart
  • Type: (engine: RpgClientEngine) => boolean | any
  • Optional: true
  • Usage:

When the engine is started. If you send false, you prevent the client from connecting to the server

onStep ​

  • Property: onStep
  • Type: (engine: RpgClientEngine, t: number) => boolean | any
  • Optional: true
  • Usage:

Each frame

onInput ​

  • Property: onInput
  • Type: (engine: RpgClientEngine, obj: { input: string, playerId: number }) => any
  • Optional: true
  • Usage:

Recover keys from the pressed keyboard

onConnected ​

  • Property: onConnected
  • Type: (engine: RpgClientEngine, socket: any) => any
  • Optional: true
  • Usage:

Called when the user is connected to the server

onDisconnect ​

  • Property: onDisconnect
  • Type: (engine: RpgClientEngine, reason: any, socket: any) => any
  • Optional: true
  • Usage:

Called when the user is disconnected to the server

onConnectError ​

  • Property: onConnectError
  • Type: (engine: RpgClientEngine, err: any, socket: any) => any
  • Optional: true
  • Usage:

Called when there was a connection error

onWindowResize ​

  • Since: 3.0.0-beta.4
  • Property: onWindowResize
  • Type: () => any
  • Optional: true
  • Usage:

Called when window is resized

RpgClientEngine ​

Summary

renderer ​

  • Property: renderer
  • Type: RpgRenderer
  • Optional: true
  • Read Only
  • Usage:

Get the rendering

socket ​

  • Property: socket
  • Type: Socket
  • Optional: true
  • Read Only
  • Usage:

Get the socket

globalConfig ​

  • Property: globalConfig
  • Type: object
  • Optional: true
  • Read Only
  • Usage:

retrieve the global configurations assigned at the entry point

controls ​

Get the class managing the keyboard

objects ​

  • Property: objects
  • Type: Observable< { [id: string]: { object: any, paramsChanged: any } } >
  • Optional: true
  • Read Only
  • Usage:

Read objects synchronized with the server

tick ​

  • Since: 3.0.0-beta.5
  • Property: tick
  • Type: Observable<{ timestamp: number, deltaTime: number, frame: number }>
  • Optional: false
  • Read Only
  • Example:
ts
client.tick.subscribe(({ timestamp, deltaTime, frame }) => {

})
  • Usage:

Listen to each frame

Add Spritesheet ​

  • Since: 3.0.0-beta.3
  • Method: addSpriteSheet(spritesheetClass|spritesheetClass[])
  • Arguments:
    • { Class|Class[] } spritesheetClass. (Optional: false)
    • {string} url. Define the url of the resource (Optional: false)
    • {string} id. Define a resource identifier (Optional: false)
  • Return: Class
  • Usage:

Adds Spritesheet classes

Add Sound ​

  • Since: 3.0.0-beta.3
  • Method: addSound(soundClass|soundClass[])
  • Arguments:
    • { Class|Class[] } soundClass. (Optional: false)
    • {string} url. Define the url of the resource (Optional: false)
    • {string} id. Define a resource identifier (Optional: false)
  • Return: Class
  • Usage:

Adds Sound classes

Start Client Engine ​

Starts the client side and connects to the server

Next Frame ​

  • Since: 3.0.0-beta.5
  • Method: nextFrame()
  • Arguments:
    • {number} timestamp. Indicate the timestamp of the frame (Optional: false)
  • Usage:

Display the next frame. Useful for unit tests

Connect to server ​

  • Method: connection()
  • Return: void
  • Usage:

Connect to the server

vueApp ​

  • Property: vueApp
  • Type: Vue
  • Optional: true
  • Read Only
  • Usage:

VueJS Application instance

https://v3.vuejs.org/api/application-api.html

vueInstance ​

  • Property: vueInstance
  • Type: Vue Instance
  • Optional: true
  • Read Only
  • Usage:

VueJS Parent component instance

https://v3.vuejs.org/api/instance-properties.html

scene ​

  • Property: scene
  • Type: RpgScene
  • Optional: true
  • Read Only
  • Usage:

retrieves the current scene (SceneMap if you are on a map)

Connect to server ​

  • Method: getScene()
  • Return: RpgScene
  • Usage:

retrieves the current scene (SceneMap if you are on a map)

PIXI ​

  • Property: PIXI
  • Type: PIXI
  • Optional: true
  • Read Only
  • Usage:

get PIXI class

playerId ​

  • Property: playerId
  • Type: string
  • Optional: true
  • Read Only
  • Usage:

get player id of the current player

Game Type ​

  • Since: 4.0.0
  • Property: gameType
  • Type: string|undefined
  • Optional: true
  • Read Only
  • Usage:

Finds the game mode from the environment variables sent by the compiler. Can be used in menus to display options according to type

Game is dev mode ​

  • Since: 4.0.0
  • Property: isDev
  • Type: boolean
  • Optional: true
  • Read Only
  • Usage:

Find out if the game is in production or not, from the environment variables sent by the compiler.

Server URL ​

  • Since: 4.0.0
  • Property: serverUrl
  • Type: string
  • Optional: true
  • Read Only
  • Usage:

Get the server url. This is the url for the websocket

To customize the URL, use the matchMakerService configuration