Video, Gimbal & Manual Flight Control

​

The three channels touching this screen

​

Live video — the Janus subscriber lifecycle

​

Connect states and gotchas

• No video_room_id → after a 5s grace period the component toasts “Video streaming not configured for this drone” and does nothing else (handleDroneSelection, video-window.component.ts:218).
• 15s fallback timeout — if no track and no error arrive within 15s, isConnecting is cleared so the Start Video button reappears instead of spinning forever (video-window.component.ts:450).
• Start Video button calls droneService.startVideoStream(video_room_id) → GET /video_room/{id}/start?update=true, then re-schedules a Janus connect after 1s (video-window.component.ts:540). Sibling REST calls: /video_room/{id}/stop and /video_room/{id}/restart.
• Vehicle stream sync — the vehicle emits video_stream_state { is_streaming } over redispad; the component auto-connects when the vehicle starts streaming and tears down when it stops (handleVideoStreamState, video-window.component.ts:295). A video_stream_status_request is sent 500ms after drone selection to sync initial state.

​

Gimbal, zoom, record & photo

private sendGimbalUp() {
  const ourTimestamp = performance.now();
  const data: GamepadData = {
    buttons: { '12': 1 }, axes: [],
    timestamp: ourTimestamp, front_ts: ourTimestamp,
  };
  this.appStateService.setControllerData(data);
}

private sendCameraCommand(command: string, pressed = true, value?: number) {
  const message: any = {
    type: 'camera_command',
    command,                 // 'zoom_set' | 'record_start' | 'record_stop' | 'photo' | 'status'
    pressed,
    source: 'frontend',
    timestamp: Date.now() / 1000,
  };
  if (value !== undefined) message.value = value; // zoom_set: 0–100
  this.appStateService.setControllerData(message);
}

​

ArUco precision-landing overlay

• Composite markers — an outer ArUco tag and an inner AprilTag. The currently-active marker (chosen by altitude via marker_switch_altitude) is drawn green, the other red; corners, a center-to-crosshair dashed line, and an info panel (distance, yaw, confidence, yaw/XY alignment) are rendered.
• Performance — the socket and its per-frame draw run via ngZone.runOutsideAngular (canvas draws, no template bindings), and a ResizeObserver keeps the canvas bitmap matched to the video’s displayed size. When the video is hidden (0×0), overlayVisible goes false and message processing pauses.
• Staleness — if no frame arrives for dataStaleTimeoutMs (2000ms, aruco-tracking.model.ts), the overlay is cleared so it never shows a frozen marker.
• SITL is skipped — VideoWindowComponent only calls arucoOverlayService.connect() when drone.type?.toLowerCase() !== 'sitl' (video-window.component.ts:214).

​

Manual flight — three input paths, one gate

​

The guided-control gate

const hasAxesMovement =
  data.axes && Array.isArray(data.axes) && data.axes.some((v) => Math.abs(v) > 0.1);

// Only send axes movement data if guided control is enabled.
// Always allow button commands and guided_control commands through.
if (hasAxesMovement && !this.appStateService.isGuidedControlEnabled()) {
  return; // drop the frame
}
this.vehicleCommandService.send(data);

​

Enabling guided control (the handshake)

• The Enable Manual Control button in MissionControlComponent opens a real-vs-virtual selection dialog, which is subscription-gated (SubscriptionDialogComponent.hasSubscription). Selecting a mode calls guidedControlService.enable() before activating frontend controls (manual-control-dialog.component.ts).
• enable()/disable() wait up to 3s for a guided_control_status reply, then optimistically assume success (backwards compatibility).
• Guided control auto-disables when the vehicle leaves GUIDED mode: currentMode$ is watched and any non-GUIDED mode flips the state off and hides the virtual joystick (guided-control.service.ts:64).

​

The dock / disconnect button

​

Flight-control bar (mode / arm / takeoff / land)

• The active mode is read from telemetry, not from the button press — diagnosticsSubject messages are parsed with websocketService.getMode(level, 'Mode') so the highlighted button reflects the vehicle’s real state.
• Mode / Arm / Takeoff / Land / Start-Mission all route through confirmation or altitude dialogs held in AppStateService (e.g. setModeConfirmationDialogVisible, setTakeoffAltitudeDialogVisible) rather than firing REST calls directly from this component. The underlying REST actions (/drone/action/{arm|takeoff|set_mode|start_mission}) are documented on
  Drone Management & Control Actions

  drone actions
  .
• Takeoff vs Land share one button, toggled by isArmedAndFlying() = systemStatus() === 'ACTIVE' && altitude() > 0.5.
• GoTo (onGoTo) sets controlVehicleMode so the next map click sets a destination — the map-click dispatch lives on
  Map & Live Vehicle Tracking

  map tracking
  .
• A low-latency quick land also exists on the command channel: VehicleCommandService.land() sends { set_mode: 'LAND' } straight over redispad (vehicle-command.service.ts:145).

​

Configuration