mirror of https://github.com/OpenVidu/openvidu.git
openvidu-components-angular: manage some incompatible VB situations
parent
7832f5a75f
commit
279da4eeaf
|
@ -6,22 +6,22 @@ import { PanelService } from '../../../services/panel/panel.service';
|
|||
import { VirtualBackgroundService } from '../../../services/virtual-background/virtual-background.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ov-background-effects-panel',
|
||||
templateUrl: './background-effects-panel.component.html',
|
||||
styleUrls: ['./background-effects-panel.component.css'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush
|
||||
selector: 'ov-background-effects-panel',
|
||||
templateUrl: './background-effects-panel.component.html',
|
||||
styleUrls: ['./background-effects-panel.component.css'],
|
||||
changeDetection: ChangeDetectionStrategy.OnPush
|
||||
})
|
||||
export class BackgroundEffectsPanelComponent implements OnInit {
|
||||
|
||||
backgroundSelectedId: string;
|
||||
backgroundImages: BackgroundEffect[] = [];
|
||||
backgroundImages: BackgroundEffect[] = [];
|
||||
noEffectAndBlurredBackground: BackgroundEffect[] = [];
|
||||
private backgrounds: BackgroundEffect[];
|
||||
private backgroundSubs: Subscription;
|
||||
|
||||
constructor(private panelService: PanelService, private backgroundService: VirtualBackgroundService, private cd: ChangeDetectorRef) {}
|
||||
constructor(private panelService: PanelService, private backgroundService: VirtualBackgroundService, private cd: ChangeDetectorRef) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
ngOnInit(): void {
|
||||
this.subscribeToBackgroundSelected();
|
||||
this.backgrounds = this.backgroundService.getBackgrounds();
|
||||
this.noEffectAndBlurredBackground = this.backgrounds.filter(f => f.type === EffectType.BLUR || f.type === EffectType.NONE);
|
||||
|
@ -29,7 +29,7 @@ export class BackgroundEffectsPanelComponent implements OnInit {
|
|||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
if(this.backgroundSubs) this.backgroundSubs.unsubscribe();
|
||||
if (this.backgroundSubs) this.backgroundSubs.unsubscribe();
|
||||
}
|
||||
subscribeToBackgroundSelected() {
|
||||
this.backgroundSubs = this.backgroundService.backgroundSelectedObs.subscribe((id) => {
|
||||
|
@ -38,18 +38,16 @@ export class BackgroundEffectsPanelComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
close() {
|
||||
this.panelService.togglePanel(PanelType.BACKGROUND_EFFECTS);
|
||||
}
|
||||
close() {
|
||||
this.panelService.togglePanel(PanelType.BACKGROUND_EFFECTS);
|
||||
}
|
||||
|
||||
async applyBackground(effect: BackgroundEffect) {
|
||||
|
||||
if(effect.type === EffectType.NONE){
|
||||
if (effect.type === EffectType.NONE) {
|
||||
await this.removeBackground();
|
||||
} else {
|
||||
await this.backgroundService.applyBackground(effect);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
async removeBackground() {
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
<ov-layout>
|
||||
<ng-template #stream let-stream>
|
||||
<button
|
||||
*ngIf="!isMinimal && showBackgroundEffectsButton"
|
||||
*ngIf="!isMinimal && !isVideoMuted && showBackgroundEffectsButton"
|
||||
mat-icon-button
|
||||
id="background-effects-btn"
|
||||
(click)="toggleBackgroundEffects()"
|
||||
|
|
|
@ -122,8 +122,16 @@ export class PreJoinComponent implements OnInit, OnDestroy {
|
|||
// TODO: Remove this when replaceTrack issue is fixed
|
||||
const pp: PublisherProperties = { videoSource, audioSource: this.microphoneSelected.device, mirror };
|
||||
|
||||
await this.backgroundService.removeBackground();
|
||||
// Reapply Virtual Background to new Publisher if necessary
|
||||
const backgroundSelected = this.backgroundService.backgroundSelected.getValue();
|
||||
const backgroundWasApplied = !!backgroundSelected && backgroundSelected !== 'no_effect';
|
||||
if (backgroundWasApplied) {
|
||||
await this.backgroundService.removeBackground();
|
||||
}
|
||||
await this.openviduService.republishTrack(pp);
|
||||
if (backgroundWasApplied) {
|
||||
await this.backgroundService.applyBackground(this.backgroundService.backgrounds.find(b => b.id === backgroundSelected));
|
||||
}
|
||||
|
||||
this.deviceSrv.setCameraSelected(videoSource);
|
||||
this.cameraSelected = this.deviceSrv.getCameraSelected();
|
||||
|
@ -152,6 +160,9 @@ export class PreJoinComponent implements OnInit, OnDestroy {
|
|||
await this.openviduService.publishVideo(publish);
|
||||
this.isVideoMuted = !this.isVideoMuted;
|
||||
this.storageSrv.setVideoMuted(this.isVideoMuted);
|
||||
if (this.isVideoMuted && this.panelService.isExternalPanelOpened()) {
|
||||
this.panelService.togglePanel(PanelType.BACKGROUND_EFFECTS);
|
||||
}
|
||||
this.videoMuteChanging = false;
|
||||
}
|
||||
|
||||
|
|
|
@ -88,7 +88,7 @@ export class PanelService {
|
|||
return this.isParticipantsOpened;
|
||||
}
|
||||
|
||||
private isExternalPanelOpened(): boolean {
|
||||
isExternalPanelOpened(): boolean {
|
||||
return this.isExternalOpened;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue