bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/plugins-engine/dom-element-manipulation/user-camera/hook-manager.ts

85 lines
3.9 KiB
TypeScript

import {
useContext,
useEffect,
useState,
} from 'react';
import { HookEventWrapper, SubscribedEventDetails, UpdatedEventDetails } from 'bigbluebutton-html-plugin-sdk/dist/cjs/core/types';
import { HookEvents } from 'bigbluebutton-html-plugin-sdk/dist/cjs/core/enum';
import { DomElementManipulationHooks } from 'bigbluebutton-html-plugin-sdk/dist/cjs/dom-element-manipulation/enums';
import { PluginsContext } from '/imports/ui/components/components-data/plugin-context/context';
import { UserCameraDomElementsArguments } from 'bigbluebutton-html-plugin-sdk/dist/cjs/dom-element-manipulation/user-camera/types';
import { StreamIdNeededForPlugin } from './types';
import { PluginsContextType } from '../../../components-data/plugin-context/types';
const UserCameraDomElementManipulationHookManager = () => {
const {
setDomElementManipulationIdentifiers,
} = useContext<PluginsContextType>(PluginsContext);
const [neededStreamIdsForPlugin, setNeededStreamIdsForPlugin] = useState<StreamIdNeededForPlugin>({});
useEffect(() => {
const subscribeHandler: EventListener = (
(event: HookEventWrapper<void>) => {
let hookArguments: UserCameraDomElementsArguments;
if (event.detail.hook === DomElementManipulationHooks.USER_CAMERA) {
const detail = event.detail as SubscribedEventDetails;
hookArguments = detail.hookArguments as UserCameraDomElementsArguments;
setNeededStreamIdsForPlugin((lastState) => {
const newState = { ...lastState };
newState[hookArguments.pluginUuid] = hookArguments.streamIds;
return newState;
});
}
}) as EventListener;
const unsubscribeHandler: EventListener = (
(event: HookEventWrapper<void>) => {
let hookArguments: UserCameraDomElementsArguments;
if (event.detail.hook === DomElementManipulationHooks.USER_CAMERA) {
const detail = event.detail as SubscribedEventDetails;
hookArguments = detail.hookArguments as UserCameraDomElementsArguments;
setNeededStreamIdsForPlugin((lastState) => {
const newState = { ...lastState };
if (Object.keys(newState).includes(hookArguments.pluginUuid)) delete newState[hookArguments.pluginUuid];
return newState;
});
}
}) as EventListener;
const updateSdkDependenciesHandler: EventListener = (
(event: HookEventWrapper<void>) => {
let hookArguments: UserCameraDomElementsArguments;
if (event.detail.hook === DomElementManipulationHooks.USER_CAMERA) {
const detail = event.detail as UpdatedEventDetails<void>;
hookArguments = detail.hookArguments as UserCameraDomElementsArguments;
setNeededStreamIdsForPlugin((lastState) => {
const newState = { ...lastState };
newState[hookArguments.pluginUuid] = hookArguments.streamIds;
return newState;
});
}
}) as EventListener;
window.addEventListener(HookEvents.PLUGIN_SUBSCRIBED_TO_BBB_CORE, subscribeHandler);
window.addEventListener(HookEvents.PLUGIN_UNSUBSCRIBED_FROM_BBB_CORE, unsubscribeHandler);
window.addEventListener(HookEvents.PLUGIN_SENT_CHANGES_TO_BBB_CORE, updateSdkDependenciesHandler);
return () => {
window.removeEventListener(HookEvents.PLUGIN_SUBSCRIBED_TO_BBB_CORE, subscribeHandler);
window.removeEventListener(HookEvents.PLUGIN_UNSUBSCRIBED_FROM_BBB_CORE, unsubscribeHandler);
window.removeEventListener(HookEvents.PLUGIN_SENT_CHANGES_TO_BBB_CORE, updateSdkDependenciesHandler);
};
}, []);
useEffect(() => {
const streamIds = [...new Set(Object.values(neededStreamIdsForPlugin).flat())];
setDomElementManipulationIdentifiers((previousState) => {
const newState = { ...previousState };
newState.USER_CAMERA = streamIds;
return newState;
});
}, [neededStreamIdsForPlugin]);
return null;
};
export default UserCameraDomElementManipulationHookManager;