Merge pull request #1 from iotum/jerry_hu/meeting-widget

implement meeting widget
iotum · Nov 30, 2022 · c8986e2 · c8986e2
2 parents b510957 + 9683165
commit c8986e2
Show file tree

Hide file tree

Showing 39 changed files with 13,046 additions and 1 deletion.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,29 @@
+{
+  "overrides": [
+    {
+      "files": [
+        "src/**/*.ts"
+      ]
+    }
+  ],
+  "extends": [
+    "eslint:recommended",
+    "plugin:jest/recommended"
+  ],
+  "parser": "@typescript-eslint/parser",
+  "plugins": [
+    "@typescript-eslint",
+    "jest",
+    "prettier"
+  ],
+  "rules": {
+    "prettier/prettier": "error"
+  },
+  "ignorePatterns": [
+    "dist/*"
+  ],
+  "env": {
+    "browser": true,
+    "jest/globals": true
+  }
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+node_modules
+index.tsbuildinfo
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -0,0 +1,4 @@
+{
+  "singleQuote": true,
+  "trailingComma": "all"
+}
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
@@ -0,0 +1,16 @@
+{
+	"version": "2.0.0",
+	"tasks": [
+		{
+			"type": "npm",
+			"script": "build",
+			"group": {
+				"kind": "build",
+				"isDefault": true
+			},
+			"problemMatcher": [],
+			"label": "npm: build",
+			"detail": "tsc"
+		}
+	]
+}
diff --git a/README.md b/README.md
@@ -1,2 +1,33 @@
 # callbridge-js
-Loading wrapper for Callbridge
+
+Loading wrapper for Callbridge WebSDK.
+
+## Installation
+
+### Install the library in your project:
+
+```bash
+npm install @iotum/callbridge-js
+```
+
+```js
+// All widgets
+import * as Callbridge from '@iotum/callbridge-js';
+
+// Single widget
+import { Meeting } from '@iotum/callbridge-js';
+```
+
+### Manually include the script tag in your Single Page App:
+
+Add the following script tag to the `<head>` section on your site.
+
+```js
+<script src="https://app.callbridge.com/packs/js/widget.js" async></script>
+```
+
+The Widgets are exposed globally under `window.Callbridge`.
+
+## Usage
+
+See Wiki for usage.
diff --git a/dist/dashboard.d.ts b/dist/dashboard.d.ts
@@ -0,0 +1,24 @@
+import Widget, { WidgetOptions } from './widget';
+/**
+ * Dashboard page.
+ */
+export type Page = '' | 'chat' | 'drive' | 'contacts' | 'meetings';
+/**
+ * Callbridge Dashboard.
+ */
+export default class Dashboard extends Widget {
+    constructor(
+    /**
+     * Widget options
+     */
+    options: WidgetOptions, 
+    /**
+     * The page to load after logging in
+     */
+    page?: Page);
+    /**
+     * Loads the page.
+     * @param page the page to load.
+     */
+    loadPage(page: Page): void;
+}
diff --git a/dist/dashboard.js b/dist/dashboard.js
@@ -0,0 +1,33 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const widget_1 = __importDefault(require("./widget"));
+/**
+ * Callbridge Dashboard.
+ */
+class Dashboard extends widget_1.default {
+    constructor(
+    /**
+     * Widget options
+     */
+    options, 
+    /**
+     * The page to load after logging in
+     */
+    page = '') {
+        super(options);
+        this.load({
+            redirect_url: `/conf/${page || ''}`,
+        });
+    }
+    /**
+     * Loads the page.
+     * @param page the page to load.
+     */
+    loadPage(page) {
+        this._send('portal', 'loadPage', { page });
+    }
+}
+exports.default = Dashboard;
diff --git a/dist/index.d.ts b/dist/index.d.ts
@@ -0,0 +1,5 @@
+export { WidgetOptions } from './widget';
+export { default as Dashboard, Page } from './dashboard';
+export { AudioSettings } from './room';
+export { default as Meeting, MeetingOptions } from './meeting';
+export { default as Livestream, LivestreamOptions } from './livestream';
diff --git a/dist/index.js b/dist/index.js
@@ -0,0 +1,12 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Livestream = exports.Meeting = exports.Dashboard = void 0;
+var dashboard_1 = require("./dashboard");
+Object.defineProperty(exports, "Dashboard", { enumerable: true, get: function () { return __importDefault(dashboard_1).default; } });
+var meeting_1 = require("./meeting");
+Object.defineProperty(exports, "Meeting", { enumerable: true, get: function () { return __importDefault(meeting_1).default; } });
+var livestream_1 = require("./livestream");
+Object.defineProperty(exports, "Livestream", { enumerable: true, get: function () { return __importDefault(livestream_1).default; } });
diff --git a/dist/livestream.d.ts b/dist/livestream.d.ts
@@ -0,0 +1,37 @@
+import Room from './room';
+import { WidgetOptions } from './widget';
+/**
+ * Livestream options.
+ */
+export type LivestreamOptions = {
+    /**
+     * If provided, sets the viewer's name.
+     */
+    name?: string;
+    /**
+     * If provided, shows the chat panel to the right of the livestream player. If set to 'intercept', emits an event instead of sending the message.
+     */
+    chat?: boolean | 'intercept';
+    /**
+     * If set, hides the native media controls on the livestream player.
+     */
+    hideControls?: boolean;
+};
+/**
+ * Callbridge Meeting Room.
+ */
+export default class Livestream extends Room {
+    constructor(
+    /**
+     * Widget options
+     */
+    options: WidgetOptions, 
+    /**
+     * The room to stream
+     */
+    roomId: string, 
+    /**
+     * Livestream options
+     */
+    livestreamOptions?: LivestreamOptions);
+}
diff --git a/dist/livestream.js b/dist/livestream.js
@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const room_1 = __importDefault(require("./room"));
+/**
+ * Callbridge Meeting Room.
+ */
+class Livestream extends room_1.default {
+    constructor(
+    /**
+     * Widget options
+     */
+    options, 
+    /**
+     * The room to stream
+     */
+    roomId, 
+    /**
+     * Livestream options
+     */
+    livestreamOptions) {
+        super(options);
+        this.load(Object.assign(Object.assign({}, livestreamOptions), { redirect_url: `/livestream/${roomId}` }));
+    }
+}
+exports.default = Livestream;
diff --git a/dist/meeting.d.ts b/dist/meeting.d.ts
@@ -0,0 +1,82 @@
+import Room from './room';
+import { WidgetOptions } from './widget';
+/**
+ * Meeting options.
+ */
+export type MeetingOptions = {
+    /**
+     * If provided, the user will not be prompted for name when entering meeting room.
+     */
+    name?: string;
+    /**
+     * If set, the user will skip the video/audio device selection dialog when entering meeting room, and use the system default or previously used devices.
+     */
+    skipJoin?: boolean;
+    /**
+     * If set, the user will enter the meeting room with the device turned off.
+     */
+    mute?: {
+        /**
+         * Microphone.
+         */
+        mic?: boolean;
+        /**
+         * Camera.
+         */
+        camera?: boolean;
+    };
+    /**
+     * If set, the user will enter the meeting room with camera off and without a participant tile to others. They can still hear and be heard by others.
+     */
+    observer?: boolean;
+    /**
+     * If provided, the user will enter the meeting room as a moderator.
+     */
+    moderatorToken?: string;
+    /**
+     * If provided, sets the maximum sending video resolution.
+     */
+    resolution?: 180 | 360 | 720 | 1080;
+    /**
+     * If provided, sets the initial meeting view upon entering. The default view is gallery view.
+     */
+    view?: 'gallery' | 'bottom_speaker' | 'left_side_speaker';
+    /**
+     * If provided, sets the maximum on-screen tiles in the gallery view page.
+     */
+    tiles?: number;
+    /**
+     * If set, emits audio level events.
+     */
+    audioLevel?: boolean;
+    /**
+     * If set, renders the participants as a strip with fixed tile height and 6 tiles.
+     */
+    stripLayout?: boolean;
+    /**
+     * Mobile Only. If set, automatically switches speaker view to bottom vs. left based on the device orientation.
+     */
+    autoView?: boolean;
+    /**
+     * SSO Only. If provided, the user will be redirected to the provided URL after exiting a call.
+     */
+    afterCallUrl?: string;
+};
+/**
+ * Callbridge Meeting Room.
+ */
+export default class Meeting extends Room {
+    constructor(
+    /**
+     * Widget options
+     */
+    options: WidgetOptions, 
+    /**
+     * The room to join
+     */
+    roomId: string, 
+    /**
+     * Meeting options
+     */
+    meetingOptions?: MeetingOptions);
+}
diff --git a/dist/meeting.js b/dist/meeting.js
@@ -0,0 +1,44 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const room_1 = __importDefault(require("./room"));
+/**
+ * Callbridge Meeting Room.
+ */
+class Meeting extends room_1.default {
+    constructor(
+    /**
+     * Widget options
+     */
+    options, 
+    /**
+     * The room to join
+     */
+    roomId, 
+    /**
+     * Meeting options
+     */
+    meetingOptions = {}) {
+        super(options);
+        const { name, skipJoin, mute: { mic: muteMic, camera: muteCamera } = {}, observer, moderatorToken, resolution, view, tiles, audioLevel, stripLayout, autoView, afterCallUrl, } = meetingOptions;
+        this.load({
+            redirect_url: `/conf/call/${roomId}`,
+            name,
+            skip_join: skipJoin,
+            observer,
+            moderatorToken,
+            res: resolution,
+            view,
+            tiles,
+            audio_level: audioLevel,
+            strip_layout: stripLayout,
+            auto_view: autoView,
+            after_call_url: afterCallUrl,
+            mute: [muteMic && 'mic', muteCamera && 'camera'].filter(Boolean).join(',') ||
+                undefined,
+        });
+    }
+}
+exports.default = Meeting;