Full configuration example - CoreSetup

The following example demonstrates initialization using the core SDK path with CoreSetup. This setup is headless, meaning no default UI or application layer is created. It is intended for advanced integrations where full control over the streaming lifecycle and UI is required.

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

const { Config, PixelStreaming } = CoreSetup(
  {
    shareId: "<your-share-id>",
    projectId: "<optional-project-id>"
  },
  {
    initialSettings: {
      ss: "wss://signalling-client.ragnarok.arcware.cloud", // default Arcware signalling server (can be omitted as the SDK uses this by default)
      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 using absolute URLs.

Example:

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

Typical Usage

After initialization, the streaming element can be attached to the DOM using the PixelStreaming instance.

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

The headless setup allows full control over how the stream, UI, and interaction logic are implemented in the application.