Type Definitions

VmosEdgeClientConfig

Device connection configuration interface.

interface VmosEdgeClientConfig {
  /** Device IP address */
  ip: string;
  /** Device unique identifier */
  deviceId: string;
  /** Port configuration */
  ports: {
    /** Video stream port (WebSocket), required for single control mode, not needed for group control mode */
    video?: number;
    /** Audio stream port (WebSocket), ⚠️ Not supported, do not configure */
    audio?: number;
    /** Touch channel port (WebSocket), required */
    touch?: number;
  };
}

Field Guide

• deviceId: Corresponds to the dbid field in device information
• ip: Corresponds to different fields depending on network mode
  • LAN mode (network_mode === 'macvlan'): Corresponds to ip field
  • Non-LAN mode: Corresponds to hostip field
• ports.video: Video stream port
  • LAN mode: Fixed to 9999
  • Non-LAN mode: Corresponds to tcp_port field
• ports.touch: Touch channel port
  • LAN mode: Fixed to 9997
  • Non-LAN mode: Corresponds to tcp_control_port field

Configuration Examples

LAN Mode (network_mode === 'macvlan')

const config: VmosEdgeClientConfig = {
  ip: "192.168.1.100",              // Use device's ip field
  deviceId: "EDGE418ASOC2LX9C",     // Use device's dbid field
  ports: {
    video: 9999,                     // LAN mode fixed port
    touch: 9997,                     // LAN mode fixed port
  },
};

Non-LAN Mode

const config: VmosEdgeClientConfig = {
  ip: "example.com",                // Use device's hostip field
  deviceId: "EDGE418ASOC2LX9C",     // Use device's dbid field
  ports: {
    video: 22003,                    // Use device's tcp_port field
    touch: 24003,                    // Use device's tcp_control_port field
  },
};

⚠️ Important Notes:

• audio port is not supported in the current version and will not take effect if configured
• Single Control Mode: Both video and touch ports are required
• Group Control Mode: Only touch port is needed, video port is not required
• Network Mode Detection: network_mode === 'macvlan' indicates LAN mode, otherwise it's non-LAN mode

VmosEdgeClientOptions

Client initialization options interface.

interface VmosEdgeClientOptions {
  /** Device connection configuration */
  config: VmosEdgeClientConfig;
  /** DOM container element */
  container: HTMLElement;
  /** Whether to enable group control mode, default false */
  isGroupControl?: boolean;
  /** Retry count on disconnection, default 0 (no retry) */
  retryCount?: number;
  /** Retry interval (milliseconds), default 1000 */
  retryInterval?: number;
  /** Video codec preference */
  videoCodecPreference?: "no-preference" | "prefer-hardware" | "prefer-software";
  /** Render performance preference */
  renderPreference?: "default" | "high-performance" | "low-power";
  /**
   * Whether move events preserve hover state
   * Default is false
   */
  hoverMoveKeep?: boolean;
  /**
   * Scroll sensitivity configuration, general sensitivity
   * Range: 0.001 - 800, larger values mean slower scrolling
   * Default is 200
   */
  scrollSpeedRatio?: number;
}

Field Descriptions

• config: Device connection configuration, required
• container: DOM container element for displaying device screen, required
• isGroupControl: Whether to enable group control mode, default false
• retryCount: Retry count on disconnection, default 0 (no retry)
• retryInterval: Retry interval (milliseconds), default 1000
• videoCodecPreference: Video codec preference
  • "no-preference": No preference (default)
  • "prefer-hardware": Prefer hardware decoding
  • "prefer-software": Prefer software decoding
• renderPreference: Render performance preference
  • "default": Default mode
  • "high-performance": High performance mode
  • "low-power": Low power mode
• hoverMoveKeep: Whether move events preserve hover state, default false
  • false: Move events do not preserve hover state (default)
  • true: Move events preserve hover state
• scrollSpeedRatio: Scroll sensitivity configuration, range 0.001 - 800, larger values mean slower scrolling, default 200

Usage Example

const client = new VmosEdgeClient({
  container: document.getElementById("container")!,
  config: {
    ip: "192.168.1.100",
    deviceId: "EDGE418ASOC2LX9C",
    ports: {
      video: 9999,
      touch: 9997,
    },
  },
  retryCount: 3,
  retryInterval: 2000,
  hoverMoveKeep: true,
  scrollSpeedRatio: 100, // Set scroll sensitivity to 100 (faster scrolling)
});

VmosEdgeSizeChangedEvent

Size change event data.

interface VmosEdgeSizeChangedEvent {
  /** Ideal width (suggested container width without black borders) */
  idealWidth: number;
  /** Ideal height (suggested container height without black borders) */
  idealHeight: number;
  /** Video source actual width */
  videoWidth: number;
  /** Video source actual height */
  videoHeight: number;
  /** Current rotation state: 0=portrait, 1=landscape */
  rotation: 0 | 1;
}

Usage Example:

client.on(VmosEdgeClientEvents.SIZE_CHANGED, (size) => {
  console.log(`Video size: ${size.videoWidth} x ${size.videoHeight}`);
  console.log(`Ideal container size: ${size.idealWidth} x ${size.idealHeight}`);
  console.log(`Current orientation: ${size.rotation === 0 ? "Portrait" : "Landscape"}`);
  
  // Can adjust container size based on idealWidth/idealHeight to eliminate black borders
  container.style.width = `${size.idealWidth}px`;
  container.style.height = `${size.idealHeight}px`;
});

VmosEdgeErrorEvent

Error event data.

interface VmosEdgeErrorEvent {
  /** Error type (VmosEdgeErrorType) */
  type: VmosEdgeErrorType;
  /** Error code (VmosEdgeErrorCode) */
  code: VmosEdgeErrorCode;
  /** Error description message */
  message: string;
  /** Port where error occurred (if any) */
  port?: number;
  /** All channels connection status (if any) */
  allChannelsStatus?: AllChannelsStatus;
}

Related Types: AllChannelsStatus

Usage Example:

client.on(VmosEdgeClientEvents.ERROR, (error) => {
  console.error(`Error type: ${error.type}`);
  console.error(`Error code: ${error.code}`);
  console.error(`Error message: ${error.message}`);
  
  if (error.port) {
    console.error(`Error port: ${error.port}`);
  }
});

VmosEdgeChannelConnectedEvent

Channel connection success event data.

interface VmosEdgeChannelConnectedEvent {
  /** Channel type */
  channel: "video" | "audio" | "touch";
  /** Channel port */
  port?: number;
  /** All channels connection status */
  allChannelsStatus?: AllChannelsStatus;
}

Related Types: AllChannelsStatus

Usage Example:

client.on(VmosEdgeClientEvents.CHANNEL_CONNECTED, (event) => {
  console.log(`${event.channel} channel connected successfully, port: ${event.port}`);
  
  if (event.allChannelsStatus) {
    console.log("All channels status:", event.allChannelsStatus);
  }
});

AllChannelsStatus

All channels status information.

interface AllChannelsStatus {
  video: ChannelStatus;
  audio: ChannelStatus;
  touch: ChannelStatus;
}

Related Types: ChannelStatus

ChannelStatus

Channel status type.

type ChannelStatus = "disconnected" | "connecting" | "connected" | "error";

Related Types: AllChannelsStatus