diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts index d6e89158..68c10b70 100644 --- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts +++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts @@ -67,16 +67,6 @@ export class ChatPanelComponent implements OnInit, AfterViewInit { */ constructor(private chatService: ChatService, private panelService: PanelService, private cd: ChangeDetectorRef) {} - /** - * @ignore - */ - @HostListener('document:keydown.escape', ['$event']) - onKeydownHandler(event: KeyboardEvent) { - if (this.panelService.isPanelOpened()) { - this.close(); - } - } - ngOnInit() { this.subscribeToMessages(); } @@ -125,7 +115,7 @@ export class ChatPanelComponent implements OnInit, AfterViewInit { private subscribeToMessages() { this.chatMessageSubscription = this.chatService.messagesObs.subscribe((messages: ChatMessage[]) => { this.messageList = messages; - if (this.panelService.isPanelOpened()) { + if (this.panelService.isChatPanelOpened()) { this.scrollToBottom(); this.cd.markForCheck(); } diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts index 1e318508..a4865707 100644 --- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts +++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts @@ -590,7 +590,7 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit { protected subscribeToChatMessages() { this.chatMessagesSubscription = this.chatService.messagesObs.pipe(skip(1)).subscribe((messages) => { - if (!this.panelService.isPanelOpened()) { + if (!this.panelService.isChatPanelOpened()) { this.unreadMessages++; } this.messageList = messages; diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/services/chat/chat.service.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/services/chat/chat.service.ts index cb567489..76401ef3 100644 --- a/openvidu-components-angular/projects/openvidu-angular/src/lib/services/chat/chat.service.ts +++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/services/chat/chat.service.ts @@ -50,7 +50,7 @@ export class ChatService { nickname: data.nickname, message: data.message }); - if (!this.panelService.isPanelOpened()) { + if (!this.panelService.isChatPanelOpened()) { const notificationOptions: INotificationOptions = { message: `${data.nickname.toUpperCase()} sent a message`, cssClassName: 'messageSnackbar', diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/services/panel/panel.service.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/services/panel/panel.service.ts index a5c180d5..46bec603 100644 --- a/openvidu-components-angular/projects/openvidu-angular/src/lib/services/panel/panel.service.ts +++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/services/panel/panel.service.ts @@ -20,9 +20,6 @@ export class PanelService { */ panelOpenedObs: Observable; protected log: ILogger; - protected isChatOpened: boolean = false; - protected isParticipantsOpened: boolean = false; - protected isActivitiesOpened: boolean = false; private isExternalOpened: boolean = false; private externalType: string; protected _panelOpened = >new BehaviorSubject({ opened: false }); @@ -59,10 +56,9 @@ export class PanelService { } else { // Panel is external this.log.d('Toggling external panel'); - this.isChatOpened = false; - this.isParticipantsOpened = false; - this.isActivitiesOpened = false; - // Open when is closed or is opened with another type + // Close all panels + this.panelMap.forEach((_, panel: string) => this.panelMap.set(panel, false)); + // Opening when external panel is closed or is opened with another type this.isExternalOpened = !this.isExternalOpened || this.externalType !== type; this.externalType = !this.isExternalOpened ? '' : type; nextOpenedValue = this.isExternalOpened; @@ -76,19 +72,15 @@ export class PanelService { * @internal */ isPanelOpened(): boolean { - return ( - this.isChatPanelOpened() || this.isParticipantsPanelOpened() || this.isActivitiesPanelOpened() || this.isExternalPanelOpened() - ); + const anyOpened = Array.from(this.panelMap.values()).some((opened) => opened); + return anyOpened || this.isExternalPanelOpened(); } /** * Closes the panel (if opened) */ closePanel(): void { - this.isParticipantsOpened = false; - this.isChatOpened = false; - this.isExternalOpened = false; - this.isActivitiesOpened = false; + this.panelMap.forEach((_, panel: string) => this.panelMap.set(panel, false)); this._panelOpened.next({ opened: false }); } @@ -96,21 +88,35 @@ export class PanelService { * Whether the chat panel is opened or not. */ isChatPanelOpened(): boolean { - return this.isChatOpened; + return !!this.panelMap.get(PanelType.CHAT); } /** * Whether the participants panel is opened or not. */ isParticipantsPanelOpened(): boolean { - return this.isParticipantsOpened; + return !!this.panelMap.get(PanelType.PARTICIPANTS); } /** * Whether the activities panel is opened or not. */ isActivitiesPanelOpened(): boolean { - return this.isActivitiesOpened; + return !!this.panelMap.get(PanelType.ACTIVITIES); + } + + /** + * Whether the settings panel is opened or not. + */ + isSettingsPanelOpened(): boolean { + return !!this.panelMap.get(PanelType.SETTINGS); + } + + /** + * Whether the background effects panel is opened or not. + */ + isBackgroundEffectsPanelOpened(): boolean { + return !!this.panelMap.get(PanelType.BACKGROUND_EFFECTS); } isExternalPanelOpened(): boolean {