The game's own interface

kcds.ui.NativeUI works with the game's Scaleform (Flash) interface from a client script. You can build a screen in the game's visual style, or control the interface elements the game already has. For pages written in HTML, see Web views.

Building a screen

NativeUI.createScreen() gives you a game movie with an empty root clip. Wait for 'ready' before adding anything to it.

// client
const board = kcds.ui.NativeUI.createScreen();

board.on('ready', () => {
  const panel = board.root.createClip();
  panel.draw([
    ['beginFill', 0x15130f, 80],
    ['moveTo', 0, 0],
    ['lineTo', 400, 0],
    ['lineTo', 400, 200],
    ['lineTo', 0, 200],
    ['endFill'],
  ]);

  const heading = panel.createText({ x: 20, y: 20, width: 360, height: 40, text: 'Town board' });
  heading.setTextStyle({ font: 'DisplayFont', size: 24 });

  const closeLabel = panel.createText({ x: 20, y: 150, width: 120, height: 30, text: 'Close' });
  closeLabel.on('press', () => board.close());

  board.setVisible(true);
  board.focus();
});

board.on('input', (action, phase) => {
  if (action === 'kcds_ui_back' && phase === 'press') {
    board.close();
  }
});

Clips offer these calls (NativeClip):

Call	Purpose
`createClip`, `createText`	add a child clip or text
`attach`	add a symbol exported by a game movie (see `NativeUI.libraries()`)
`draw`	draw shapes
`set({ x, y, alpha, ... })`	change properties
`load`	load a picture
`on('press' \| 'rollOver' \| ...)`	react to the mouse

Fonts from the game include DefaultFont, DefaultFontBold, LightFont, Manuscript and DisplayFont.

Input: while a screen has focus, key binds are paused, and menu keys reach the screen as 'input' events such as kcds_ui_accept, kcds_ui_back and kcds_ui_left.

Your own movie: createScreen({ movie }) loads a .swf shipped with your resource. See NativeScreen.

Controlling existing elements

NativeUI.element(name) returns one of the game's interface elements:

// client
const hud = kcds.ui.NativeUI.element('HUD');
hud.call('ShowInfoText', ['Hello', 0, 3000, false]);

An element (NativeElement) has call, setVariable, getVariable, setClip, gotoClip, show, hide and its own events.

setMenuEnabled keeps a page of the game's menu from opening. The pages are 'crafting', 'inventory', 'player', 'map', 'codex' and 'journal':

// client
kcds.ui.NativeUI.setMenuEnabled('map', false);

Your button appears in the game's style above "Report a bug", each time the player opens the menu:

// client
const settingsButton = kcds.ui.NativeUI.addMenuButton('Server settings', () => {
  kcds.core.Events.toServer('settings:open');
});

// When you no longer need it:
kcds.ui.NativeUI.removeMenuButton(settingsButton);

addMenuButton(label, handler) returns the button's id. Labels can be up to 64 characters.
The menu has two free places, where the game's save buttons normally are. On a server those are not shown. With both taken, the call returns null.
removeMenuButton(id) removes only your resource's own buttons and returns false for any other id. A resource that stops loses its buttons.
Do not call the menu's Flash function AddBasicButton through NativeUI.element('Menu'). The game rebuilds the menu each time it opens, and such a button does not receive clicks.

The game's own interface

Building a screen

Controlling existing elements

Closing menu pages

Adding a button to the Esc menu