Skip to main content

​
GUI Commands

Dialogs, menus, notifications, and custom GUI commands.

​
Members

​
Call custom GUI

Call a custom Gui 
// Calls a client-side component, created with VueJS, named "inn".
const gui = player.gui('inn')

 // You can wait for actions on the menu. It only works if the menu is open.
gui.on('accept', () => {
     player.allRecovery()
})

// The GUI is opened by passing recoverable data on the client side.
gui.open({ hello: 'world' })
When opening the GUI, one can give options 
await gui.open({ hello: 'world' }, {
     waitingAction: true,
     blockPlayerInput: true
})
// After the GUI is closed
  • blockPlayerInput: while the GUI is open, the player can not move on the map
  • waitingAction: We explicitly wait until the GUI is closed for the promise to be resolved.
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: GuiManagerMixin

​
Signature

player.gui(guiId)

​
Parameters

  • guiId: string

​
Call Game Over Menu

Calls game over menu. Opens the GUI named rpg-gameover 
const selection = await player.callGameover()
if (selection?.id === 'title') {
    await player.gui('rpg-title-screen').open()
}
if (selection?.id === 'load') {
    await player.showLoad()
}
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.callGameover(options)

​
Parameters

  • options?: GameoverGuiOptions

​
Call Main Menu

Calls main menu. Opens the GUI named rpg-main-menu
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.callMainMenu(options)

​
Parameters

  • options?: MenuGuiOptions

​
Call Shop Menu

Calls shop menu. Opens the GUI named rpg-shop
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: GuiManagerMixin

​
Signature

player.callShop()

​
Parameters

  • items: any[] | { items: any[] sell?: Record<string, number> | Array<{ id: string; multiplier: number }> sellMultiplier?: number message?: string face?: { id: string; expression?: string } }

​
Close custom GUI

Closes the GUI and removes it from memory
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: GuiManagerMixin

​
Signature

player.removeGui(guiId,data)

​
Parameters

  • guiId: string
  • data?: any

​
Displays a notification

Displays a notification . Opens the GUI named rpg-notification
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.showNotification()

​
Parameters

  • message: string
  • options?: { time?: number; icon?: string; sound?: string; type?: "info" | "warn" | "error" }

​
Hide to GUI attached

Hide the GUI attached to the players
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: GuiManagerMixin
  • Since: 3.0.0-beta.5

​
Signature

player.hideAttachedGui(players?)

​
Parameters

  • players?: RpgPlayer[] | RpgPlayer

​
Examples

player.hideAttachedGui()

player.hideAttachedGui(aPlayer)

player.hideAttachedGui([player1, player2])

​
Show Choices

Shows a dialog box with a choice. Opens the GUI named rpg-dialog 
const choice = await player.showChoices('What color do you prefer?', [
     { text: 'Black', value: 'black' },
     { text: 'Rather the blue', value: 'blue' },
     { text: 'I don\'t have a preference!', value: 'none' }
])

// If the player selects the first
console.log(choice) // { text: 'Black', value: 'black' }
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.showChoices(text,choices)

​
Parameters

  • msg: string
  • choices: Choice[]
  • options?: DialogOptions

​
Show Load

Display a load slots screen. Opens the GUI named rpg-save 
const index = await player.showLoad(slots)
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.showLoad(slots,options)

​
Parameters

  • slots?: SaveSlot[]
  • options?: SaveLoadOptions

​
Show Save

Display a save slots screen. Opens the GUI named rpg-save 
const index = await player.showSave(slots)
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.showSave(slots,options)

​
Parameters

  • slots?: SaveSlot[]
  • options?: SaveLoadOptions

​
Show Save/Load

Display a save/load slots screen. Opens the GUI named rpg-save 
const index = await player.showSaveLoad(slots, { mode: 'save' })
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.showSaveLoad(slots,options)

​
Parameters

  • slots?: SaveSlot[]
  • options?: SaveLoadOptions

​
Show Text

Show a text. This is a graphical interface already built. Opens the GUI named rpg-dialog 
player.showText('Hello World')
The method returns a promise. It is resolved when the dialog box is closed. 
await player.showText('Hello World')
// dialog box is closed, then ...
Option: position You can define how the dialog box is displayed:
  • top
  • middle
  • bottom
(bottom by default) 
player.showText('Hello World', {
     position: 'top'
})
Option: fullWidth boolean (true by default) Indicate that the dialog box will take the full width of the screen. 
player.showText('Hello World', {
     fullWidth: true
})
Option: autoClose boolean (false by default) If false, the user will have to press Enter to close the dialog box. 
player.showText('Hello World', {
    autoClose: true
})
Option: typewriterEffect boolean (true by default) Performs a typewriter effect 
player.showText('Hello World', {
    typewriterEffect: false
})
Option: talkWith RpgPlayer (nothing by default) If you specify the event or another player, the other player will stop his or her movement and look in the player’s direction. 
// Code in an event
player.showText('Hello World', {
    talkWith: this
})
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: IGuiManager

​
Signature

player.showText(text,options)

​
Parameters

  • msg: string
  • options?: DialogOptions

​
View to GUI attached

Display the GUI attached to the players If you don’t specify the players as parameters, it will display the GUI of the instance But you can specify which GUIs to display by specifying the players as the first parameter
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: method
  • Member of: GuiManager
  • Defined in: GuiManagerMixin
  • Since: 3.0.0-beta.5

​
Signature

player.showAttachedGui(players?)

​
Parameters

  • players?: RpgPlayer[] | RpgPlayer

​
Examples

player.showAttachedGui()

player.showAttachedGui(aPlayer)

player.showAttachedGui([player1, player2])

​
WithGuiManager

GUI Manager Mixin Provides graphical user interface management capabilities to any class. This mixin handles dialog boxes, menus, notifications, shops, and custom GUI components. It manages the complete GUI system including opening, closing, and data passing between client and server.
  • Source: packages/server/src/Player/GuiManager.ts
  • Kind: function

​
Signature

WithGuiManager(Base: TBase): new (...args: ConstructorParameters<TBase>) => InstanceType<TBase> &
  IGuiManager

​
Parameters

  • Base: TBase

​
Returns

Extended class with GUI management methods

​
Examples

class MyPlayer extends WithGuiManager(BasePlayer) {
  constructor() {
    super();
    // GUI system is automatically initialized
  }
}

const player = new MyPlayer();
await player.showText('Hello World!');
player.callMainMenu();