Return values

const { pixelStreaming, appStream, queueHandler, UIControl, reconnectStream } =
  await StreamPixelApplication({ appId: 'your-project-id' });

// Listen for events
pixelStreaming.addEventListener('webRtcConnected', () => {
  console.log('WebRTC connection established');
});

// Send a console command to UE
pixelStreaming.emitConsoleCommand('stat fps');

// Send custom data to UE
appStream.stream.emitUIInteraction({ type: 'action', value: 'jump' });

// Receive data from UE
pixelStreaming.addResponseEventListener('handle_responses', (response) => {
  const data = JSON.parse(response);
  console.log('UE says:', data);
});

// Control connection
pixelStreaming.disconnect();
pixelStreaming.reconnect();

// Enable microphone/camera input to UE
pixelStreaming.unmuteMicrophone(true);
pixelStreaming.unmuteCamera(true);

appStream.onVideoInitialized = () => {
  document.getElementById('container').appendChild(appStream.rootElement);
};

// Called when the video element is ready and streaming
appStream.onVideoInitialized = () => {
  // Mount the video, hide loading screen, etc.
};

// Called when the stream disconnects
appStream.onDisconnect = () => {
  // Show disconnected UI
};

// The video element
const video = appStream.stream.videoElementParent.querySelector('video');

// The separate audio element (SDK creates both)
const audio = appStream.stream._webRtcController.streamController.audioElement;

appStream.stream.emitUIInteraction({ message: 'hello from web' });

queueHandler((msg) => {
  console.log(`Queue position: ${msg.position}`);
  console.log(`Message: ${msg.message}`); // "You are in Queue"
});

// Toggle stream audio on/off
UIControl.toggleAudio();

// Set maximum resolution (format: "WIDTHxHEIGHT")
UIControl.handleResMax('1920x1080');

// Enable/disable hover mouse mode
UIControl.toggleHoveringMouse(true);
UIControl.toggleHoveringMouse(false);

// Get current stream statistics
const stats = UIControl.getStreamStats();
console.log(stats);
// { Framerate: 60, "Net RTT (ms)": 12, "Video codec": "H264 ...", ... }

// Get available resolution options (returns array or undefined)
const resolutions = UIControl.getResolution();
// ["360p (640x360)", "480p (854x480)", "720p (1280x720)", "1080p (1920x1080)"]

reconnectStream.on('state', (data) => {
  console.log(`Status: ${data.status}`);

  switch (data.status) {
    case 'connecting':
      // Initial connection or reconnection started
      break;
    case 'reconnecting':
      // WebSocket closed, attempting reconnection
      break;
    case 'retrying':
      // Reconnection attempt in progress
      break;
    case 'connected':
      // Successfully reconnected
      break;
    case 'disconnected':
      // Disconnected (check data.code and data.reason)
      break;
    case 'failed':
      // Reconnection failed (data.code = 4007 means timeout)
      break;
  }
});