@dronedeploy/rocos-js-sdk 3.0.1-alpha.1 → 3.0.1-alpha.11

package/cjs/services/RTPWebRTCService.d.ts

@@ -0,0 +1,102 @@
+import { IBaseService, IRocosSDKConfig, RocosError } from '../models';
+import { Observable } from 'rxjs';
+import { BaseServiceAbstract } from './BaseServiceAbstract';
+export declare enum WebRTCEventType {
+    LoadingTURNConfigs = "loading-turn-configs",
+    Disconnected = "disconnected",
+    DataChannelOpen = "data-channel-open",
+    CreatingOffer = "creating-offer",
+    AddingRemoteTrack = "adding-remote-track",
+    ICEConnectionStateChange = "ice-connection-state-change",
+    SendingOffer = "sending-offer",
+    FailedGettingTURNConfig = "failed-getting-turn-config",
+    GotTURNConfig = "got-turn-config",
+    FailedGettingAnswer = "failed-getting-answer",
+    GotAnswer = "got-answer",
+    DataChannelMessage = "data-channel-message"
+}
+interface EventMetadata {
+    [WebRTCEventType.ICEConnectionStateChange]: {
+        state: RTCIceConnectionState;
+    };
+    [WebRTCEventType.DataChannelMessage]: {
+        label: string;
+        data: string;
+    };
+}
+interface Event<T extends WebRTCEventType> {
+    type: T;
+    metadata: T extends keyof EventMetadata ? EventMetadata[T] : undefined;
+}
+export type WebRTCEvent = {
+    [K in keyof typeof WebRTCEventType]: Event<(typeof WebRTCEventType)[K]>;
+}[keyof typeof WebRTCEventType];
+export interface PeerConnectionParams {
+    projectId: string;
+    callsign: string;
+    logLevel?: 'trace';
+}
+interface InternalPeerConnectionParams extends PeerConnectionParams {
+    endpoint: {
+        host: string;
+        port: number;
+        insecure: boolean;
+    };
+    token: string;
+}
+export declare class RTPWebRTCService extends BaseServiceAbstract implements IBaseService {
+    constructor(config: IRocosSDKConfig);
+    getStatus(): boolean;
+    protected getError(e: Error): RocosError;
+    /** Create a new peer connection with a robot
+     *
+     * To connect, call `connect` on the returned connection
+     *
+     * If `logLevel` is set to trace, the connection will emit all messages as events
+     */
+    createPeerConnection(params: PeerConnectionParams): WebRTCConnection;
+}
+export declare class WebRTCConnection {
+    private pc?;
+    private sendChannel?;
+    private readonly endpoint;
+    private readonly token;
+    private readonly projectId;
+    private readonly callsign;
+    private readonly logLevel?;
+    private errorsSubject$;
+    private streamsSubject$;
+    private eventsSubject$;
+    readonly errors$: Observable<Error>;
+    readonly events$: Observable<WebRTCEvent>;
+    readonly streams$: Observable<MediaStream[]>;
+    constructor(params: InternalPeerConnectionParams);
+    get peerConnectionAvailable(): boolean;
+    /** Connect to the robot
+     *
+     * This will create a new peer connection, and send an offer to the robot.
+     * If a connection already exists, it will be disconnected first
+     *
+     * @throws {Error} if the offer fails
+     * @returns {Promise<void>} resolves when the connection is established
+     */
+    connect(): Promise<void>;
+    /**
+     * Disconnect from the robot
+     */
+    disconnect(): void;
+    /**
+     * Subscribe to a video or audio topic
+     *
+     * This will send a message to the robot to start streaming the requested topic.
+     *
+     * Any data received will be sent to the streams emitted by `streams$`
+     */
+    subscribeToTopic(topic: string, type: 'video' | 'audio'): void;
+    private sendOffer;
+    private loadConfig;
+    private createPeerConnection;
+    private getEndpoint;
+    private log;
+}
+export {};

package/cjs/services/RTPWebRTCService.js

@@ -0,0 +1,232 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WebRTCConnection = exports.RTPWebRTCService = exports.WebRTCEventType = void 0;
+const models_1 = require("../models");
+const rxjs_1 = require("rxjs");
+const BaseServiceAbstract_1 = require("./BaseServiceAbstract");
+const splitRobotTopic_1 = require("../helpers/splitRobotTopic");
+var WebRTCEventType;
+(function (WebRTCEventType) {
+    WebRTCEventType["LoadingTURNConfigs"] = "loading-turn-configs";
+    WebRTCEventType["Disconnected"] = "disconnected";
+    WebRTCEventType["DataChannelOpen"] = "data-channel-open";
+    WebRTCEventType["CreatingOffer"] = "creating-offer";
+    WebRTCEventType["AddingRemoteTrack"] = "adding-remote-track";
+    WebRTCEventType["ICEConnectionStateChange"] = "ice-connection-state-change";
+    WebRTCEventType["SendingOffer"] = "sending-offer";
+    WebRTCEventType["FailedGettingTURNConfig"] = "failed-getting-turn-config";
+    WebRTCEventType["GotTURNConfig"] = "got-turn-config";
+    WebRTCEventType["FailedGettingAnswer"] = "failed-getting-answer";
+    WebRTCEventType["GotAnswer"] = "got-answer";
+    WebRTCEventType["DataChannelMessage"] = "data-channel-message";
+})(WebRTCEventType || (exports.WebRTCEventType = WebRTCEventType = {}));
+class RTPWebRTCService extends BaseServiceAbstract_1.BaseServiceAbstract {
+    constructor(config) {
+        super(config);
+    }
+    getStatus() {
+        return true;
+    }
+    getError(e) {
+        return new models_1.RocosError(e, models_1.errorCodes.WEBRTC_SERVICE_ERROR);
+    }
+    /** Create a new peer connection with a robot
+     *
+     * To connect, call `connect` on the returned connection
+     *
+     * If `logLevel` is set to trace, the connection will emit all messages as events
+     */
+    createPeerConnection(params) {
+        const isInsecure = this.config.insecure ?? false;
+        const port = this.config.port ?? (isInsecure ? 80 : 443);
+        return new WebRTCConnection({
+            endpoint: {
+                host: this.config.url,
+                port,
+                insecure: isInsecure,
+            },
+            token: this.config.token,
+            projectId: params.projectId,
+            callsign: params.callsign,
+            logLevel: params.logLevel,
+        });
+    }
+}
+exports.RTPWebRTCService = RTPWebRTCService;
+class WebRTCConnection {
+    constructor(params) {
+        this.errorsSubject$ = new rxjs_1.Subject();
+        this.streamsSubject$ = new rxjs_1.Subject();
+        this.eventsSubject$ = new rxjs_1.Subject();
+        this.errors$ = this.errorsSubject$.asObservable();
+        this.events$ = this.eventsSubject$.asObservable();
+        this.streams$ = this.streamsSubject$.pipe((0, rxjs_1.scan)((streams, stream) => [...streams, stream].filter((i) => i.active), []), (0, rxjs_1.shareReplay)(1));
+        this.endpoint = params.endpoint;
+        this.token = params.token;
+        this.projectId = params.projectId;
+        this.callsign = params.callsign;
+        this.logLevel = params.logLevel;
+    }
+    get peerConnectionAvailable() {
+        return !!this.pc;
+    }
+    /** Connect to the robot
+     *
+     * This will create a new peer connection, and send an offer to the robot.
+     * If a connection already exists, it will be disconnected first
+     *
+     * @throws {Error} if the offer fails
+     * @returns {Promise<void>} resolves when the connection is established
+     */
+    async connect() {
+        if (this.peerConnectionAvailable)
+            this.disconnect(); // disconnect any lingering connections
+        const config = await this.loadConfig();
+        const pc = this.createPeerConnection(config);
+        this.pc = pc;
+        // Creating data channel, must be done before creating the offer
+        const sendChannel = pc.createDataChannel('submanager');
+        sendChannel.onclose = () => this.log(WebRTCEventType.Disconnected);
+        sendChannel.onopen = () => {
+            this.log(WebRTCEventType.DataChannelOpen);
+        };
+        sendChannel.onmessage = (e) => {
+            this.log(WebRTCEventType.DataChannelMessage, {
+                label: sendChannel.label,
+                data: e.data,
+            });
+        };
+        // Offer to receive 1 audio, and 1 video track
+        pc.addTransceiver('video', { direction: 'recvonly' });
+        pc.addTransceiver('audio', { direction: 'recvonly' });
+        this.log(WebRTCEventType.CreatingOffer);
+        this.sendChannel = sendChannel;
+        await pc.createOffer().then((d) => pc.setLocalDescription(d));
+    }
+    /**
+     * Disconnect from the robot
+     */
+    disconnect() {
+        this.sendChannel?.close();
+        this.pc?.close();
+        this.pc = undefined;
+        this.sendChannel = undefined;
+    }
+    /**
+     * Subscribe to a video or audio topic
+     *
+     * This will send a message to the robot to start streaming the requested topic.
+     *
+     * Any data received will be sent to the streams emitted by `streams$`
+     */
+    subscribeToTopic(topic, type) {
+        if (!this.sendChannel) {
+            throw new Error(`Failed to start ${type}, no data channel available`);
+        }
+        if (!topic || topic.split('/').length < 1) {
+            throw new Error('Invalid Topic Provided');
+        }
+        const { component, topic: path } = (0, splitRobotTopic_1.splitRobotTopic)(topic);
+        this.sendChannel.send(JSON.stringify({
+            projectId: this.projectId,
+            callsign: this.callsign,
+            component,
+            topic: path,
+            token: this.token,
+            logLevel: this.logLevel,
+            type,
+            mode: 'subscribe',
+        }));
+    }
+    async sendOffer(sdp) {
+        return fetch(this.getEndpoint('sdp'), {
+            method: 'POST',
+            headers: {
+                Authorization: `Bearer ${this.token}`,
+            },
+            body: JSON.stringify({
+                sdp,
+            }),
+        })
+            .then((res) => res.json())
+            .catch((err) => {
+            this.log(WebRTCEventType.FailedGettingAnswer);
+            throw new Error(err);
+        })
+            .then((res) => {
+            this.log(WebRTCEventType.GotAnswer);
+            return res;
+        });
+    }
+    async loadConfig() {
+        this.log(WebRTCEventType.LoadingTURNConfigs);
+        return fetch(this.getEndpoint('/sdp/configs'), {
+            method: 'GET',
+            headers: {
+                Authorization: `Bearer ${this.token}`,
+            },
+        })
+            .then((res) => res.json())
+            .catch((err) => {
+            this.log(WebRTCEventType.FailedGettingTURNConfig);
+            throw new Error(err);
+        })
+            .then((res) => {
+            this.log(WebRTCEventType.GotTURNConfig);
+            return res;
+        });
+    }
+    createPeerConnection(config) {
+        const pc = new RTCPeerConnection(config);
+        this.pc = pc;
+        pc.ontrack = (event) => {
+            if (!document) {
+                this.errorsSubject$.next(new Error('No browser - operation not supported'));
+            }
+            for (const stream of event.streams) {
+                this.streamsSubject$.next(stream);
+            }
+            this.log(WebRTCEventType.AddingRemoteTrack);
+        };
+        pc.oniceconnectionstatechange = () => {
+            this.log(WebRTCEventType.ICEConnectionStateChange, {
+                state: pc.iceConnectionState,
+            });
+            if (pc.iceConnectionState === 'failed') {
+                this.errorsSubject$.next(new Error('ICE Connection Failed'));
+            }
+        };
+        pc.onicecandidate = async (event) => {
+            if (event.candidate === null) {
+                const sdp = btoa(JSON.stringify(pc.localDescription));
+                this.log(WebRTCEventType.SendingOffer);
+                const { answer } = await this.sendOffer(sdp);
+                this.log(WebRTCEventType.GotAnswer);
+                try {
+                    await pc.setRemoteDescription(new RTCSessionDescription(JSON.parse(atob(answer))));
+                }
+                catch (e) {
+                    this.log(WebRTCEventType.FailedGettingAnswer);
+                    console.error('Failed to get answer', e);
+                    this.errorsSubject$.next(new Error('Failed to get answer'));
+                }
+            }
+        };
+        return pc;
+    }
+    getEndpoint(path) {
+        const { host, port, insecure } = this.endpoint;
+        const protocol = insecure ? 'http' : 'https';
+        const base = new URL(`${protocol}://${host}:${port}`);
+        if (path)
+            base.pathname = path;
+        return base.toString();
+    }
+    log(type, metadata) {
+        this.eventsSubject$.next({
+            type,
+            metadata,
+        });
+    }
+}
+exports.WebRTCConnection = WebRTCConnection;

package/cjs/services/RTPWebRTCService.spec.d.ts

@@ -0,0 +1,4 @@
+/**
+ * @jest-environment jsdom
+ */
+export {};

package/cjs/services/RTPWebRTCService.spec.js

@@ -0,0 +1,171 @@
+"use strict";
+/**
+ * @jest-environment jsdom
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const rxjs_1 = require("rxjs");
+const RTPWebRTCService_1 = require("./RTPWebRTCService");
+class WebRTCMockHelper {
+    constructor() {
+        this.dataChannel = {
+            label: 'submanager',
+            onopen: () => void 0,
+            onclose: () => void 0,
+            onmessage: (e) => void 0,
+            send: this.sendMessage.bind(this),
+            close: this.close.bind(this),
+        };
+        this.connection = {
+            ontrack: (event) => void 0,
+            oniceconnectionstatechange: () => void 0,
+            onicecandidate: async (event) => void 0,
+            setRemoteDescription: jest.fn(),
+            iceConnectionState: 'new',
+            localDescription: null,
+            createDataChannel: jest.fn().mockReturnValue(this.dataChannel),
+            addTransceiver: jest.fn(),
+            createOffer: this.createOffer.bind(this),
+            setLocalDescription: jest.fn(),
+            close: this.close.bind(this),
+        };
+        this.streams = [];
+    }
+    installMocks() {
+        ;
+        global.RTCPeerConnection = jest.fn().mockReturnValue(this.connection);
+        global.RTCSessionDescription = jest.fn();
+        this.mockFetch();
+    }
+    async createOffer() {
+        await this.connection.onicecandidate({
+            candidate: null,
+        });
+        this.connection.iceConnectionState = 'checking';
+        this.connection.oniceconnectionstatechange();
+        this.addTrack('my-stream-1');
+        this.addTrack('my-stream-2');
+        this.connection.iceConnectionState = 'connected';
+        this.connection.oniceconnectionstatechange();
+        this.dataChannel.onopen();
+        return {
+            sdp: 'my-sdp',
+            type: 'offer',
+        };
+    }
+    addTrack(name) {
+        const stream = { name, active: true };
+        this.streams.push(stream);
+        this.connection.ontrack({
+            streams: [stream],
+        });
+    }
+    close() {
+        this.streams.forEach((stream) => {
+            stream.active = false;
+        });
+        this.dataChannel.onclose();
+        this.connection.iceConnectionState = 'closed';
+        this.connection.oniceconnectionstatechange();
+    }
+    sendMessage(message) {
+        const { logLevel } = JSON.parse(message);
+        if (logLevel === 'trace') {
+            this.dataChannel.onmessage({
+                data: message,
+            });
+        }
+    }
+    mockFetch() {
+        global.fetch = jest.fn().mockImplementation((url) => {
+            switch (url) {
+                case 'https://localhost:0/sdp/configs':
+                    return Promise.resolve({
+                        json: () => ({
+                            iceServers: [
+                                {
+                                    urls: ['stun:turn.localhost:443'],
+                                },
+                            ],
+                        }),
+                    });
+                case 'https://localhost:0/sdp':
+                    return Promise.resolve({
+                        json: () => ({
+                            answer: btoa('null'),
+                        }),
+                    });
+                default:
+                    throw new Error(`Unexpected URL: ${url}`);
+            }
+        });
+    }
+}
+describe('RTPWebRTCService', () => {
+    let service;
+    beforeEach(() => {
+        service = new RTPWebRTCService_1.RTPWebRTCService({
+            url: 'localhost',
+            port: 0,
+            token: 'test',
+        });
+    });
+    describe('streams$', () => {
+        it('should emit a stream when a new stream is added', async () => {
+            // Arrange
+            new WebRTCMockHelper().installMocks();
+            const connection = service.createPeerConnection({
+                projectId: 'my-project',
+                callsign: 'my-callsign',
+                logLevel: 'trace',
+            });
+            // Act
+            const streams = await (0, rxjs_1.lastValueFrom)(connection.streams$.pipe((0, rxjs_1.takeUntil)(connection.connect()), (0, rxjs_1.toArray)()));
+            // Assert
+            expect(streams).toEqual([
+                [
+                    {
+                        name: 'my-stream-1',
+                        active: true,
+                    },
+                ],
+                [
+                    {
+                        name: 'my-stream-1',
+                        active: true,
+                    },
+                    {
+                        name: 'my-stream-2',
+                        active: true,
+                    },
+                ],
+            ]);
+        });
+        it('should reset the streams when the connection is disconnected and the streams become inactive', async () => {
+            // Arrange
+            new WebRTCMockHelper().installMocks();
+            const connection = service.createPeerConnection({
+                projectId: 'my-project',
+                callsign: 'my-callsign',
+                logLevel: 'trace',
+            });
+            // Act
+            const streams = await (0, rxjs_1.lastValueFrom)(connection.streams$.pipe((0, rxjs_1.takeUntil)((async () => {
+                await connection.connect();
+                connection.disconnect();
+                await connection.connect();
+            })()), (0, rxjs_1.toArray)()));
+            expect(streams).toEqual([
+                [{ name: 'my-stream-1', active: false }],
+                [
+                    { name: 'my-stream-1', active: false },
+                    { name: 'my-stream-2', active: false },
+                ],
+                [{ name: 'my-stream-1', active: true }],
+                [
+                    { name: 'my-stream-1', active: true },
+                    { name: 'my-stream-2', active: true },
+                ],
+            ]);
+        });
+    });
+});