mirror of https://github.com/OpenVidu/openvidu.git
ov-components: Add directive to control visibility of recording list and update related services and components
parent
fa664c97f1
commit
9bac0f6490
|
@ -144,6 +144,11 @@ export class RecordingActivityComponent implements OnInit, OnDestroy {
|
|||
*/
|
||||
showViewRecordingsButton: boolean = false;
|
||||
|
||||
/**
|
||||
* @internal
|
||||
*/
|
||||
showRecordingList: boolean = true; // Controls visibility of the recording list in the panel
|
||||
|
||||
/**
|
||||
* @internal
|
||||
*/
|
||||
|
@ -370,13 +375,22 @@ export class RecordingActivityComponent implements OnInit, OnDestroy {
|
|||
this.showViewRecordingsButton = show;
|
||||
this.cd.markForCheck();
|
||||
});
|
||||
|
||||
this.libService.recordingActivityShowRecordingsList$.pipe(takeUntil(this.destroy$)).subscribe((show: boolean) => {
|
||||
this.showRecordingList = show;
|
||||
this.cd.markForCheck();
|
||||
});
|
||||
}
|
||||
|
||||
private subscribeToRecordingStatus() {
|
||||
this.recordingService.recordingStatusObs.pipe(takeUntil(this.destroy$)).subscribe((event: RecordingStatusInfo) => {
|
||||
const { status, recordingList, error } = event;
|
||||
this.recordingStatus = status;
|
||||
if (this.showRecordingList) {
|
||||
this.recordingList = recordingList;
|
||||
} else {
|
||||
this.recordingList = recordingList.filter((rec) => rec.status === RecordingStatus.STARTED);
|
||||
}
|
||||
this.recordingError = error;
|
||||
this.recordingAlive = this.recordingStatus === RecordingStatus.STARTED;
|
||||
if (this.recordingStatus !== RecordingStatus.FAILED) {
|
||||
|
|
|
@ -499,7 +499,9 @@ export class SessionComponent implements OnInit, OnDestroy {
|
|||
case DataTopic.ROOM_STATUS:
|
||||
const { recordingList, isRecordingStarted, isBroadcastingStarted, broadcastingId } = event as RoomStatusData;
|
||||
|
||||
if (this.libService.showRecordingActivityRecordingsList()) {
|
||||
this.recordingService.setRecordingList(recordingList);
|
||||
}
|
||||
if (isRecordingStarted) {
|
||||
const recordingActive = recordingList.find((recording) => recording.status === RecordingStatus.STARTED);
|
||||
this.recordingService.setRecordingStarted(recordingActive);
|
||||
|
|
|
@ -15,7 +15,8 @@ import {
|
|||
RecordingActivityReadOnlyDirective,
|
||||
RecordingActivityShowControlsDirective,
|
||||
StartStopRecordingButtonsDirective,
|
||||
RecordingActivityViewRecordingsButtonDirective
|
||||
RecordingActivityViewRecordingsButtonDirective,
|
||||
RecordingActivityShowRecordingsListDirective
|
||||
} from './internals.directive';
|
||||
import { ParticipantPanelItemMuteButtonDirective } from './participant-panel-item.directive';
|
||||
import {
|
||||
|
@ -107,7 +108,8 @@ const directives = [
|
|||
AdminDashboardTitleDirective,
|
||||
LayoutRemoteParticipantsDirective,
|
||||
StartStopRecordingButtonsDirective,
|
||||
RecordingActivityViewRecordingsButtonDirective
|
||||
RecordingActivityViewRecordingsButtonDirective,
|
||||
RecordingActivityShowRecordingsListDirective
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
|
|
|
@ -430,3 +430,49 @@ export class RecordingActivityViewRecordingsButtonDirective implements AfterView
|
|||
this.libService.setRecordingActivityViewRecordingsButton(value);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @internal
|
||||
* The **recordingActivityShowRecordingsList** directive allows to show or hide the recordings list in the recording activity panel.
|
||||
*
|
||||
* Default: `true`
|
||||
*
|
||||
* Can be used in {@link VideoconferenceComponent}.
|
||||
*
|
||||
* @example
|
||||
* <ov-videoconference [recordingActivityShowRecordingsList]="false"></ov-videoconference>
|
||||
*/
|
||||
@Directive({
|
||||
selector: 'ov-videoconference[recordingActivityShowRecordingsList]',
|
||||
standalone: false
|
||||
})
|
||||
export class RecordingActivityShowRecordingsListDirective implements AfterViewInit, OnDestroy {
|
||||
@Input() set recordingActivityShowRecordingsList(value: boolean) {
|
||||
this._value = value;
|
||||
this.update(this._value);
|
||||
}
|
||||
|
||||
private _value: boolean = true;
|
||||
|
||||
constructor(
|
||||
public elementRef: ElementRef,
|
||||
private libService: OpenViduComponentsConfigService
|
||||
) {}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.update(this._value);
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.clear();
|
||||
}
|
||||
|
||||
private clear() {
|
||||
this._value = true;
|
||||
this.update(this._value);
|
||||
}
|
||||
|
||||
private update(value: boolean) {
|
||||
this.libService.setRecordingActivityShowRecordingsList(value);
|
||||
}
|
||||
}
|
|
@ -118,6 +118,9 @@ export class OpenViduComponentsConfigService {
|
|||
|
||||
private recordingActivityViewRecordingsButton = <BehaviorSubject<boolean>>new BehaviorSubject(false);
|
||||
recordingActivityViewRecordingsButton$: Observable<boolean>;
|
||||
|
||||
private recordingActivityShowRecordingsList = <BehaviorSubject<boolean>>new BehaviorSubject(false);
|
||||
recordingActivityShowRecordingsList$: Observable<boolean>;
|
||||
// Admin
|
||||
private adminRecordingsList: BehaviorSubject<RecordingInfo[]> = new BehaviorSubject(<RecordingInfo[]>[]);
|
||||
adminRecordingsList$: Observable<RecordingInfo[]>;
|
||||
|
@ -174,6 +177,7 @@ export class OpenViduComponentsConfigService {
|
|||
this.recordingActivityShowControls$ = this.recordingActivityShowControls.asObservable();
|
||||
this.recordingActivityStartStopRecordingButton$ = this.recordingActivityStartStopRecordingButton.asObservable();
|
||||
this.recordingActivityViewRecordingsButton$ = this.recordingActivityViewRecordingsButton.asObservable();
|
||||
this.recordingActivityShowRecordingsList$ = this.recordingActivityShowRecordingsList.asObservable();
|
||||
// Broadcasting activity
|
||||
this.broadcastingActivity$ = this.broadcastingActivity.asObservable();
|
||||
// Admin dashboard
|
||||
|
@ -525,4 +529,12 @@ export class OpenViduComponentsConfigService {
|
|||
setRecordingActivityViewRecordingsButton(show: boolean) {
|
||||
this.recordingActivityViewRecordingsButton.next(show);
|
||||
}
|
||||
|
||||
setRecordingActivityShowRecordingsList(show: boolean) {
|
||||
this.recordingActivityShowRecordingsList.next(show);
|
||||
}
|
||||
|
||||
showRecordingActivityRecordingsList(): boolean {
|
||||
return this.recordingActivityShowRecordingsList.getValue();
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue