WebView

Client JavaScript exposes varion.WebView through the platform bootstrap. WebView commands are passed to the client runtime and then to the WebEngine overlay.

Constructor

// Basic overlay (second argument true = overlay mode)
const view = new varion.WebView(url, true);

// Fullscreen overlay
const view = new varion.WebView(varion.assetUrl('ui-pack', 'index.html'), true);
view.pos  = { x: 0, y: 0 };   // top-left corner (normalized 0–1)
view.size = { x: 1, y: 1 };   // 1×1 = fullscreen
view.visible = true;
view.focused = true;

view.emit('hud:setHealth', 200);
view.on('hud:ready', () => varion.log('ui ready'));

The second constructor argument is a boolean overlay flag. When true, the view renders on top of the game. When omitted or false, it is created in DUI (in-world texture) mode, which is currently a scaffold and degrades to a screen billboard (see below). The constructor also accepts new varion.WebView(url, pos, size).

Coordinates for pos and size are normalized: {x: 0, y: 0} is the top-left corner, {x: 1, y: 1} is the bottom-right. The default size is 0.15 × 0.1 — set size = {x: 1, y: 1} explicitly for fullscreen.

Factory

const overlay = varion.WebView.create({
  url: varion.assetUrl('ui-pack', 'index.html'),
  overlay: true,
  pos: { x: 0, y: 0 },
  size: { x: 1, y: 1 },
  visible: true,
  headers: { 'X-Auth': token },
});

WebView.create(options) is the recommended entry point. Passing drawable / targetTexture in the options switches the view to DUI mode (billboard fallback).

Static members

API	Purpose
WebView.create(options)	Create a WebView from an options object
WebView.all	Array of all WebViews
WebView.count	Number of WebViews
WebView.getByID(id)	Find a WebView by id
WebView.gpuAccelerationActive	GPU acceleration is active (true)

Global event helpers: varion.onWebView(name, cb), varion.onceWebView(name, cb), varion.offWebView(name, cb).

Instance methods

Method	Purpose
on(name, cb)	Subscribe to an event from the view (returns { destroy() })
once(name, cb)	Subscribe to a single event
off(name, cb)	Remove a handler
emit(name, ...args)	Send an event to the view
emitRaw(name, ...args)	Same as emit
getEventListeners(name)	List handlers (or all if name is omitted)
execJS(code)	Execute JavaScript inside the view
reload(ignoreCache)	Reload the page
focus() / unfocus()	Focus / blur the view
sendKey(key, state)	Send a key press (state — down/up)
attachTo(target, offset)	Attach to an entity (world billboard)
detach()	Detach from the entity
addOutput(output)	Add an audio output (e.g. AudioOutputWorld)
removeOutput(output)	Remove an audio output
getOutputs()	List attached audio outputs
setExtraHeader(name, value)	Extra HTTP header
setZoomLevel(level)	Zoom level
setCookie(cookie)	Set a cookie (string or object)
openDevTools()	Open DevTools
destroy()	Destroy the WebView

Plus meta helpers: getMeta(key), hasMeta(key), setMeta(key, value), deleteMeta(key).

Properties (get/set)

Property	Purpose
url	Page URL (re-setting reloads a visible view)
unfocusedUrl	URL to switch to when focus is lost
pos = {x, y}	Top-left position (normalized 0–1)
size = {x, y}	Size (normalized 0–1, 1×1 = fullscreen)
z	Z-order (layering)
opacity	Opacity 0–1
visible / isVisible	Show or hide the view
focused	Focus the view (synchronizes game controls)

Read-only state

Getter	Purpose
isReady	Page loaded and ready
isLoaded	Page loaded
isLoading	Loading in progress (visible and not yet loaded)
isStreamedIn	View is streamed in (for world-attach, by the entity)
isFocused	Focused
isDuiCompat	Running in DUI-compat (billboard) mode
worldOnScreen	A world view is currently on screen
valid	View still exists (not destroyed)

Events

view.on('load', () => {});            // page loaded (isReady/isLoaded = true)
view.on('loadError', () => {});       // load error
view.on('customEvent', (a, b) => {}); // any event sent from the page

The page sends events to the client through the WebEngine bridge, while view.emit(...) / view.execJS(...) deliver data back to the page.

visible and focused behavior

Setting visible = true automatically focuses the WebView. When a WebView is focused and visible, syncWebViewGameControls disables game controls.

DUI / in-world

The in-world texture (DUI) is a scaffold. Non-overlay mode and attachTo(entity) degrade to a screen billboard projected onto the entity rather than a real in-world texture. A separate placeholder class varion.WebViewDui(url, width, height) exists as the scaffold for a future in-world texture:

const dui = new varion.WebViewDui(url, 512, 512);
dui.emit('event', payload);
dui.isReady;   // true when the texture is ready (scaffold for now)
dui.destroy();

URL helpers

const url = varion.httpUrl('cef/index.html');            // resource HTTP server
const url = varion.assetUrl('mymode', 'ui/index.html');  // resource asset-pack

http/https URLs must match the resource's manifest HTTP or asset-pack; local schemes (file/data/blob, relative paths) are allowed.

Source Backing

This page is derived from sdk/client-js-runtime/injected/platform-bootstrap.js, client/src/scripting/CClientScriptRuntime.cpp, client/src/webengine/CWebEngineOverlay.cpp and client/src/webengine/CWebEngineOverlay.h.