@auxilium/datalynk-client 1.1.6 → 1.1.8

package/README.md

@@ -411,18 +411,24 @@ Connect to a WebRTC chatroom to send audio/video to peers
 
 ```js
 // Video elements to display stream on
-const local = document.querySelector('#video1');
-const remote = document.querySelector('#video1');
-
-const roomID = 'TEST_ROOM'
-const session = await api.webrtc.connect('test', (peer) => { // This callback fires everytime a new peer connects
-  // Set remote audio/video stream to first track once availible
-  const streams = peer.stream.getRemoteStreams();
-  if(streams[0]) remoteVideo.srcObject = streams[0];
-  else peer.stream.ontrack = ({streams}) => remoteVideo.srcObject = streams[0];
-}, true, false); // audio = true, video = false
-local.srcObject = session.stream; // Set local audio/video stream
+const local = document.querySelector('#video1'); // <video id="video1" autoplay muted playsinline></video>
+const remote = document.querySelector('#video2'); // <video id="video2" autoplay playsinline></video>
 
+// Connect to a WebRTC room
+const roomID = 'TEST_ROOM';
+const session = await api.webrtc.connect(roomID, true, true); // audio = true, video = true
+
+// Set local audio/video stream
+local.srcObject = session.stream;
+
+// Track is null on the initial connection, will fire again when the stream is ready
+session.onConnected = (peer, stream) => {
+  // Set remote audio/video stream if ready
+  if(stream) remote.srcObject = stream;
+}
+
+// Disconnect from WebRTC room
+session.disconnect();
 ```
 
 </details>

package/dist/index.js

@@ -3245,20 +3245,23 @@ class Superuser {
     } });
   }
 }
-const version = "1.1.6";
+const version = "1.1.8";
 class WebRtc {
   constructor(api) {
     __publicField(this, "ice");
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     this.api = api;
-    this.ice = clean({
-      urls: [(_a = this.api.options.webrtc) == null ? void 0 : _a.url],
-      username: (_b = this.api.options.webrtc) == null ? void 0 : _b.username,
-      credential: (_c = this.api.options.webrtc) == null ? void 0 : _c.password
-    });
+    this.ice = [
+      { urls: ["stun:" + ((_a = this.api.options.webrtc) == null ? void 0 : _a.url)] },
+      clean({
+        urls: ["turn:" + ((_b = this.api.options.webrtc) == null ? void 0 : _b.url)],
+        username: (_c = this.api.options.webrtc) == null ? void 0 : _c.username,
+        credential: (_d = this.api.options.webrtc) == null ? void 0 : _d.password
+      })
+    ];
   }
   async answer(offer, stream) {
-    const rtc = new RTCPeerConnection({ iceServers: [this.ice] });
+    const rtc = new RTCPeerConnection({ iceServers: this.ice });
     stream.getTracks().forEach((track) => rtc.addTrack(track, stream));
     await rtc.setRemoteDescription(new RTCSessionDescription(offer));
     const answer = await rtc.createAnswer();
@@ -3272,7 +3275,7 @@ class WebRtc {
     return rtc;
   }
   async offer(stream) {
-    const rtc = new RTCPeerConnection({ iceServers: [this.ice] });
+    const rtc = new RTCPeerConnection({ iceServers: this.ice });
     stream.getTracks().forEach((track) => rtc.addTrack(track, stream));
     await rtc.setLocalDescription(await rtc.createOffer());
     await new Promise((res) => {
@@ -3286,19 +3289,28 @@ class WebRtc {
   /**
    * Create a new WebRTC connection to a room
    * @param {string} id Room ID
-   * @param {(peer) => any} onConnect Callback when peers connect
    * @param {boolean} audio Stream local audio to room/peers
    * @param {boolean} video Stream local video to room/peers
    * @returns {Promise<WebRTCSession>} Connection session
    */
-  async connect(id = randomStringBuilder(16, true, true), onConnect, audio = true, video = true) {
+  async connect(id = randomStringBuilder(16, true, true), audio = true, video = true) {
     const session = {
       open: true,
       id,
       uid: randomStringBuilder(8, true, true),
       peers: {},
       stream: await navigator.mediaDevices.getUserMedia({ audio, video }),
-      disconnect: null
+      disconnect: null,
+      onConnected: null
+    };
+    const handleTracks = (session2, uid) => {
+      if (!session2.open || !session2.onConnected) return;
+      const peer = session2.peers[uid];
+      const streams = peer.connection.getRemoteStreams();
+      if (streams[0]) session2.onConnected(peer, streams[0]);
+      else peer.connection.ontrack = ({ streams: streams2 }) => {
+        if (session2.open && session2.onConnected) session2.onConnected(peer, streams2[0]);
+      };
     };
     const unsubscribe = this.api.socket.addListener(async (event) => {
       var _a, _b, _c, _d;
@@ -3309,34 +3321,34 @@ class WebRtc {
           session.peers[payload.uid] = {
             uid: payload.uid,
             username: payload.username,
-            stream: await this.offer(session.stream)
+            connection: await this.offer(session.stream)
           };
           this.api.socket.send({ [`webrtc/${id}`]: { offer: {
             to: payload.uid,
             uid: session.uid,
             username: (_a = this.api.auth.user) == null ? void 0 : _a.login,
-            offer: session.peers[payload.uid].stream.localDescription
+            offer: session.peers[payload.uid].connection.localDescription
           } } });
         } else if (event[key].disconnected) {
-          session.peers[event[key].disconnected.uid].stream.close();
+          session.peers[event[key].disconnected.uid].connection.close();
           delete session.peers[event[key].disconnected.uid];
         } else if (event[key].offer && event[key].offer.to == session.uid) {
           const payload = event[key].offer;
           session.peers[payload.uid] = {
             uid: payload.uid,
             username: payload.username,
-            stream: await this.answer(payload.offer, session.stream)
+            connection: await this.answer(payload.offer, session.stream)
           };
           this.api.socket.send({ [`webrtc/${id}`]: { answer: {
             to: payload.uid,
             uid: session.uid,
             username: (_b = this.api.auth.user) == null ? void 0 : _b.login,
-            answer: session.peers[payload.uid].stream.localDescription
+            answer: session.peers[payload.uid].connection.localDescription
           } } });
-          if (onConnect) onConnect(session.peers[payload.uid]);
+          handleTracks(session, payload.uid);
         } else if (event[key].answer && event[key].answer.to == session.uid) {
-          (_d = (_c = session.peers[event[key].answer.uid]) == null ? void 0 : _c.stream) == null ? void 0 : _d.setRemoteDescription(new RTCSessionDescription(event[key].answer.answer));
-          if (onConnect) onConnect(session.peers[event[key].answer.uid]);
+          (_d = (_c = session.peers[event[key].answer.uid]) == null ? void 0 : _c.connection) == null ? void 0 : _d.setRemoteDescription(new RTCSessionDescription(event[key].answer.answer));
+          handleTracks(session, event[key].answer.uid);
         }
       }
     }, () => {
@@ -3410,7 +3422,7 @@ const _Api = class _Api {
       saveSession: true,
       serviceWorker: "/service.worker.mjs",
       webrtc: {
-        url: "turn:scarborough.auxilium.world:3478",
+        url: "scarborough.auxilium.world:3478",
         username: "auxilium-webrtc",
         password: "UU3qkD95Tg54eF"
       },

package/dist/index.mjs

@@ -3243,20 +3243,23 @@ class Superuser {
     } });
   }
 }
-const version = "1.1.6";
+const version = "1.1.8";
 class WebRtc {
   constructor(api) {
     __publicField(this, "ice");
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     this.api = api;
-    this.ice = clean({
-      urls: [(_a = this.api.options.webrtc) == null ? void 0 : _a.url],
-      username: (_b = this.api.options.webrtc) == null ? void 0 : _b.username,
-      credential: (_c = this.api.options.webrtc) == null ? void 0 : _c.password
-    });
+    this.ice = [
+      { urls: ["stun:" + ((_a = this.api.options.webrtc) == null ? void 0 : _a.url)] },
+      clean({
+        urls: ["turn:" + ((_b = this.api.options.webrtc) == null ? void 0 : _b.url)],
+        username: (_c = this.api.options.webrtc) == null ? void 0 : _c.username,
+        credential: (_d = this.api.options.webrtc) == null ? void 0 : _d.password
+      })
+    ];
   }
   async answer(offer, stream) {
-    const rtc = new RTCPeerConnection({ iceServers: [this.ice] });
+    const rtc = new RTCPeerConnection({ iceServers: this.ice });
     stream.getTracks().forEach((track) => rtc.addTrack(track, stream));
     await rtc.setRemoteDescription(new RTCSessionDescription(offer));
     const answer = await rtc.createAnswer();
@@ -3270,7 +3273,7 @@ class WebRtc {
     return rtc;
   }
   async offer(stream) {
-    const rtc = new RTCPeerConnection({ iceServers: [this.ice] });
+    const rtc = new RTCPeerConnection({ iceServers: this.ice });
     stream.getTracks().forEach((track) => rtc.addTrack(track, stream));
     await rtc.setLocalDescription(await rtc.createOffer());
     await new Promise((res) => {
@@ -3284,19 +3287,28 @@ class WebRtc {
   /**
    * Create a new WebRTC connection to a room
    * @param {string} id Room ID
-   * @param {(peer) => any} onConnect Callback when peers connect
    * @param {boolean} audio Stream local audio to room/peers
    * @param {boolean} video Stream local video to room/peers
    * @returns {Promise<WebRTCSession>} Connection session
    */
-  async connect(id = randomStringBuilder(16, true, true), onConnect, audio = true, video = true) {
+  async connect(id = randomStringBuilder(16, true, true), audio = true, video = true) {
     const session = {
       open: true,
       id,
       uid: randomStringBuilder(8, true, true),
       peers: {},
       stream: await navigator.mediaDevices.getUserMedia({ audio, video }),
-      disconnect: null
+      disconnect: null,
+      onConnected: null
+    };
+    const handleTracks = (session2, uid) => {
+      if (!session2.open || !session2.onConnected) return;
+      const peer = session2.peers[uid];
+      const streams = peer.connection.getRemoteStreams();
+      if (streams[0]) session2.onConnected(peer, streams[0]);
+      else peer.connection.ontrack = ({ streams: streams2 }) => {
+        if (session2.open && session2.onConnected) session2.onConnected(peer, streams2[0]);
+      };
     };
     const unsubscribe = this.api.socket.addListener(async (event) => {
       var _a, _b, _c, _d;
@@ -3307,34 +3319,34 @@ class WebRtc {
           session.peers[payload.uid] = {
             uid: payload.uid,
             username: payload.username,
-            stream: await this.offer(session.stream)
+            connection: await this.offer(session.stream)
           };
           this.api.socket.send({ [`webrtc/${id}`]: { offer: {
             to: payload.uid,
             uid: session.uid,
             username: (_a = this.api.auth.user) == null ? void 0 : _a.login,
-            offer: session.peers[payload.uid].stream.localDescription
+            offer: session.peers[payload.uid].connection.localDescription
           } } });
         } else if (event[key].disconnected) {
-          session.peers[event[key].disconnected.uid].stream.close();
+          session.peers[event[key].disconnected.uid].connection.close();
           delete session.peers[event[key].disconnected.uid];
         } else if (event[key].offer && event[key].offer.to == session.uid) {
           const payload = event[key].offer;
           session.peers[payload.uid] = {
             uid: payload.uid,
             username: payload.username,
-            stream: await this.answer(payload.offer, session.stream)
+            connection: await this.answer(payload.offer, session.stream)
           };
           this.api.socket.send({ [`webrtc/${id}`]: { answer: {
             to: payload.uid,
             uid: session.uid,
             username: (_b = this.api.auth.user) == null ? void 0 : _b.login,
-            answer: session.peers[payload.uid].stream.localDescription
+            answer: session.peers[payload.uid].connection.localDescription
           } } });
-          if (onConnect) onConnect(session.peers[payload.uid]);
+          handleTracks(session, payload.uid);
         } else if (event[key].answer && event[key].answer.to == session.uid) {
-          (_d = (_c = session.peers[event[key].answer.uid]) == null ? void 0 : _c.stream) == null ? void 0 : _d.setRemoteDescription(new RTCSessionDescription(event[key].answer.answer));
-          if (onConnect) onConnect(session.peers[event[key].answer.uid]);
+          (_d = (_c = session.peers[event[key].answer.uid]) == null ? void 0 : _c.connection) == null ? void 0 : _d.setRemoteDescription(new RTCSessionDescription(event[key].answer.answer));
+          handleTracks(session, event[key].answer.uid);
         }
       }
     }, () => {
@@ -3408,7 +3420,7 @@ const _Api = class _Api {
       saveSession: true,
       serviceWorker: "/service.worker.mjs",
       webrtc: {
-        url: "turn:scarborough.auxilium.world:3478",
+        url: "scarborough.auxilium.world:3478",
         username: "auxilium-webrtc",
         password: "UU3qkD95Tg54eF"
       },

package/dist/webrtc.d.ts

@@ -1,5 +1,14 @@
 import { Unsubscribe } from '@ztimson/utils';
 import { Api } from './api';
+/** WebRTC peer */
+export type WebRTCPeer = {
+    /** Peer connection UID */
+    uid: string;
+    /** Peer username */
+    username: string;
+    /** Remote connection to stream */
+    connection: RTCPeerConnection;
+};
 /** WebRTC session */
 export type WebRTCSession = {
     /** Is the connection active? */
@@ -10,19 +19,14 @@ export type WebRTCSession = {
     uid: string;
     /** Local media stream */
     stream: MediaStream;
-    /** Connected peers */
+    /** Connected peers sorted by UID */
     peers: {
-        [key: string]: {
-            /** Peer connection UID */
-            uid: string;
-            /** Peer username */
-            username: string;
-            /** Remote connection to stream */
-            stream: RTCPeerConnection;
-        };
+        [key: string]: WebRTCPeer;
     };
     /** Disconnection session */
     disconnect: Unsubscribe;
+    /** Callback when peers connect */
+    onConnected?: (peer: WebRTCPeer, track: any) => any;
 };
 export declare class WebRtc {
     private api;
@@ -30,18 +34,17 @@ export declare class WebRtc {
         urls: string[];
         username?: string;
         credential?: string;
-    };
+    }[];
     constructor(api: Api);
     private answer;
     private offer;
     /**
      * Create a new WebRTC connection to a room
      * @param {string} id Room ID
-     * @param {(peer) => any} onConnect Callback when peers connect
      * @param {boolean} audio Stream local audio to room/peers
      * @param {boolean} video Stream local video to room/peers
      * @returns {Promise<WebRTCSession>} Connection session
      */
-    connect(id?: string, onConnect?: (peer: any) => any, audio?: boolean, video?: boolean): Promise<WebRTCSession>;
+    connect(id?: string, audio?: boolean, video?: boolean): Promise<WebRTCSession>;
 }
 //# sourceMappingURL=webrtc.d.ts.map

package/dist/webrtc.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"webrtc.d.ts","sourceRoot":"","sources":["../src/webrtc.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,WAAW,EAAC,MAAM,gBAAgB,CAAC;AACvE,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,qBAAqB;AACrB,MAAM,MAAM,aAAa,GAAG;IAC3B,gCAAgC;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,yBAAyB;IACzB,MAAM,EAAE,WAAW,CAAC;IACpB,sBAAsB;IACtB,KAAK,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG;YACtB,0BAA0B;YAC1B,GAAG,EAAE,MAAM,CAAC;YACZ,oBAAoB;YACpB,QAAQ,EAAE,MAAM,CAAC;YACjB,kCAAkC;YAClC,MAAM,EAAE,iBAAiB,CAAA;SACzB,CAAA;KAAC,CAAA;IACF,4BAA4B;IAC5B,UAAU,EAAE,WAAW,CAAA;CACvB,CAAA;AAED,qBAAa,MAAM;IAGN,OAAO,CAAC,GAAG;IAFvB,SAAgB,GAAG,EAAG;QAAC,IAAI,EAAE,MAAM,EAAE,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,UAAU,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC;gBAE3D,GAAG,EAAE,GAAG;YAQd,MAAM;YAaN,KAAK;IAWnB;;;;;;;OAOG;IACG,OAAO,CAAC,EAAE,GAAE,MAA4C,EAAE,SAAS,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,GAAG,EAAE,KAAK,UAAO,EAAE,KAAK,UAAO,GAAG,OAAO,CAAC,aAAa,CAAC;CAyD9I"}
+{"version":3,"file":"webrtc.d.ts","sourceRoot":"","sources":["../src/webrtc.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,WAAW,EAAC,MAAM,gBAAgB,CAAC;AACvE,OAAO,EAAC,GAAG,EAAC,MAAM,OAAO,CAAC;AAE1B,kBAAkB;AAClB,MAAM,MAAM,UAAU,GAAG;IACxB,0BAA0B;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,oBAAoB;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,kCAAkC;IAClC,UAAU,EAAE,iBAAiB,CAAA;CAC7B,CAAA;AAED,qBAAqB;AACrB,MAAM,MAAM,aAAa,GAAG;IAC3B,gCAAgC;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,cAAc;IACd,EAAE,EAAE,MAAM,CAAC;IACX,qBAAqB;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,yBAAyB;IACzB,MAAM,EAAE,WAAW,CAAC;IACpB,oCAAoC;IACpC,KAAK,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,UAAU,CAAA;KAAC,CAAA;IAClC,4BAA4B;IAC5B,UAAU,EAAE,WAAW,CAAA;IACvB,kCAAkC;IAClC,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,KAAK,GAAG,CAAA;CACnD,CAAA;AAED,qBAAa,MAAM;IAGN,OAAO,CAAC,GAAG;IAFvB,SAAgB,GAAG,EAAG;QAAC,IAAI,EAAE,MAAM,EAAE,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,UAAU,CAAC,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;gBAE7D,GAAG,EAAE,GAAG;YAWd,MAAM;YAaN,KAAK;IAWnB;;;;;;OAMG;IACG,OAAO,CAAC,EAAE,GAAE,MAA4C,EAAE,KAAK,UAAO,EAAE,KAAK,UAAO,GAAG,OAAO,CAAC,aAAa,CAAC;CAoEnH"}

package/package.json

@@ -2,7 +2,7 @@
 	"name": "@auxilium/datalynk-client",
 	"description": "Datalynk client library",
 	"repository": "https://gitlab.auxiliumgroup.com/auxilium/datalynk/datalynk-client",
-	"version": "1.1.6",
+	"version": "1.1.8",
 	"author": "Zak Timson <zaktimson@gmail.com>",
 	"private": false,
 	"main": "./dist/index.cjs",