tirtc-react-native 2.2.0

package/src/video_output.ts

@@ -0,0 +1,273 @@
+import * as React from 'react';
+import {View} from 'react-native';
+
+import {
+  isPositiveInt32,
+  isUInt8,
+  normalizeCreateResult,
+  returnReleasedIfDisposed,
+  TIRTC_ERROR_INVALID_ARGUMENT,
+  TIRTC_ERROR_OK,
+} from './errors';
+import {registerNativeEventHandler, unregisterNativeEventHandler} from './events';
+import {
+  clearNativeIdentity,
+  readNativeIdentity,
+  setNativeIdentity,
+  subscribeNativeIdentity,
+  type NativeIdentity,
+} from './native_object_id';
+import {NativeTiRtc, NativeTiRtcVideoOutputView, type NativeTiRtcEvent} from './native';
+import {TiRtcConn} from './conn';
+import type {
+  TiRtcOnVideoOutputError,
+  TiRtcOnVideoOutputRenderSizeChanged,
+  TiRtcOnVideoOutputStateChanged,
+  TiRtcSize,
+  TiRtcVideoOutputDebugSnapshotResult,
+  TiRtcVideoOutputMetricsResult,
+  TiRtcVideoOutputOptions,
+  TiRtcVideoOutputState,
+  TiRtcVideoOutputViewProps,
+} from './types';
+
+type VideoOutputViewPropsWithoutOwner = Omit<TiRtcVideoOutputViewProps, 'output'>;
+
+export class TiRtcVideoOutput {
+  private identity: NativeIdentity | null = null;
+  private disposed = false;
+  private createCode: number = TIRTC_ERROR_OK;
+  private currentState: TiRtcVideoOutputState = 'idle';
+  private currentRenderSize: TiRtcSize | null = null;
+  private options: Required<Omit<TiRtcVideoOutputOptions, 'maxBufferWatermarkMs'>> &
+    Pick<TiRtcVideoOutputOptions, 'maxBufferWatermarkMs'> = {
+      decoderPreference: 'auto',
+      bufferStrategy: 'automatic',
+      maxBufferWatermarkMs: undefined,
+    };
+
+  onStateChanged: TiRtcOnVideoOutputStateChanged | null = null;
+  onRenderSizeChanged: TiRtcOnVideoOutputRenderSizeChanged | null = null;
+  onError: TiRtcOnVideoOutputError | null = null;
+
+  constructor() {
+    const result = normalizeCreateResult(NativeTiRtc.createVideoOutput());
+    this.createCode = result.code;
+    if (result.code === TIRTC_ERROR_OK) {
+      this.adoptIdentity({objectId: result.objectId, generation: result.generation});
+    }
+  }
+
+  get state(): TiRtcVideoOutputState {
+    if (this.identity !== null && !this.disposed) {
+      const result = NativeTiRtc.videoOutputGetState(this.identity.objectId);
+      if (result.state !== null) {
+        this.currentState = result.state as TiRtcVideoOutputState;
+      }
+    }
+    return this.currentState;
+  }
+
+  get renderSize(): TiRtcSize | null {
+    if (this.identity !== null && !this.disposed) {
+      this.currentRenderSize = NativeTiRtc.videoOutputGetRenderSize(this.identity.objectId).size;
+    }
+    return this.currentRenderSize;
+  }
+
+  setOptions(options: TiRtcVideoOutputOptions): number {
+    const normalized = {
+      decoderPreference: options.decoderPreference ?? 'auto',
+      bufferStrategy: options.bufferStrategy ?? 'automatic',
+      maxBufferWatermarkMs: options.maxBufferWatermarkMs,
+    };
+    if (
+      normalized.maxBufferWatermarkMs !== undefined
+      && !isPositiveInt32(normalized.maxBufferWatermarkMs)
+    ) {
+      return TIRTC_ERROR_INVALID_ARGUMENT;
+    }
+    const identity = this.ensureIdentity();
+    if (typeof identity === 'number') {
+      return identity;
+    }
+    const code = NativeTiRtc.videoOutputSetOptions(identity.objectId, {
+      ...normalized,
+      maxBufferWatermarkMs: normalized.maxBufferWatermarkMs ?? null,
+    });
+    if (code === TIRTC_ERROR_OK) {
+      this.options = normalized;
+    }
+    return code;
+  }
+
+  attach(connection: TiRtcConn, streamId: number): number {
+    const connIdentity = readNativeIdentity(connection);
+    if (!isUInt8(streamId)) {
+      return TIRTC_ERROR_INVALID_ARGUMENT;
+    }
+    if (connIdentity === null) {
+      return TIRTC_ERROR_INVALID_ARGUMENT;
+    }
+    const identity = this.ensureIdentity();
+    if (typeof identity === 'number') {
+      return identity;
+    }
+    return NativeTiRtc.videoOutputAttach(identity.objectId, connIdentity.objectId, streamId);
+  }
+
+  detach(): number {
+    const released = returnReleasedIfDisposed(this.disposed);
+    if (released !== null) {
+      return released;
+    }
+    return this.identity === null ? TIRTC_ERROR_OK : NativeTiRtc.videoOutputDetach(this.identity.objectId);
+  }
+
+  /**
+   * Creates a React element bound to this output owner.
+   *
+   * The returned element renders a placeholder until this output has a live
+   * native identity. Attach the output to a connection before expecting remote
+   * frames, and dispose the output when the render surface is no longer needed.
+   */
+  view(props: VideoOutputViewPropsWithoutOwner = {}): React.ReactElement {
+    return React.createElement(TiRtcVideoOutputView, {
+      ...props,
+      output: this,
+    });
+  }
+
+  getMetricsSnapshot(): TiRtcVideoOutputMetricsResult {
+    const identity = this.ensureIdentity();
+    if (typeof identity === 'number') {
+      return {code: identity, snapshot: null};
+    }
+    return NativeTiRtc.videoOutputGetMetricsSnapshot(identity.objectId);
+  }
+
+  resetMetricsSession(): number {
+    const identity = this.ensureIdentity();
+    if (typeof identity === 'number') {
+      return identity;
+    }
+    return NativeTiRtc.videoOutputResetMetricsSession(identity.objectId);
+  }
+
+  getDebugSnapshot(): TiRtcVideoOutputDebugSnapshotResult {
+    const identity = this.ensureIdentity();
+    if (typeof identity === 'number') {
+      return {code: identity, snapshot: null};
+    }
+    return NativeTiRtc.videoOutputGetDebugSnapshot(identity.objectId);
+  }
+
+  dispose(): number {
+    if (this.disposed) {
+      return TIRTC_ERROR_OK;
+    }
+    if (this.identity === null) {
+      this.disposed = true;
+      this.clearCallbacks();
+      this.currentState = 'idle';
+      this.currentRenderSize = null;
+      return TIRTC_ERROR_OK;
+    }
+    const identity = this.identity;
+    const code = NativeTiRtc.videoOutputDispose(identity.objectId);
+    if (code === TIRTC_ERROR_OK) {
+      this.disposed = true;
+      this.identity = null;
+      unregisterNativeEventHandler(identity);
+      clearNativeIdentity(this);
+      this.clearCallbacks();
+      this.currentState = 'idle';
+      this.currentRenderSize = null;
+    }
+    return code;
+  }
+
+  private ensureIdentity(): NativeIdentity | number {
+    const released = returnReleasedIfDisposed(this.disposed);
+    if (released !== null) {
+      return released;
+    }
+    if (this.identity !== null) {
+      return this.identity;
+    }
+    return this.createCode;
+  }
+
+  private adoptIdentity(identity: NativeIdentity): void {
+    this.identity = identity;
+    setNativeIdentity(this, identity);
+    registerNativeEventHandler(identity, (event) => this.handleEvent(event));
+    NativeTiRtc.videoOutputSetOptions(identity.objectId, {
+      ...this.options,
+      maxBufferWatermarkMs: this.options.maxBufferWatermarkMs ?? null,
+    });
+  }
+
+  private clearCallbacks(): void {
+    this.onStateChanged = null;
+    this.onRenderSizeChanged = null;
+    this.onError = null;
+  }
+
+  private handleEvent(event: NativeTiRtcEvent): void {
+    if (this.disposed) {
+      return;
+    }
+    switch (event.type) {
+      case 'videoOutputStateChanged':
+        if (event.state !== undefined) {
+          this.currentState = event.state as TiRtcVideoOutputState;
+          this.onStateChanged?.(this.currentState);
+        }
+        break;
+      case 'videoOutputRenderSizeChanged':
+        if (event.size !== undefined) {
+          this.currentRenderSize = event.size;
+          this.onRenderSizeChanged?.(event.size);
+        }
+        break;
+      case 'videoOutputError':
+        this.onError?.(event.code ?? TIRTC_ERROR_INVALID_ARGUMENT);
+        break;
+      default:
+        break;
+    }
+  }
+}
+
+/**
+ * Renders the remote video stream attached to a `TiRtcVideoOutput`.
+ *
+ * The component observes the owner identity and never accepts raw native ids.
+ * If the owner is not created, has been disposed, or is not a `TiRtcVideoOutput`,
+ * it renders a regular `View` with the remaining props.
+ */
+export function TiRtcVideoOutputView(props: TiRtcVideoOutputViewProps): React.ReactElement {
+  const {output, resizeMode = 'contain', ...viewProps} = props as TiRtcVideoOutputViewProps;
+  const identity = useOwnerIdentity(output instanceof TiRtcVideoOutput ? output : null);
+  if (identity === null) {
+    return React.createElement(View, viewProps);
+  }
+  return React.createElement(NativeTiRtcVideoOutputView, {
+    ...viewProps,
+    nativeObjectId: identity.objectId,
+    generation: identity.generation,
+    resizeMode,
+  });
+}
+
+function useOwnerIdentity(owner: object | null): NativeIdentity | null {
+  const [, forceUpdate] = React.useReducer((value: number) => value + 1, 0);
+  React.useEffect(() => {
+    if (owner === null) {
+      return undefined;
+    }
+    return subscribeNativeIdentity(owner, forceUpdate);
+  }, [owner]);
+  return owner === null ? null : readNativeIdentity(owner);
+}