neoris/openvidu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

frontend: add share button and dialog for recording sharing functionality

Browse Source
This commit is contained in:
juancarmore 2025-06-14 13:55:48 +02:00
parent 8959d4721e
commit fff7fb957c
4 changed files with 32 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.html
View File

@ -51,6 +51,14 @@
<mat-icon id="delete" aria-label="Delete" title="Delete">delete</mat-icon> <mat-icon id="delete" aria-label="Delete" title="Delete">delete</mat-icon>
</button> </button>
} }
<button
mat-icon-button
aria-label="Share"
title="Share"
(click)="openShareDialog(recording)"
>
<mat-icon id="share">share</mat-icon>
</button>
</div> </div>
</div> </div>
<div class="video-info-container"> <div class="video-info-container">

3
frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.scss
View File

@ -90,6 +90,9 @@
.video-btns button #delete { .video-btns button #delete {
color: var(--ov-error-color); color: var(--ov-error-color);
} }
.video-btns button #share {
color: var(--ov-text-primary-color);
}
.video-info-container > div { .video-info-container > div {
width: 100%; width: 100%;

12
frontend/projects/shared-meet-components/src/lib/pages/room-recordings/room-recordings.component.ts
View File

@ -2,9 +2,11 @@ import { CommonModule, DatePipe, DecimalPipe } from '@angular/common';
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { MatButtonModule } from '@angular/material/button'; import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card'; import { MatCardModule } from '@angular/material/card';
import { MatDialog } from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon'; import { MatIconModule } from '@angular/material/icon';
import { MatToolbarModule } from '@angular/material/toolbar'; import { MatToolbarModule } from '@angular/material/toolbar';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { ShareRecordingDialogComponent } from '@lib/components';
import { ContextService, HttpService } from '@lib/services'; import { ContextService, HttpService } from '@lib/services';
import { import {
ActionService, ActionService,
@ -40,7 +42,8 @@ export class RoomRecordingsComponent implements OnInit {
protected contextService: ContextService, protected contextService: ContextService,
protected httpService: HttpService, protected httpService: HttpService,
protected actionService: ActionService, protected actionService: ActionService,
protected route: ActivatedRoute protected route: ActivatedRoute,
protected dialog: MatDialog
) {} ) {}
async ngOnInit() { async ngOnInit() {
@ -102,6 +105,13 @@ export class RoomRecordingsComponent implements OnInit {
} }
} }
openShareDialog(recording: MeetRecordingInfo) {
this.dialog.open(ShareRecordingDialogComponent, {
width: '400px',
data: { recordingId: recording.recordingId }
});
}
private async loadRecordings() { private async loadRecordings() {
try { try {
const recordingFilters: MeetRecordingFilters = { const recordingFilters: MeetRecordingFilters = {

12
frontend/projects/shared-meet-components/src/lib/services/http/http.service.ts
View File

@ -149,8 +149,16 @@ export class HttpService {
return this.getRequest<MeetRecordingInfo>(path); return this.getRequest<MeetRecordingInfo>(path);
} }
getRecordingMediaUrl(recordingId: string): string { getRecordingMediaUrl(recordingId: string, secret?: string): string {
return `${this.API_PATH_PREFIX}/recordings/${recordingId}/media`; let path = `${this.API_PATH_PREFIX}/recordings/${recordingId}/media`;
if (secret) {
path += `?secret=${secret}`;
}
return path;
}
generateRecordingUrl(recordingId: string, privateAccess: boolean): Promise<{ url: string }> {
return this.getRequest(`${this.API_PATH_PREFIX}/recordings/${recordingId}/url?privateAccess=${privateAccess}`);
} }
startRecording(roomId: string): Promise<MeetRecordingInfo> { startRecording(roomId: string): Promise<MeetRecordingInfo> {