@stream-io/video-client 0.0.1-alpha.7

package/src/helpers/browsers.ts

@@ -0,0 +1,13 @@
+/**
+ * Checks whether the current browser is Safari.
+ */
+export const isSafari = () => {
+  return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+};
+
+/**
+ * Checks whether the current browser is Firefox.
+ */
+export const isFirefox = () => {
+  return navigator.userAgent.includes('Firefox');
+};

package/src/helpers/sound-detector.ts

@@ -0,0 +1,85 @@
+export type SoundDetectorOptions = {
+  /**
+   * Defines how often the detector should check whether a sound is present.
+   * Defaults to 500ms.
+   */
+  detectionFrequencyInMs?: number;
+
+  /**
+   * Defines the audio level threshold before a "change" is emitted.
+   * Defaults to 150. This value should be in the range of 0-255.
+   */
+  audioLevelThreshold?: number;
+
+  /**
+   * See https://developer.mozilla.org/en-US/docs/web/api/analysernode/fftsize
+   *
+   * Defaults to 128.
+   */
+  fftSize?: number;
+
+  /**
+   * Defines whether the provided audio stream should be stopped (destroyed)
+   * when the sound detector is stopped.
+   *
+   * Defaults to `true`.
+   */
+  destroyStreamOnStop?: boolean;
+};
+
+const DETECTION_FREQUENCY_IN_MS = 500;
+const AUDIO_LEVEL_THRESHOLD = 150;
+const FFT_SIZE = 128;
+
+/**
+ * Creates a new sound detector.
+ *
+ * @param audioStream the audio stream to observe. Depending on the provided configuration, this stream might be destroyed when the sound detector is stopped.
+ * @param onSoundDetectedStateChanged a callback which is called when the sound state changes.
+ * @param options custom options for the sound detector.
+ * @returns a clean-up function which once invoked stops the sound detector.
+ */
+export const createSoundDetector = (
+  audioStream: MediaStream,
+  onSoundDetectedStateChanged: (isSoundDetected: boolean) => void,
+  options: SoundDetectorOptions = {},
+) => {
+  const {
+    detectionFrequencyInMs = DETECTION_FREQUENCY_IN_MS,
+    audioLevelThreshold = AUDIO_LEVEL_THRESHOLD,
+    fftSize = FFT_SIZE,
+    destroyStreamOnStop = true,
+  } = options;
+
+  const audioContext = new AudioContext();
+  const analyser = audioContext.createAnalyser();
+  analyser.fftSize = fftSize;
+
+  const microphone = audioContext.createMediaStreamSource(audioStream);
+  microphone.connect(analyser);
+
+  const intervalId = setInterval(() => {
+    const data = new Uint8Array(analyser.frequencyBinCount);
+    analyser.getByteFrequencyData(data);
+
+    const isSoundDetected = data.some((value) => value >= audioLevelThreshold);
+    onSoundDetectedStateChanged(isSoundDetected);
+  }, detectionFrequencyInMs);
+
+  return async function stop() {
+    clearInterval(intervalId);
+
+    // clean-up the AudioContext elements
+    microphone.disconnect();
+    analyser.disconnect();
+    await audioContext.close();
+
+    // stop the stream
+    if (destroyStreamOnStop) {
+      audioStream.getTracks().forEach((track) => {
+        track.stop();
+        audioStream.removeTrack(track);
+      });
+    }
+  };
+};

package/src/rpc/createClient.ts

@@ -0,0 +1,50 @@
+import type {
+  MethodInfo,
+  NextUnaryFn,
+  RpcInterceptor,
+  RpcOptions,
+  UnaryCall,
+} from '@protobuf-ts/runtime-rpc';
+import {
+  TwirpFetchTransport,
+  TwirpOptions,
+} from '@protobuf-ts/twirp-transport';
+import { SignalServerClient } from '../gen/video/sfu/signal_rpc/signal.client';
+
+const defaultOptions: TwirpOptions = {
+  baseUrl: '',
+  sendJson: false,
+  jsonOptions: {
+    ignoreUnknownFields: true,
+  },
+};
+
+export const withHeaders = (
+  headers: Record<string, string>,
+): RpcInterceptor => {
+  return {
+    interceptUnary(
+      next: NextUnaryFn,
+      method: MethodInfo,
+      input: object,
+      options: RpcOptions,
+    ): UnaryCall {
+      options.meta = { ...options.meta, ...headers };
+      return next(method, input, options);
+    },
+  };
+};
+
+/**
+ * Creates new SignalServerClient instance.
+ *
+ * @param options the twirp options.
+ */
+export const createSignalClient = (options?: TwirpOptions) => {
+  const transport = new TwirpFetchTransport({
+    ...defaultOptions,
+    ...options,
+  });
+
+  return new SignalServerClient(transport);
+};

package/src/rpc/index.ts

@@ -0,0 +1,2 @@
+export * from './createClient';
+export * from './latency';

package/src/rpc/latency.ts

@@ -0,0 +1,43 @@
+const toSeconds = (ms: number) => ms / 1000;
+
+/**
+ * Measures the latency of the current client to the given endpoint.
+ * Uses HTML Image tag in order to avoid CORS issues.
+ *
+ * @param endpoint the endpoint.
+ * @param rounds the number of measuring rounds to perform.
+ * @param timeoutAfterMs the request cancellation period.
+ */
+export const measureResourceLoadLatencyTo = async (
+  endpoint: string,
+  rounds: number = 3,
+  timeoutAfterMs: number = 1500,
+) => {
+  const measurements: number[] = [];
+  await Promise.all(
+    Array(rounds)
+      .fill(undefined)
+      .map(async () => {
+        const start = Date.now();
+        const controller = new AbortController();
+        const abortTimeout = setTimeout(() => {
+          controller.abort();
+        }, timeoutAfterMs);
+        try {
+          const src = new URL(endpoint);
+          src.searchParams.set('r', `js_${Math.random() * 10000000}`);
+          await fetch(src.toString(), {
+            signal: controller.signal,
+          }).then((response) => response.blob());
+          const latency = Date.now() - start;
+          measurements.push(toSeconds(latency));
+        } catch (e) {
+          console.debug(`failed to measure latency to ${endpoint}`, e);
+          measurements.push(-1); // indicate error in measurement
+        }
+        // clear timeout in case fetch completes before timeout
+        clearTimeout(abortTimeout);
+      }),
+  );
+  return measurements;
+};