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

frontend: enhance share link component

Browse Source
This commit is contained in:
Carlos Santos 2025-09-08 12:26:57 +02:00
parent ab04935d2b
commit ef31b9bada
3 changed files with 36 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/projects/shared-meet-components/src/lib/pages/meeting/meeting.component.html
View File

@ -89,8 +89,9 @@
<ng-container *ovLayoutAdditionalElements>
@if (features().canModerateRoom && remoteParticipants.length === 0) {
<div class="main-share-meeting-link-container fade-in-delayed-more">
<div class="main-share-meeting-link-container fade-in-delayed-more OV_big">
<ov-share-meeting-link
class="main-share-meeting-link"
[title]="'Start collaborating'"
[subtitle]="'Share this link to bring others into the meeting'"
[titleSize]="'xl'"

4
frontend/projects/shared-meet-components/src/lib/pages/meeting/meeting.component.scss
View File

@ -250,6 +250,10 @@
align-items: center;
justify-content: center;
border-radius: var(--ov-meet-radius-md);
.main-share-meeting-link {
max-width: 100%;
}
}
// Responsive adjustments

40
frontend/projects/shared-meet-components/src/lib/pages/meeting/meeting.component.ts
View File

@ -55,9 +55,10 @@ import {
RecordingStopRequestedEvent,
RemoteParticipant,
Room,
RoomEvent
RoomEvent,
Track
} from 'openvidu-components-angular';
import { Subject, takeUntil } from 'rxjs';
import { combineLatest, Subject, takeUntil } from 'rxjs';
@Component({
selector: 'app-meeting',
@ -273,22 +274,41 @@ export class MeetingComponent implements OnInit {
await this.roomService.loadRoomConfig(this.roomId);
this.showMeeting = true;
// Subscribe to remote participants updates
this.componentParticipantService.remoteParticipants$
.pipe(takeUntil(this.destroy$))
.subscribe((participants) => {
this.remoteParticipants = participants as CustomParticipantModel[];
});
combineLatest([
this.componentParticipantService.remoteParticipants$,
this.componentParticipantService.localParticipant$
])
.pipe(takeUntil(this.destroy$))
.subscribe((participant) => {
this.localParticipant = participant as CustomParticipantModel;
.subscribe(([participants, local]) => {
this.remoteParticipants = participants as CustomParticipantModel[];
this.localParticipant = local as CustomParticipantModel;
this.updateVideoPinState();
});
} catch (error) {
console.error('Error accessing meeting:', error);
}
}
/**
* Centralized logic for managing video pinning based on
* remote participants and local screen sharing state.
*/
private updateVideoPinState(): void {
if (!this.localParticipant) return;
const hasRemote = this.remoteParticipants.length > 0;
const isSharing = this.localParticipant.isScreenShareEnabled;
if (hasRemote && isSharing) {
// Pin the local screen share to appear bigger
this.localParticipant.setVideoPinnedBySource(Track.Source.ScreenShare, true);
} else {
// Unpin everything if no remote participants or not sharing
this.localParticipant.setAllVideoPinned(false);
}
}
/**
* Generates a participant token for joining a meeting.
*