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

openvidu-components: Elevate an event on device muting

pull/748/head
Carlos Santos 2022-10-14 13:37:51 +02:00
parent 3d0370017a
commit fd99fb27f9
5 changed files with 25 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
openvidu-components-angular/projects/openvidu-angular/src/lib/components/pre-join/pre-join.component.css
View File

@ -77,7 +77,7 @@ hr {
#background-effects-btn {
position: absolute;
z-index: 1;
z-index: 2;
background-color: var(--ov-secondary-color);
bottom: 5px;
right: 5px;

7
openvidu-components-angular/projects/openvidu-angular/src/lib/components/pre-join/pre-join.component.html
View File

@ -24,7 +24,7 @@
<ng-template #stream let-stream>
<button
*ngIf="!isMinimal && showBackgroundEffectsButton"
[disabled]="isVideoMuted"
[disabled]="!stream.streamManager?.stream?.videoActive"
matTooltip="{{ 'TOOLBAR.BACKGROUND' | translate }}"
mat-icon-button
id="background-effects-btn"
@ -52,7 +52,10 @@
<hr *ngIf="windowSize >= 960" />
<!-- Camera -->
<ov-video-devices-select (onDeviceSelectorClicked)="onDeviceSelectorClicked()"></ov-video-devices-select>
<ov-video-devices-select
(onDeviceSelectorClicked)="onDeviceSelectorClicked()"
(onVideoMutedClicked)="onVideoMutedClicked($event)"
></ov-video-devices-select>
<!-- Microphone -->
<ov-audio-devices-select (onDeviceSelectorClicked)="onDeviceSelectorClicked()"></ov-audio-devices-select>

19
openvidu-components-angular/projects/openvidu-angular/src/lib/components/pre-join/pre-join.component.ts
View File

@ -1,7 +1,6 @@
import { Component, HostListener, OnDestroy, OnInit, Output, EventEmitter } from '@angular/core';
import { Component, EventEmitter, HostListener, OnDestroy, OnInit, Output } from '@angular/core';
import { Subscription } from 'rxjs';
import { CustomDevice } from '../../models/device.model';
import { ILogger } from '../../models/logger.model';
import { PanelType } from '../../models/panel.model';
import { ParticipantAbstractModel } from '../../models/participant.model';
@ -22,17 +21,9 @@ import { ParticipantService } from '../../services/participant/participant.servi
})
export class PreJoinComponent implements OnInit, OnDestroy {
@Output() onJoinButtonClicked = new EventEmitter<any>();
cameras: CustomDevice[];
microphones: CustomDevice[];
cameraSelected: CustomDevice;
microphoneSelected: CustomDevice;
isVideoMuted: boolean;
isAudioMuted: boolean;
videoMuteChanging: boolean;
localParticipant: ParticipantAbstractModel;
windowSize: number;
hasVideoDevices: boolean;
hasAudioDevices: boolean;
isLoading = true;
nickname: string;
/**
@ -92,6 +83,12 @@ export class PreJoinComponent implements OnInit, OnDestroy {
this.cdkSrv.setSelector('#prejoin-container');
}
onVideoMutedClicked(hasVideo: boolean) {
if (!hasVideo) {
this.panelService.closePanel();
}
}
joinSession() {
this.onJoinButtonClicked.emit();
this.panelService.closePanel();

14
openvidu-components-angular/projects/openvidu-angular/src/lib/components/settings/audio-devices/audio-devices.component.ts
View File

@ -1,13 +1,13 @@
import { EventEmitter, Component, OnDestroy, OnInit, Output } from '@angular/core';
import { Component, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core';
import { PublisherProperties } from 'openvidu-browser';
import { DeviceService } from '../../../services/device/device.service';
import { OpenViduService } from '../../../services/openvidu/openvidu.service';
import { StorageService } from '../../../services/storage/storage.service';
import { Subscription } from 'rxjs';
import { CustomDevice } from '../../../models/device.model';
import { ParticipantAbstractModel } from '../../../models/participant.model';
import { ParticipantService } from '../../../services/participant/participant.service';
import { Subscription } from 'rxjs';
import { VideoType } from '../../../models/video-type.model';
import { DeviceService } from '../../../services/device/device.service';
import { OpenViduService } from '../../../services/openvidu/openvidu.service';
import { ParticipantService } from '../../../services/participant/participant.service';
import { StorageService } from '../../../services/storage/storage.service';
/**
* @internal
@ -19,6 +19,7 @@ import { VideoType } from '../../../models/video-type.model';
})
export class AudioDevicesComponent implements OnInit, OnDestroy {
@Output() onDeviceSelectorClicked = new EventEmitter<void>();
@Output() onAudioMutedClicked = new EventEmitter<boolean>();
hasAudioDevices: boolean;
isAudioMuted: boolean;
microphoneSelected: CustomDevice;
@ -56,6 +57,7 @@ export class AudioDevicesComponent implements OnInit, OnDestroy {
toggleMic() {
const publish = this.isAudioMuted;
this.openviduService.publishAudio(publish);
this.onAudioMutedClicked.emit(publish);
}
async onMicrophoneSelected(event: any) {

4
openvidu-components-angular/projects/openvidu-angular/src/lib/components/settings/video-devices/video-devices.component.ts
View File

@ -1,4 +1,4 @@
import { Component, OnInit, OnDestroy, Output, EventEmitter } from '@angular/core';
import { Component, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core';
import { PublisherProperties } from 'openvidu-browser';
import { Subscription } from 'rxjs';
import { CustomDevice } from '../../../models/device.model';
@ -22,6 +22,7 @@ import { VirtualBackgroundService } from '../../../services/virtual-background/v
})
export class VideoDevicesComponent implements OnInit, OnDestroy {
@Output() onDeviceSelectorClicked = new EventEmitter<void>();
@Output() onVideoMutedClicked = new EventEmitter<boolean>();
videoMuteChanging: boolean;
isVideoMuted: boolean;
@ -68,6 +69,7 @@ export class VideoDevicesComponent implements OnInit, OnDestroy {
this.panelService.togglePanel(PanelType.BACKGROUND_EFFECTS);
}
this.videoMuteChanging = false;
this.onVideoMutedClicked.emit(publish);
}
async onCameraSelected(event: any) {