@digitalsamba/embedded-sdk 0.0.13 → 0.0.18

package/dist/cjs/types.js

@@ -1,8 +1,2 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LayoutMode = void 0;
-var LayoutMode;
-(function (LayoutMode) {
-    LayoutMode["tiled"] = "tiled";
-    LayoutMode["auto"] = "auto";
-})(LayoutMode = exports.LayoutMode || (exports.LayoutMode = {}));

package/dist/cjs/utils/PermissionManager/index.d.ts

@@ -0,0 +1,13 @@
+import { CheckPermissionsOptions, HasPermissionsOptions, LookupPermissionOptions, PermissionsMap, RefinePermissionsOptions } from './types';
+import { PermissionTypes } from '../vars';
+import { EmbeddedInstance } from '../../types';
+export declare class PermissionManager {
+    parent: EmbeddedInstance;
+    permissionsMap: PermissionsMap;
+    constructor(parent: EmbeddedInstance);
+    lookupDynamicPermission: (permission: PermissionTypes, dynamicPermissions: PermissionTypes[] | undefined) => boolean;
+    lookupPermission: (options: LookupPermissionOptions) => boolean;
+    checkPermissions: ({ permissions, targetRole, permissionsMap, role, dynamicPermissions, }: CheckPermissionsOptions) => boolean;
+    refinePermissions: (permissions: PermissionTypes | PermissionTypes[], { targetRole, role, userId, users, permissionsMap, localUser }: RefinePermissionsOptions) => boolean;
+    hasPermissions: (permissions: PermissionTypes | PermissionTypes[], { targetRole, role, userId }?: HasPermissionsOptions) => boolean;
+}

package/dist/cjs/utils/PermissionManager/index.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PermissionManager = void 0;
+class PermissionManager {
+    constructor(parent) {
+        this.permissionsMap = {};
+        this.lookupDynamicPermission = (permission, dynamicPermissions) => {
+            if (!dynamicPermissions) {
+                return false;
+            }
+            return dynamicPermissions.includes(permission);
+        };
+        this.lookupPermission = (options) => {
+            const { permissionsMap, permission, targetRole, role, dynamicPermissions } = options;
+            if (dynamicPermissions) {
+                const granted = this.lookupDynamicPermission(permission, dynamicPermissions);
+                if (granted) {
+                    return true;
+                }
+            }
+            if (permissionsMap[role][permission]) {
+                return true;
+            }
+            return Boolean(permissionsMap[role][`${permission}_${targetRole}`]);
+        };
+        this.checkPermissions = ({ permissions, targetRole, permissionsMap, role, dynamicPermissions, }) => {
+            if (Array.isArray(permissions)) {
+                return permissions.some((permission) => this.lookupPermission({ permission, targetRole, role, permissionsMap, dynamicPermissions }));
+            }
+            return this.lookupPermission({
+                permission: permissions,
+                targetRole,
+                role,
+                permissionsMap,
+                dynamicPermissions,
+            });
+        };
+        this.refinePermissions = (permissions, { targetRole, role, userId, users, permissionsMap, localUser }) => {
+            const options = {
+                permissionsMap,
+                permissions,
+                targetRole,
+                role: localUser.role,
+                dynamicPermissions: localUser.dynamicPermissions,
+            };
+            if (role) {
+                options.role = role;
+                options.dynamicPermissions = undefined;
+            }
+            if (userId && users) {
+                options.role = users[userId].role;
+                options.dynamicPermissions = users[userId].dynamicPermissions;
+            }
+            return this.checkPermissions(options);
+        };
+        this.hasPermissions = (permissions, { targetRole, role, userId } = {}) => {
+            const users = this.parent.stored.users;
+            const localUser = this.parent.localUser;
+            if (!localUser) {
+                return false;
+            }
+            return this.refinePermissions(permissions, {
+                permissionsMap: this.permissionsMap,
+                role,
+                targetRole,
+                users,
+                userId,
+                localUser,
+            });
+        };
+        this.parent = parent;
+    }
+}
+exports.PermissionManager = PermissionManager;

package/dist/cjs/utils/PermissionManager/types.d.ts

@@ -0,0 +1,23 @@
+import { User, UserId } from '../../types';
+import { PermissionTypes } from '../vars';
+export type PermissionsMap = Record<string, Record<string, boolean>>;
+export interface HasPermissionsOptions {
+    targetRole?: string;
+    role?: string;
+    userId?: UserId;
+}
+export interface RefinePermissionsOptions extends HasPermissionsOptions {
+    permissionsMap: PermissionsMap;
+    localUser: User;
+    users?: Record<UserId, User>;
+}
+export interface LookupPermissionOptions {
+    permissionsMap: PermissionsMap;
+    permission: PermissionTypes;
+    role: string;
+    targetRole?: string;
+    dynamicPermissions?: PermissionTypes[];
+}
+export interface CheckPermissionsOptions extends Omit<LookupPermissionOptions, 'permission'> {
+    permissions: PermissionTypes | PermissionTypes[];
+}

package/dist/cjs/utils/PermissionManager/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/utils/proxy.d.ts

@@ -0,0 +1 @@
+export declare const createWatchedProxy: <G>(initialState: G, onChange: (newState: G) => void) => any;

package/dist/cjs/utils/proxy.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createWatchedProxy = void 0;
+const createHandler = (onChange) => {
+    const handler = {
+        get(target, key) {
+            if (typeof target[key] === 'object' && target[key] !== null) {
+                return new Proxy(target[key], handler);
+            }
+            return target[key];
+        },
+        set(target, prop, value) {
+            target[prop] = value;
+            onChange(target);
+            return target;
+        },
+    };
+    return handler;
+};
+const createWatchedProxy = (initialState, onChange) => new Proxy(initialState, createHandler(onChange));
+exports.createWatchedProxy = createWatchedProxy;

package/dist/cjs/utils/vars.d.ts

@@ -0,0 +1,23 @@
+import { Stored } from '../types';
+export declare const CONNECT_TIMEOUT = 10000;
+export declare const internalEvents: Record<string, boolean>;
+export declare enum LayoutMode {
+    tiled = "tiled",
+    auto = "auto"
+}
+export declare enum PermissionTypes {
+    broadcast = "broadcast",
+    manageBroadcast = "manage_broadcast",
+    endSession = "end_session",
+    startSession = "start_session",
+    removeParticipant = "remove_participant",
+    screenshare = "screenshare",
+    manageScreenshare = "manage_screenshare",
+    recording = "recording",
+    generalChat = "general_chat",
+    remoteMuting = "remote_muting",
+    askRemoteUnmute = "ask_remote_unmute",
+    raiseHand = "raise_hand",
+    manageRoles = "manage_roles"
+}
+export declare const defaultStoredState: Stored;

package/dist/cjs/utils/vars.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultStoredState = exports.PermissionTypes = exports.LayoutMode = exports.internalEvents = exports.CONNECT_TIMEOUT = void 0;
+exports.CONNECT_TIMEOUT = 10000;
+exports.internalEvents = {
+    roomJoined: true,
+};
+var LayoutMode;
+(function (LayoutMode) {
+    LayoutMode["tiled"] = "tiled";
+    LayoutMode["auto"] = "auto";
+})(LayoutMode = exports.LayoutMode || (exports.LayoutMode = {}));
+var PermissionTypes;
+(function (PermissionTypes) {
+    PermissionTypes["broadcast"] = "broadcast";
+    PermissionTypes["manageBroadcast"] = "manage_broadcast";
+    PermissionTypes["endSession"] = "end_session";
+    PermissionTypes["startSession"] = "start_session";
+    PermissionTypes["removeParticipant"] = "remove_participant";
+    PermissionTypes["screenshare"] = "screenshare";
+    PermissionTypes["manageScreenshare"] = "manage_screenshare";
+    PermissionTypes["recording"] = "recording";
+    PermissionTypes["generalChat"] = "general_chat";
+    PermissionTypes["remoteMuting"] = "remote_muting";
+    PermissionTypes["askRemoteUnmute"] = "ask_remote_unmute";
+    PermissionTypes["raiseHand"] = "raise_hand";
+    PermissionTypes["manageRoles"] = "manage_roles";
+})(PermissionTypes = exports.PermissionTypes || (exports.PermissionTypes = {}));
+exports.defaultStoredState = {
+    userId: '',
+    roomState: {
+        media: {
+            micEnabled: false,
+            cameraEnabled: false,
+        },
+        layout: {
+            mode: LayoutMode.tiled,
+            showToolbar: true,
+            toolbarPosition: 'left',
+        },
+        captionsState: {
+            showCaptions: false,
+            spokenLanguage: 'en',
+            fontSize: 'medium',
+        },
+    },
+    users: {},
+};

package/dist/esm/index.d.ts

@@ -1,14 +1,18 @@
 /// <reference types="node" />
-import { InitOptions, InstanceProperties, LayoutMode, UserId, CaptionsOptions } from './types';
 import EventEmitter from 'events';
-export declare class DigitalSambaEmbedded extends EventEmitter {
+import { PermissionManager } from './utils/PermissionManager';
+import { LayoutMode } from './utils/vars';
+import { CaptionsOptions, EmbeddedInstance, InitialRoomSettings, InitOptions, InstanceProperties, Stored, UserId } from './types';
+export declare class DigitalSambaEmbedded extends EventEmitter implements EmbeddedInstance {
     initOptions: Partial<InitOptions>;
+    roomSettings: Partial<InitialRoomSettings>;
     savedIframeSrc: string;
     allowedOrigin: string;
     connected: boolean;
     frame: HTMLIFrameElement;
     reportErrors: boolean;
-    private stored;
+    stored: Stored;
+    permissionManager: PermissionManager;
     constructor(options?: Partial<InitOptions>, instanceProperties?: Partial<InstanceProperties>, loadImmediately?: boolean);
     static createControl: (initOptions: InitOptions) => DigitalSambaEmbedded;
     private mountFrame;
@@ -18,11 +22,14 @@ export declare class DigitalSambaEmbedded extends EventEmitter {
     private _emit;
     private handleInternalMessage;
     private emitUsersUpdated;
+    private emitRoomStateUpdated;
     private setFrameSrc;
     private checkTarget;
     private sendMessage;
     private logError;
     private applyFrameProperties;
+    get roomState(): import("./types").RoomState;
+    get localUser(): import("./types").User;
     enableVideo: () => void;
     disableVideo: () => void;
     toggleVideo: (enable?: boolean) => void;
@@ -48,4 +55,10 @@ export declare class DigitalSambaEmbedded extends EventEmitter {
     hideCaptions: () => void;
     toggleCaptions: (show?: boolean) => void;
     configureCaptions: (options: Partial<CaptionsOptions>) => void;
+    raiseHand: () => void;
+    lowerHand: (target?: UserId) => void;
+    allowBroadcast: (userId: UserId) => void;
+    disallowBroadcast: (userId: UserId) => void;
+    allowScreenshare: (userId: UserId) => void;
+    disallowScreenshare: (userId: UserId) => void;
 }

package/dist/esm/index.js

@@ -1,22 +1,20 @@
 var _a;
-import { ALLOW_ATTRIBUTE_MISSING, INVALID_CONFIG, INVALID_URL, UNKNOWN_TARGET, } from './utils/errors';
 import EventEmitter from 'events';
-const CONNECT_TIMEOUT = 10000;
-const internalEvents = {
-    roomJoined: true,
-};
+import { PermissionManager } from './utils/PermissionManager';
+import { CONNECT_TIMEOUT, defaultStoredState, internalEvents, } from './utils/vars';
+import { createWatchedProxy } from './utils/proxy';
+import { ALLOW_ATTRIBUTE_MISSING, INVALID_CONFIG, INVALID_URL, UNKNOWN_TARGET, } from './utils/errors';
 export class DigitalSambaEmbedded extends EventEmitter {
     constructor(options = {}, instanceProperties = {}, loadImmediately = true) {
         super();
+        this.roomSettings = {};
         this.savedIframeSrc = '';
         this.allowedOrigin = '*';
         this.connected = false;
         this.frame = document.createElement('iframe');
         this.reportErrors = false;
-        this.stored = {
-            users: {},
-            localUserPermissions: {},
-        };
+        this.stored = Object.assign({}, defaultStoredState);
+        this.permissionManager = new PermissionManager(this);
         this.mountFrame = (loadImmediately) => {
             const { url, frame, root } = this.initOptions;
             if (root) {
@@ -74,6 +72,9 @@ export class DigitalSambaEmbedded extends EventEmitter {
             this.on('userJoined', (event) => {
                 const { user, type } = event.data;
                 this.stored.users[user.id] = Object.assign(Object.assign({}, user), { kind: type });
+                if (type === 'local') {
+                    this.stored.userId = user.id;
+                }
                 this.emitUsersUpdated();
             });
             this.on('userLeft', (event) => {
@@ -84,7 +85,58 @@ export class DigitalSambaEmbedded extends EventEmitter {
                 this.emitUsersUpdated();
             });
             this.on('permissionsChanged', (event) => {
-                this.stored.localUserPermissions = Object.assign(Object.assign({}, this.stored.localUserPermissions), (event.data || {}));
+                if (this.stored.users[this.stored.userId]) {
+                    let modifiedPermissions = [
+                        ...(this.stored.users[this.stored.userId].dynamicPermissions || []),
+                    ];
+                    Object.entries(event.data).forEach(([permission, enabled]) => {
+                        if (enabled && !modifiedPermissions.includes(permission)) {
+                            modifiedPermissions.push(permission);
+                        }
+                        if (!enabled) {
+                            modifiedPermissions = modifiedPermissions.filter((userPermission) => userPermission !== permission);
+                        }
+                    });
+                    this.stored.users[this.stored.userId].dynamicPermissions =
+                        modifiedPermissions;
+                }
+            });
+            this.on('activeSpeakerChanged', (event) => {
+                var _b, _c;
+                this.stored.activeSpeaker = (_c = (_b = event.data) === null || _b === void 0 ? void 0 : _b.user) === null || _c === void 0 ? void 0 : _c.id;
+            });
+            this.on('videoEnabled', (event) => {
+                var _b;
+                if (((_b = event.data) === null || _b === void 0 ? void 0 : _b.type) === 'local') {
+                    this.stored.roomState.media.cameraEnabled = true;
+                }
+            });
+            this.on('videoDisabled', (event) => {
+                var _b;
+                if (((_b = event.data) === null || _b === void 0 ? void 0 : _b.type) === 'local') {
+                    this.stored.roomState.media.cameraEnabled = false;
+                }
+            });
+            this.on('audioEnabled', (event) => {
+                var _b;
+                if (((_b = event.data) === null || _b === void 0 ? void 0 : _b.type) === 'local') {
+                    this.stored.roomState.media.micEnabled = true;
+                }
+            });
+            this.on('audioDisabled', (event) => {
+                var _b;
+                if (((_b = event.data) === null || _b === void 0 ? void 0 : _b.type) === 'local') {
+                    this.stored.roomState.media.micEnabled = false;
+                }
+            });
+            this.on('layoutModeChanged', (event) => {
+                this.stored.roomState.layout.mode = event.data.mode;
+            });
+            this.on('captionsSpokenLanguageChanged', (event) => {
+                this.stored.roomState.captionsState.spokenLanguage = event.data.language;
+            });
+            this.on('captionsFontSizeChanged', (event) => {
+                this.stored.roomState.captionsState.fontSize = event.data.fontSize;
             });
         };
         this._emit = (eventName, ...args) => {
@@ -95,8 +147,14 @@ export class DigitalSambaEmbedded extends EventEmitter {
             const message = event.DSPayload;
             switch (message.type) {
                 case 'roomJoined': {
-                    this.stored.users = message.data.users;
+                    const { users, roomState, activeSpeaker, permissionsMap } = message.data;
+                    this.stored.users = Object.assign(Object.assign({}, this.stored.users), users);
+                    this.stored.roomState = createWatchedProxy(Object.assign({}, roomState), this.emitRoomStateUpdated);
+                    this.stored.activeSpeaker = activeSpeaker;
+                    this.permissionManager.permissionsMap = permissionsMap;
                     this.emitUsersUpdated();
+                    this.emitRoomStateUpdated();
+                    this._emit('roomJoined', { type: 'roomJoined' });
                     break;
                 }
                 default: {
@@ -107,15 +165,21 @@ export class DigitalSambaEmbedded extends EventEmitter {
         this.emitUsersUpdated = () => {
             this._emit('usersUpdated', { type: 'usersUpdated', data: { users: this.listUsers() } });
         };
+        this.emitRoomStateUpdated = () => {
+            this._emit('roomStateUpdated', { type: 'roomStateUpdated', data: { state: this.roomState } });
+        };
         this.setFrameSrc = () => {
             let url = this.savedIframeSrc;
             const { team, room, token } = this.initOptions;
             if (team && room) {
                 url = `https://${team}.digitalsamba.com/${room}`;
             }
-            if (url && token) {
+            if (url) {
                 const urlObj = new URL(url);
-                urlObj.searchParams.append('token', token);
+                urlObj.searchParams.append('dsEmbedFrame', 'true');
+                if (token) {
+                    urlObj.searchParams.append('token', token);
+                }
                 url = urlObj.toString();
             }
             if (url) {
@@ -127,7 +191,10 @@ export class DigitalSambaEmbedded extends EventEmitter {
             }
             const allowedURL = new URL(this.frame.src);
             this.allowedOrigin = allowedURL.origin;
-            this.frame.onload = () => this.checkTarget();
+            this.frame.onload = () => {
+                this._emit('frameLoaded');
+                this.checkTarget();
+            };
         };
         this.logError = (error) => {
             if (this.reportErrors) {
@@ -152,9 +219,11 @@ export class DigitalSambaEmbedded extends EventEmitter {
         };
         // commands
         this.enableVideo = () => {
+            this.roomSettings.cameraEnabled = true;
             this.sendMessage({ type: 'enableVideo' });
         };
         this.disableVideo = () => {
+            this.roomSettings.cameraEnabled = false;
             this.sendMessage({ type: 'disableVideo' });
         };
         this.toggleVideo = (enable) => {
@@ -169,9 +238,11 @@ export class DigitalSambaEmbedded extends EventEmitter {
             }
         };
         this.enableAudio = () => {
+            this.roomSettings.micEnabled = true;
             this.sendMessage({ type: 'enableAudio' });
         };
         this.disableAudio = () => {
+            this.roomSettings.micEnabled = false;
             this.sendMessage({ type: 'disableAudio' });
         };
         this.toggleAudio = (enable) => {
@@ -198,12 +269,17 @@ export class DigitalSambaEmbedded extends EventEmitter {
             this.sendMessage({ type: 'stopRecording' });
         };
         this.showToolbar = () => {
+            this.roomSettings.showToolbar = true;
+            this.stored.roomState.layout.showToolbar = true;
             this.sendMessage({ type: 'showToolbar' });
         };
         this.hideToolbar = () => {
+            this.roomSettings.showToolbar = false;
+            this.stored.roomState.layout.showToolbar = false;
             this.sendMessage({ type: 'hideToolbar' });
         };
         this.changeLayoutMode = (mode) => {
+            this.roomSettings.layoutMode = mode;
             this.sendMessage({ type: 'changeLayoutMode', data: mode });
         };
         this.leaveSession = () => {
@@ -214,6 +290,7 @@ export class DigitalSambaEmbedded extends EventEmitter {
         };
         this.toggleToolbar = (show) => {
             if (typeof show === 'undefined') {
+                this.stored.roomState.layout.showToolbar = !this.stored.roomState.layout.showToolbar;
                 this.sendMessage({ type: 'toggleToolbar' });
             }
             else if (show) {
@@ -245,13 +322,19 @@ export class DigitalSambaEmbedded extends EventEmitter {
         };
         this.listUsers = () => Object.values(this.stored.users);
         this.showCaptions = () => {
+            this.roomSettings.showCaptions = true;
+            this.stored.roomState.captionsState.showCaptions = true;
             this.sendMessage({ type: 'showCaptions' });
         };
         this.hideCaptions = () => {
+            this.roomSettings.showCaptions = false;
+            this.stored.roomState.captionsState.showCaptions = false;
             this.sendMessage({ type: 'hideCaptions' });
         };
         this.toggleCaptions = (show) => {
             if (typeof show === 'undefined') {
+                this.stored.roomState.captionsState.showCaptions =
+                    !this.stored.roomState.captionsState.showCaptions;
                 this.sendMessage({ type: 'toggleCaptions' });
             }
             else if (show) {
@@ -264,7 +347,26 @@ export class DigitalSambaEmbedded extends EventEmitter {
         this.configureCaptions = (options) => {
             this.sendMessage({ type: 'configureCaptions', data: options || {} });
         };
+        this.raiseHand = () => {
+            this.sendMessage({ type: 'raiseHand' });
+        };
+        this.lowerHand = (target) => {
+            this.sendMessage({ type: 'lowerHand', data: target });
+        };
+        this.allowBroadcast = (userId) => {
+            this.sendMessage({ type: 'allowBroadcast', data: userId });
+        };
+        this.disallowBroadcast = (userId) => {
+            this.sendMessage({ type: 'disallowBroadcast', data: userId });
+        };
+        this.allowScreenshare = (userId) => {
+            this.sendMessage({ type: 'allowScreenshare', data: userId });
+        };
+        this.disallowScreenshare = (userId) => {
+            this.sendMessage({ type: 'disallowScreenshare', data: userId });
+        };
         this.initOptions = options;
+        this.roomSettings = options.roomSettings || {};
         this.reportErrors = instanceProperties.reportErrors || false;
         this.frame.allow = 'camera; microphone; display-capture; autoplay;';
         this.frame.setAttribute('allowFullscreen', 'true');
@@ -279,7 +381,7 @@ export class DigitalSambaEmbedded extends EventEmitter {
         this.setupInternalEventListeners();
     }
     checkTarget() {
-        this.sendMessage({ type: 'connect' });
+        this.sendMessage({ type: 'connect', data: this.roomSettings || {} });
         const confirmationTimeout = window.setTimeout(() => {
             this.logError(UNKNOWN_TARGET);
         }, CONNECT_TIMEOUT);
@@ -290,11 +392,21 @@ export class DigitalSambaEmbedded extends EventEmitter {
     }
     sendMessage(message) {
         if (this.frame.contentWindow) {
+            if (!this.connected && message.type !== 'connect') {
+                return;
+            }
             this.frame.contentWindow.postMessage(message, {
                 targetOrigin: this.allowedOrigin,
             });
         }
     }
+    // getters
+    get roomState() {
+        return this.stored.roomState;
+    }
+    get localUser() {
+        return this.stored.users[this.stored.userId];
+    }
 }
 _a = DigitalSambaEmbedded;
 DigitalSambaEmbedded.createControl = (initOptions) => new _a(initOptions, {}, false);