Full configuration example - ArcwareInit

The following example demonstrates a full configuration using ArcwareInit. Values shown here reflect common defaults and recommended settings for most integrations.

import { ArcwareInit } from "@arcware-cloud/pixelstreaming-websdk";

const { Config, PixelStreaming, Application } = ArcwareInit(
  {
    shareId: "<your-share-id>",
    projectId: "<optional-project-id>"
  },
  {
    initialSettings: {
      ss: "wss://signalling-client.ragnarok.arcware.cloud", // default Arcware signalling server (can be omitted)
      AutoConnect: true,
      AutoPlayVideo: true,
      StartVideoMuted: true,
      HoveringMouse: true,
      FakeMouseWithTouches: false,
      SuppressBrowserKeys: true,
      KeyboardInput: true,
      MouseInput: true,
      TouchInput: true,
      GamepadInput: true,
      XRControllerInput: true,
      UseMic: true,
      ForceMonoAudio: false,
      MatchViewportRes: false,
      TimeoutIfIdle: true
    },
    settings: {
      fullscreenButton: true,
      settingsButton: true,
      infoButton: false,
      audioButton: true,
      micButton: true,
      stopButton: false,
      connectionStrengthIcon: false,

      loveLetterLogging: false,

      startWidth: 1920,
      startHeight: 1080,

      orientationZoom: {
        landscape: 1,
        portrait: 1
      },

      whiteLabelling: {
        splashScreenUrl: "./branding/splash-screen.jpg",
        splashScreenMode: "contain",
        splashScreenPosition: "center",
        splashScreenBgColor: "#000000",

        loadingIconUrl: "./branding/loading-icon.png",
        loadingIconFadeMs: 1000,

        hideLoveLetters: false,
        hideAfkOverlay: false
      },

      fetchRemoteWhiteLabelling: false
    }
  }
);

Required Values

Field	Description
shareId	Share ID generated in the Arcware Cloud platform
projectId	Optional project identifier if a Share ID maps to multiple projects

Default Asset Paths

The following relative paths are commonly used when hosting branding assets alongside the web application.

./branding/splash-screen.jpg
./branding/loading-icon.png
./branding/logo.png

Assets may also be hosted on external servers using absolute URLs.

Example:

https://example.com/assets/splash-screen.jpg
https://cdn.example.com/branding/loading-icon.png

Typical Usage

After initialization, the returned objects can be used to attach the stream to the DOM and interact with the Unreal Engine application.

Example:

document
  .getElementById("video-container")
  .appendChild(Application.rootElement);

Messages can be sent to the Unreal Engine application using:

Application.emitUIInteraction({ action: "example" });