ambiser
/
openvidu
mirror of https://github.com/OpenVidu/openvidu.git
9
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

ov-components: replace user media subscription with reactive effect for local participant changes

master
Carlos Santos 2025-12-22 19:46:10 +01:00
parent 703403f182
commit ce7dd0aa6f
1 changed files with 26 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar.component.ts
View File

@ -5,6 +5,7 @@ import {
Component, Component,
computed, computed,
ContentChild, ContentChild,
effect,
EventEmitter, EventEmitter,
HostListener, HostListener,
OnDestroy, OnDestroy,
@ -29,7 +30,7 @@ import { BroadcastingStatus, BroadcastingStatusInfo, BroadcastingStopRequestedEv
import { ChatMessage } from '../../models/chat.model'; import { ChatMessage } from '../../models/chat.model';
import { ILogger } from '../../models/logger.model'; import { ILogger } from '../../models/logger.model';
import { PanelStatusInfo, PanelType } from '../../models/panel.model'; import { PanelStatusInfo, PanelType } from '../../models/panel.model';
import { ParticipantLeftEvent, ParticipantLeftReason, ParticipantModel } from '../../models/participant.model'; import { ParticipantLeftEvent, ParticipantLeftReason } from '../../models/participant.model';
import { import {
RecordingInfo, RecordingInfo,
RecordingStartRequestedEvent, RecordingStartRequestedEvent,
@ -449,6 +450,30 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
private templateManagerService: TemplateManagerService private templateManagerService: TemplateManagerService
) { ) {
this.log = this.loggerSrv.get('ToolbarComponent'); this.log = this.loggerSrv.get('ToolbarComponent');
// Effect to react to local participant changes
effect(() => {
const p = this.participantService.localParticipantSignal();
if (p) {
if (this.isCameraEnabled !== p.isCameraEnabled) {
this.onVideoEnabledChanged.emit(p.isCameraEnabled);
this.isCameraEnabled = p.isCameraEnabled;
this.storageSrv.setCameraEnabled(this.isCameraEnabled);
}
if (this.isMicrophoneEnabled !== p.isMicrophoneEnabled) {
this.onAudioEnabledChanged.emit(p.isMicrophoneEnabled);
this.isMicrophoneEnabled = p.isMicrophoneEnabled;
this.storageSrv.setMicrophoneEnabled(this.isMicrophoneEnabled);
}
if (this.isScreenShareEnabled !== p.isScreenShareEnabled) {
this.onScreenShareEnabledChanged.emit(p.isScreenShareEnabled);
this.isScreenShareEnabled = p.isScreenShareEnabled;
}
this.cd.markForCheck();
}
});
} }
/** /**
@ -497,7 +522,6 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
this.setupTemplates(); this.setupTemplates();
this.subscribeToToolbarDirectives(); this.subscribeToToolbarDirectives();
this.subscribeToUserMediaProperties();
this.subscribeToReconnection(); this.subscribeToReconnection();
this.subscribeToMenuToggling(); this.subscribeToMenuToggling();
@ -811,29 +835,6 @@ export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
this.cd.markForCheck(); this.cd.markForCheck();
}); });
} }
private subscribeToUserMediaProperties() {
this.participantService.localParticipant$.pipe(takeUntil(this.destroy$)).subscribe((p: ParticipantModel | undefined) => {
if (p) {
if (this.isCameraEnabled !== p.isCameraEnabled) {
this.onVideoEnabledChanged.emit(p.isCameraEnabled);
this.isCameraEnabled = p.isCameraEnabled;
this.storageSrv.setCameraEnabled(this.isCameraEnabled);
}
if (this.isMicrophoneEnabled !== p.isMicrophoneEnabled) {
this.onAudioEnabledChanged.emit(p.isMicrophoneEnabled);
this.isMicrophoneEnabled = p.isMicrophoneEnabled;
this.storageSrv.setMicrophoneEnabled(this.isMicrophoneEnabled);
}
if (this.isScreenShareEnabled !== p.isScreenShareEnabled) {
this.onScreenShareEnabledChanged.emit(p.isScreenShareEnabled);
this.isScreenShareEnabled = p.isScreenShareEnabled;
}
this.cd.markForCheck();
}
});
}
private subscribeToRecordingStatus() { private subscribeToRecordingStatus() {
this.libService.recordingActivityReadOnly$.pipe(takeUntil(this.destroy$)).subscribe((readOnly: boolean) => { this.libService.recordingActivityReadOnly$.pipe(takeUntil(this.destroy$)).subscribe((readOnly: boolean) => {