Skip to content
This repository was archived by the owner on Oct 18, 2024. It is now read-only.

Commit

Permalink
Merge pull request #713 from SuperViz/fix/build-esm-files
Browse files Browse the repository at this point in the history 
Add a flag to know when the participant entered the meeting room and little events corrections
  • Loading branch information
@carlossantos74
carlossantos74 authored Jul 11, 2024
2 parents b190876 + 3ac288b commit bbace2b
Show file tree
Hide file tree
Showing 7 changed files with 80 additions and 92 deletions.
6 changes: 6 additions & 0 deletions src/common/types/participant.types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,12 @@ export interface Participant {
timestamp?: number;
}

export interface VideoParticipant extends Participant {
participantId?: string;
color?: string;
joinedMeeting?: boolean;
}

export type ParticipantByGroupApi = {
id: string;
name: string;
Expand Down
17 changes: 13 additions & 4 deletions src/components/video/index.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,11 @@ import {
RealtimeEvent,
TranscriptState,
} from '../../common/types/events.types';
import { Participant, ParticipantType } from '../../common/types/participant.types';
import {
Participant,
ParticipantType,
VideoParticipant,
} from '../../common/types/participant.types';
import { StoreType } from '../../common/types/stores.types';
import { useStore } from '../../common/utils/use-store';
import { IOC } from '../../services/io';
Expand Down Expand Up @@ -89,7 +93,7 @@ describe('VideoConference', () => {
allowGuests: false,
});

VideoConferenceInstance['localParticipant'] = MOCK_LOCAL_PARTICIPANT;
VideoConferenceInstance['localParticipant'] = MOCK_LOCAL_PARTICIPANT as VideoParticipant;
VideoConferenceInstance.attach({
ioc: new IOC(MOCK_LOCAL_PARTICIPANT),
config: MOCK_CONFIG,
Expand All @@ -113,7 +117,7 @@ describe('VideoConference', () => {
VideoConferenceInstance['localParticipant'] = {
...MOCK_LOCAL_PARTICIPANT,
avatar: MOCK_AVATAR,
};
} as VideoParticipant;

VideoConferenceInstance.attach({
ioc: new IOC(MOCK_LOCAL_PARTICIPANT),
Expand Down Expand Up @@ -484,6 +488,7 @@ describe('VideoConference', () => {
expect(VideoConferenceInstance['roomState'].updateMyProperties).toHaveBeenCalledWith({
name: 'John Doe',
type: ParticipantType.HOST,
joinedMeeting: true,
});
});

Expand All @@ -503,6 +508,7 @@ describe('VideoConference', () => {
name: 'John Doe',
avatar: MOCK_AVATAR,
type: ParticipantType.HOST,
joinedMeeting: true,
});
});

Expand Down Expand Up @@ -589,7 +595,7 @@ describe('VideoConference', () => {
},
});

const participantInfoList: Participant[] = [
const participantInfoList: VideoParticipant[] = [
{
id: participants.value[MOCK_LOCAL_PARTICIPANT.id].id,
avatar: participants.value[MOCK_LOCAL_PARTICIPANT.id].avatar,
Expand All @@ -598,6 +604,7 @@ describe('VideoConference', () => {
isHost: participants.value[MOCK_LOCAL_PARTICIPANT.id].isHost ?? false,
slot: participants.value[MOCK_LOCAL_PARTICIPANT.id].slot,
timestamp: participants.value[MOCK_LOCAL_PARTICIPANT.id].timestamp,
color: MEETING_COLORS.turquoise,
},
];

Expand Down Expand Up @@ -648,12 +655,14 @@ describe('VideoConference', () => {
[MOCK_LOCAL_PARTICIPANT.id]: {
...participants[MOCK_LOCAL_PARTICIPANT.id],
timestamp: 0,
color: MEETING_COLORS.turquoise,
},
});
VideoConferenceInstance['onParticipantListUpdate']({
[MOCK_LOCAL_PARTICIPANT.id]: {
...participants[MOCK_LOCAL_PARTICIPANT.id],
timestamp: 0,
color: MEETING_COLORS.turquoise,
},
});

Expand Down
47 changes: 25 additions & 22 deletions src/components/video/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,11 @@ import {
RealtimeEvent,
TranscriptState,
} from '../../common/types/events.types';
import { Participant, ParticipantType } from '../../common/types/participant.types';
import {
VideoParticipant,
ParticipantType,
Participant,
} from '../../common/types/participant.types';
import { StoreType } from '../../common/types/stores.types';
import { Logger } from '../../common/utils';
import { BrowserService } from '../../services/browser';
Expand Down Expand Up @@ -40,8 +44,8 @@ let KICK_PARTICIPANTS_TIMEOUT: ReturnType<typeof setTimeout> | null = null;
export class VideoConference extends BaseComponent {
public name: ComponentNames;
protected logger: Logger;
private participantsOnMeeting: Partial<Participant>[] = [];
private localParticipant: Participant;
private participantsOnMeeting: Partial<VideoParticipant>[] = [];
private localParticipant: VideoParticipant;
private videoManager: VideoConferenceManager;
private connectionService: ConnectionService;
private browserService: BrowserService;
Expand Down Expand Up @@ -178,15 +182,17 @@ export class VideoConference extends BaseComponent {
* @returns {void}
*/
private startVideo = (): void => {
const defaultAvatars =
this.params?.userType !== ParticipantType.AUDIENCE && this.params?.defaultAvatars === true;

this.videoConfig = {
language: this.params?.language,
canUseRecording: !!this.params?.enableRecording,
canShowAudienceList: this.params?.showAudienceList ?? true,
canUseChat: !this.params?.chatOff,
canUseCams: !this.params?.camsOff,
canUseScreenshare: !this.params?.screenshareOff,
canUseDefaultAvatars:
!!this.params?.defaultAvatars && !this.localParticipant?.avatar?.model3DUrl,
canUseDefaultAvatars: defaultAvatars && !this.localParticipant?.avatar?.model3DUrl,
canUseGather: !!this.params?.enableGather,
canUseFollow: !!this.params?.enableFollow,
canUseGoTo: !!this.params?.enableGoTo,
Expand Down Expand Up @@ -301,7 +307,10 @@ export class VideoConference extends BaseComponent {
this.useStore(StoreType.VIDEO);

localParticipant.subscribe((participant) => {
this.localParticipant = participant;
this.localParticipant = {
...this.localParticipant,
...participant,
};
});

drawing.subscribe(this.setDrawing);
Expand All @@ -321,7 +330,7 @@ export class VideoConference extends BaseComponent {
* */
private createParticipantFromPresence = (
participant: PresenceEvent<Participant>,
): ParticipantToFrame => {
): VideoParticipant => {
return {
participantId: participant.id,
id: participant.id,
Expand Down Expand Up @@ -396,9 +405,6 @@ export class VideoConference extends BaseComponent {
private onMeetingStateChange = (state: MeetingState): void => {
this.logger.log('video conference @ on meeting state change', state);
this.publish(MeetingEvent.MEETING_STATE_UPDATE, state);

const { localParticipant } = this.useStore(StoreType.GLOBAL);
localParticipant.publish(localParticipant.value);
};

/**
Expand Down Expand Up @@ -496,7 +502,7 @@ export class VideoConference extends BaseComponent {
* @param {Participant} participant - participant
* @returns {void}
*/
private onParticipantJoined = (participant: Participant): void => {
private onParticipantJoined = (participant: VideoParticipant): void => {
this.logger.log('video conference @ on participant joined', participant);

this.publish(MeetingEvent.MEETING_PARTICIPANT_JOINED, participant);
Expand All @@ -508,6 +514,7 @@ export class VideoConference extends BaseComponent {
avatar: participant.avatar,
name: participant.name,
type: participant.type,
joinedMeeting: true,
});

return;
Expand All @@ -516,6 +523,7 @@ export class VideoConference extends BaseComponent {
this.roomState.updateMyProperties({
name: participant.name,
type: participant.type,
joinedMeeting: true,
});
};

Expand All @@ -525,7 +533,7 @@ export class VideoConference extends BaseComponent {
* @param {Participant} _ - participant
* @returns {void}
*/
private onParticipantLeft = (_: Participant): void => {
private onParticipantLeft = (_: VideoParticipant): void => {
this.logger.log('video conference @ on participant left', this.localParticipant);

this.connectionService.removeListeners();
Expand All @@ -546,10 +554,10 @@ export class VideoConference extends BaseComponent {
* @param {Record<string, Participant>} participants - participants
* @returns {void}
*/
private onParticipantListUpdate = (participants: Record<string, Participant>): void => {
private onParticipantListUpdate = (participants: Record<string, VideoParticipant>): void => {
this.logger.log('video conference @ on participant list update', participants);

const list: Participant[] = Object.values(participants).map((participant) => {
const list: VideoParticipant[] = Object.values(participants).map((participant) => {
return {
id: participant.id,
slot: participant.slot,
Expand All @@ -558,6 +566,7 @@ export class VideoConference extends BaseComponent {
type: participant.type,
isHost: participant.isHost ?? false,
timestamp: participant.timestamp,
color: participant.slot?.color || MEETING_COLORS.gray,
};
});

Expand Down Expand Up @@ -792,12 +801,6 @@ export class VideoConference extends BaseComponent {
MeetingEvent.MY_PARTICIPANT_UPDATED,
this.createParticipantFromPresence(participant),
);

localParticipant.publish({
...localParticipant.value,
...participant.data,
type: this.params.userType as ParticipantType,
});
}

participants.publish({
Expand Down Expand Up @@ -883,9 +886,9 @@ export class VideoConference extends BaseComponent {
}

return current;
}, null) as Participant;
}, null) as VideoParticipant;

this.room.presence.update<Participant>({
this.room.presence.update<VideoParticipant>({
...this.localParticipant,
isHost: host.id === this.localParticipant.id,
});
Expand Down
41 changes: 26 additions & 15 deletions src/core/launcher/index.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,17 @@ describe('Launcher', () => {

const { localParticipant } = LauncherInstance['useStore'](StoreType.GLOBAL);

LauncherInstance['onParticipantUpdatedIOC']({
connectionId: 'connection1',
data: {
...MOCK_LOCAL_PARTICIPANT,
activeComponents: [MOCK_COMPONENT.name],
},
id: MOCK_LOCAL_PARTICIPANT.id,
name: MOCK_LOCAL_PARTICIPANT.name as string,
timestamp: Date.now(),
});

expect(localParticipant.value.activeComponents?.length).toBe(1);
expect(localParticipant.value.activeComponents![0]).toBe(MOCK_COMPONENT.name);
});
Expand All @@ -113,6 +124,17 @@ describe('Launcher', () => {

const { localParticipant } = LauncherInstance['useStore'](StoreType.GLOBAL);

LauncherInstance['onParticipantUpdatedIOC']({
connectionId: 'connection1',
data: {
...MOCK_LOCAL_PARTICIPANT,
activeComponents: [],
},
id: MOCK_LOCAL_PARTICIPANT.id,
name: MOCK_LOCAL_PARTICIPANT.name as string,
timestamp: Date.now(),
});

expect(MOCK_COMPONENT.detach).toHaveBeenCalled();
expect(localParticipant.value.activeComponents?.length).toBe(0);
});
Expand Down Expand Up @@ -191,32 +213,20 @@ describe('Launcher', () => {
expect(LauncherInstance['publish']).toHaveBeenCalled();
});

test('should update activeComponentsInstances when participant list is updated', () => {
LauncherInstance.addComponent(MOCK_COMPONENT);

LauncherInstance['onParticipantListUpdate']({
participant1: {
id: 'unit-test-participant-ably-id',
activeComponents: [MOCK_COMPONENT.name],
},
});

expect(LauncherInstance['activeComponentsInstances'].length).toBe(1);
});

test('should remove component when participant is not usign it anymore', () => {
LauncherInstance.addComponent(MOCK_COMPONENT);

LauncherInstance['onParticipantUpdatedIOC']({
connectionId: 'connection1',
id: MOCK_LOCAL_PARTICIPANT.id,
name: MOCK_LOCAL_PARTICIPANT.name as string,
data: {
...MOCK_LOCAL_PARTICIPANT,
activeComponents: [],
},
timestamp: Date.now(),
});

LauncherInstance.addComponent(MOCK_COMPONENT);

expect(LauncherInstance['activeComponentsInstances'].length).toBe(1);

LauncherInstance.removeComponent(MOCK_COMPONENT);
Expand All @@ -227,6 +237,7 @@ describe('Launcher', () => {
name: MOCK_LOCAL_PARTICIPANT.name as string,
data: {
...MOCK_LOCAL_PARTICIPANT,
activeComponents: LauncherInstance['activeComponents'],
},
timestamp: Date.now(),
});
Expand Down
Loading

0 comments on commit bbace2b

Please sign in to comment.