@tencentcloud/roomkit-electron-vue3
Version:
<h1 align="center"> TUIRoomKit</h1> Conference (TUIRoomKit) is a product suitable for multi-person audio and video conversation scenarios such as business meetings, webinars, and online education. By integrating this product, you can add room management,
166 lines (165 loc) • 7.06 kB
JavaScript
;
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Vue = require("vue");
const TUIRoomEngine = require("@tencentcloud/tuiroom-engine-electron");
const pinia = require("pinia");
const electron = require("electron");
const IconButton = require("../common/base/IconButton.vue.js");
const ScreenShareIcon = require("../common/icons/ScreenShareIcon.vue.js");
const StopScreenShareIcon = require("../common/icons/StopScreenShareIcon.vue.js");
const Message = require("../common/base/Message/Message.js");
const room = require("../../stores/room.js");
const index = require("../../locales/index.js");
const useMitt = require("../../hooks/useMitt.js");
require("../../services/main.js");
const roomService = require("../../services/roomService.js");
const types = require("../../services/types.js");
require("../../utils/environment.js");
require("mitt");
require("../../services/manager/roomActionManager.js");
require("@tencentcloud/tui-core");
const dataReportManager = require("../../services/manager/dataReportManager.js");
const message = require("../../constants/message.js");
const _hoisted_1 = { class: "whiteboard-control-container" };
const _sfc_main = /* @__PURE__ */ Vue.defineComponent({
__name: "WhiteboardControl",
setup(__props) {
const { t } = index.useI18n();
const roomStore = room.useRoomStore();
const {
isAudience,
remoteScreenStream,
isLocalUserSharing,
isWhiteboardVisible,
isAnnotationVisible
} = pinia.storeToRefs(roomStore);
const whiteboardDisabled = Vue.computed(
() => isAudience.value || isLocalUserSharing.value
);
const title = Vue.computed(
() => isWhiteboardVisible.value ? t("Close whiteboard") : t("Open whiteboard")
);
function handleWhiteboardDialog() {
if (isWhiteboardVisible.value) {
stopShareWhiteboard();
} else {
startShareWhiteboard();
}
}
async function startShareWhiteboard() {
var _a;
if (isWhiteboardVisible.value) {
return;
}
if (isAudience.value) {
Message.default({
type: "warning",
message: t(
"You currently do not have whiteboard permission, please raise your hand to apply for whiteboard permission first"
),
duration: message.MESSAGE_DURATION.LONG
});
return;
}
if (whiteboardDisabled.value) {
Message.default({
type: "warning",
message: t(
"Screen sharing is currently active, cannot start the whiteboard."
),
duration: message.MESSAGE_DURATION.LONG
});
return;
}
if (remoteScreenStream.value) {
Message.default({
type: "warning",
message: t(
"Another user is currently sharing the screen, screen sharing is not possible."
),
duration: message.MESSAGE_DURATION.LONG
});
return;
}
showWhiteboardWindow();
const screenAndWindowsList = await ((_a = roomService.roomEngine.instance) == null ? void 0 : _a.getScreenSharingTarget());
const windowList = screenAndWindowsList.filter(
(screen) => screen.type === TUIRoomEngine.TRTCScreenCaptureSourceType.TRTCScreenCaptureSourceTypeWindow
);
windowList.forEach((info) => {
var _a2;
if (info.sourceName.includes("Whiteboard window")) {
(_a2 = roomService.roomEngine.instance) == null ? void 0 : _a2.startScreenSharingElectron({
targetId: info.sourceId
});
}
});
}
function stopShareWhiteboard() {
var _a;
(_a = roomService.roomEngine.instance) == null ? void 0 : _a.stopScreenSharing();
if (isWhiteboardVisible.value) {
roomService.roomService.dataReportManager.reportCount(dataReportManager.MetricsKey.stopSharingWhiteboard);
}
if (isAnnotationVisible.value) {
roomService.roomService.dataReportManager.reportCount(dataReportManager.MetricsKey.stopAnnotating);
}
isWhiteboardVisible.value = false;
isAnnotationVisible.value = false;
hideAllWhiteboardWindow();
}
function hideAllWhiteboardWindow() {
electron.ipcRenderer.send("annotation:hide");
electron.ipcRenderer.send("whiteboard:hide-window");
}
function showWhiteboardWindow() {
isWhiteboardVisible.value = true;
electron.ipcRenderer.send("whiteboard:show-window");
roomService.roomService.dataReportManager.reportCount(dataReportManager.MetricsKey.startSharingWhiteboard);
}
electron.ipcRenderer.on("whiteboard:window-closed", () => {
stopShareWhiteboard();
});
electron.ipcRenderer.on("whiteboard:stop-from-whiteboard-window", () => {
stopShareWhiteboard();
});
electron.ipcRenderer.on("whiteboard:save-from-whiteboard-window", () => {
roomService.roomService.dataReportManager.reportCount(dataReportManager.MetricsKey.saveWhiteboard);
});
Vue.onMounted(() => {
useMitt.default.on("ScreenShare:stopScreenShare", stopShareWhiteboard);
roomService.roomService.on(types.EventType.KICKED_OUT, stopShareWhiteboard);
roomService.roomService.on(types.EventType.USER_SIG_EXPIRED, stopShareWhiteboard);
roomService.roomService.on(types.EventType.KICKED_OFFLINE, stopShareWhiteboard);
roomService.roomService.on(types.EventType.ROOM_LEAVE, stopShareWhiteboard);
roomService.roomService.on(types.EventType.ROOM_DISMISS, stopShareWhiteboard);
roomService.roomService.on(types.EventType.USER_LOGOUT, stopShareWhiteboard);
});
Vue.onUnmounted(() => {
useMitt.default.off("ScreenShare:stopScreenShare", stopShareWhiteboard);
roomService.roomService.off(types.EventType.KICKED_OUT, stopShareWhiteboard);
roomService.roomService.off(types.EventType.USER_SIG_EXPIRED, stopShareWhiteboard);
roomService.roomService.off(types.EventType.KICKED_OFFLINE, stopShareWhiteboard);
roomService.roomService.off(types.EventType.ROOM_LEAVE, stopShareWhiteboard);
roomService.roomService.off(types.EventType.ROOM_DISMISS, stopShareWhiteboard);
roomService.roomService.off(types.EventType.USER_LOGOUT, stopShareWhiteboard);
roomService.roomService.resetStore();
});
return (_ctx, _cache) => {
return Vue.openBlock(), Vue.createElementBlock("div", _hoisted_1, [
Vue.createVNode(IconButton.default, {
"is-active": Vue.unref(isWhiteboardVisible),
title: title.value,
disabled: whiteboardDisabled.value,
onClickIcon: handleWhiteboardDialog
}, {
default: Vue.withCtx(() => [
Vue.unref(isWhiteboardVisible) ? (Vue.openBlock(), Vue.createBlock(StopScreenShareIcon.default, { key: 0 })) : (Vue.openBlock(), Vue.createBlock(ScreenShareIcon.default, { key: 1 }))
]),
_: 1
}, 8, ["is-active", "title", "disabled"])
]);
};
}
});
exports.default = _sfc_main;