Skip to content

Code Panel

The Code Panel is the full-window TypeScript editor for scripts - a Monaco editor (the same engine as VS Code) with a script list, IntelliSense for the Awaken scripting API, and a Compile button.

Scripts written here become behaviours you attach to objects through the Inspector's Script component. For the scripting model itself, see the Scripting overview and the ScriptApi reference.

Finding the tab

Code is a data-gated tab: it gets a permanent slot in its tab bar only once the project contains at least one script. Until then it lives under the tab bar's right-aligned menu - or you can create your first script straight from the Asset Browser with + New Script, which makes the script and brings this tab forward.

Layout

  • The sidebar lists your scripts - the shared asset-editor sidebar described below.
  • The main area is the Monaco editor, above it a bar with the script's name field, a status line, and Compile - or Run for an editor script, or Package… for a plugin (a plugin is enabled from the Plugins panel, not compiled here). With no script open the area offers + New Game Script, + New Editor Script, and + New Plugin buttons instead.

📸 Screenshot - save as img/editor-code-panel.png

The Code Panel: the script list on the left, the Monaco editor with a ScriptBehavior class open, the name field and Compile button in the bar, and "Compiled ✓" in the status line.

The script list

The sidebar is the same asset-editor sidebar the Material, Anim Graph and Particles panels use - click to open, double-click to rename, right-click for Rename / Delete, and « to collapse it to an icon strip. See The asset-editor sidebar on the workspace page for the full behaviour; the script-specific parts are:

  • Three create buttons in the footer: + New Game Script (a behaviour that runs at Play via a Script component), + New Editor Script (a one-off tool you Run over the open scene - see Editor scripts), and + New Plugin (an editor extension - see Plugins). Each creates the script and drops you straight into naming it. Collapsed, the footer becomes a single + that offers all three.
  • Each row carries a glyph telling the kinds apart - { } for a game script, plus an editor badge for an editor script.
  • Delete asks to confirm; any component still referencing that script stops running it.

The ScriptBehavior template

A new script starts from this template:

ts
// Component behavior - runs during Play. Type 'api.' for autocomplete.
export default class implements ScriptBehavior {
  onUpdate(api: ScriptApi, dt: number) {
    api.translate(dt * 1.5, 0, 0); // drift along +X
    if (api.input.isDown(" ")) api.setField("RigidBody", "velocity", { x: 0, y: 6, z: 0 });
  }
}

A behaviour is a class implementing ScriptBehavior. Implement the lifecycle hooks you need - onStart, onUpdate, onDestroy, and the collision hooks onCollision / onCollisionEnter / onCollisionExit. Everything runs during Play. See Events & timers and Input.

IntelliSense

The editor injects the Awaken API type definitions, so api. autocompletes the whole surface - ScriptApi, ScriptBehavior, Input, UIApi, the World, and the Vec3 / Quat / Entity types, including the component-typed entity aliases (Camera, Light, RigidBody, …) used for entity-reference parameters. You get hover docs and signature help without importing anything.

Public class fields become editable per-instance parameters on the Script component - a number/string/boolean field, or a target: Entity reference. See Script parameters.

Compile

Compile transpiles the script (with esbuild-wasm), loads the behaviour, and registers it under the script's stable id so the Script component can run it. It also re-discovers the script's public fields so the Inspector shows the right parameter controls. The status line reports Compiled ✓ or an error (with the message in the Console).

IMPORTANT

Compile registers the runnable behaviour - a script's parameters and runtime only update after you Compile. Saving the project always captures the current source regardless (see below), but you must Compile to run your latest code.

Live source mirroring

Every keystroke mirrors the editor's text back into the project and marks it unsaved - so Save always captures your current buffer even if you forget to Compile. Persisting the source never depends on remembering to Compile; only running the new code does.

Scripts have a stable id (the list key) and a renamable display name; components reference the id, so renaming a script never breaks the objects using it.

See also

Awaken — browser-native WebGPU game engine.