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

feat: convert components, directives, and pipes to standalone 

- Updated LangSelectorComponent, ParticipantNameInputComponent, ThemeSelectorComponent, VideoDevicesComponent, StreamComponent, ToolbarMediaButtonsComponent, ToolbarPanelButtonsComponent, ToolbarComponent, VideoPosterComponent, VideoconferenceComponent to be standalone components.
- Converted directives (ActivitiesPanelRecordingActivityDirective, AdminDashboardRecordingsListDirective, etc.) to standalone.
- Updated pipes (LinkifyPipe, RemoteParticipantTracksPipe, DurationFromSecondsPipe, etc.) to standalone.
- Adjusted imports in OpenViduComponentsAngularUiModule to include necessary modules for standalone components.
ov-components_modernization
Carlos Santos 2025-12-11 15:00:42 +01:00
parent d9ebae88fa
commit 264db1facc
48 changed files with 334 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
openvidu-components-angular/projects/openvidu-components-angular/src/lib/admin/admin-dashboard/admin-dashboard.component.ts
View File

@ -1,4 +1,9 @@
import { Component, OnInit, Output, EventEmitter, OnDestroy } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { SearchByStringPropertyPipe } from '../../pipes/recording.pipe';
import { Subscription } from 'rxjs';
import { RecordingDeleteRequestedEvent, RecordingInfo, RecordingStatus } from '../../models/recording.model';
import { ActionService } from '../../services/action/action.service';
@ -9,7 +14,14 @@ import { RecordingService } from '../../services/recording/recording.service';
selector: 'ov-admin-dashboard',
templateUrl: './admin-dashboard.component.html',
styleUrls: ['./admin-dashboard.component.scss'],
standalone: false
standalone: true,
imports: [
CommonModule,
FormsModule,
AppMaterialModule,
TranslatePipe,
SearchByStringPropertyPipe
]
})
export class AdminDashboardComponent implements OnInit, OnDestroy {
/**

8
openvidu-components-angular/projects/openvidu-components-angular/src/lib/admin/admin-login/admin-login.component.ts
View File

@ -1,5 +1,8 @@
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { Validators, FormGroup, FormBuilder } from '@angular/forms';
import { CommonModule } from '@angular/common';
import { ReactiveFormsModule, Validators, FormGroup, FormBuilder } from '@angular/forms';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { Subscription } from 'rxjs';
import { ActionService } from '../../services/action/action.service';
import { OpenViduComponentsConfigService } from '../../services/config/directive-config.service';
@ -8,7 +11,8 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
selector: 'ov-admin-login',
templateUrl: './admin-login.component.html',
styleUrls: ['./admin-login.component.scss'],
standalone: false
standalone: true,
imports: [CommonModule, ReactiveFormsModule, AppMaterialModule, TranslatePipe]
})
export class AdminLoginComponent implements OnInit {
/**

2
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/audio-wave/audio-wave.component.ts
View File

@ -13,6 +13,6 @@ import { Component } from '@angular/core';
</div>
`,
styleUrls: ['./audio-wave.component.scss'],
standalone: false
standalone: true
})
export class AudioWaveComponent {}

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/dialogs/delete-recording.component.ts
View File

@ -1,4 +1,7 @@
import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { MatDialogRef } from '@angular/material/dialog';
/**
@ -37,7 +40,8 @@ import { MatDialogRef } from '@angular/material/dialog';
}
`
],
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class DeleteDialogComponent {
constructor(public dialogRef: MatDialogRef<DeleteDialogComponent>) {}

5
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/dialogs/dialog.component.ts
View File

@ -1,4 +1,7 @@
import { Component, Inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { DialogData } from '../../models/dialog.model';
@ -34,7 +37,7 @@ import { DialogData } from '../../models/dialog.model';
}
`
],
standalone: false
standalone: true
})
export class DialogTemplateComponent {
constructor(

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/dialogs/pro-feature-dialog.component.ts
View File

@ -1,4 +1,7 @@
import { Component, Inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { DialogData } from '../../models/dialog.model';
@ -20,7 +23,8 @@ import { DialogData } from '../../models/dialog.model';
<button mat-button (click)="close()">{{'PANEL.CLOSE' | translate}}</button>
</div>
`,
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class ProFeatureDialogTemplateComponent {
constructor(public dialogRef: MatDialogRef<ProFeatureDialogTemplateComponent>, @Inject(MAT_DIALOG_DATA) public data: DialogData) {}

8
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/dialogs/recording-dialog.component.ts
View File

@ -1,4 +1,7 @@
import { Component, ElementRef, Inject, ViewChild } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { RecordingDialogData } from '../../models/dialog.model';
@ -39,10 +42,11 @@ import { RecordingDialogData } from '../../models/dialog.model';
}
`
],
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class RecordingDialogComponent {
@ViewChild('videoElement', { static: true }) videoElement: ElementRef<HTMLVideoElement>;
@ViewChild('videoElement', { static: true }) videoElement!: ElementRef<HTMLVideoElement>;
src: string;

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/landscape-warning/landscape-warning.component.ts
View File

@ -1,5 +1,8 @@
import { animate, style, transition, trigger } from '@angular/animations';
import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
/**
* Component to display a landscape orientation warning on mobile devices.
@ -9,7 +12,8 @@ import { Component } from '@angular/core';
selector: 'ov-landscape-warning',
templateUrl: './landscape-warning.component.html',
styleUrl: './landscape-warning.component.scss',
standalone: false,
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe],
animations: [
trigger('inOutAnimation', [
transition(':enter', [style({ opacity: 0 }), animate('200ms', style({ opacity: 1 }))]),

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/layout/layout.component.ts
View File

@ -13,6 +13,9 @@ import {
ViewChild,
ViewContainerRef
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { RemoteParticipantTracksPipe } from '../../pipes/participant.pipe';
import { combineLatest, map, Subject, takeUntil } from 'rxjs';
import { StreamDirective } from '../../directives/template/openvidu-components-angular.directive';
import { ParticipantTrackPublication, ParticipantModel } from '../../models/participant.model';
@ -34,7 +37,8 @@ import { LayoutTemplateConfiguration, TemplateManagerService } from '../../servi
templateUrl: './layout.component.html',
styleUrls: ['./layout.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, DragDropModule, RemoteParticipantTracksPipe]
})
export class LayoutComponent implements OnInit, OnDestroy, AfterViewInit {
/**

5
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/media-element/media-element.component.ts
View File

@ -1,5 +1,7 @@
import { animate, style, transition, trigger } from '@angular/animations';
import { AfterViewInit, Component, ElementRef, Input, OnDestroy, ViewChild } from '@angular/core';
import { CommonModule } from '@angular/common';
import { VideoPosterComponent } from '../video-poster/video-poster.component';
import { Track } from 'livekit-client';
/**
@ -25,7 +27,8 @@ import { Track } from 'livekit-client';
transition(':leave', [style({ opacity: 1 }), animate('200ms', style({ opacity: 0 }))])
])
],
standalone: false
standalone: true,
imports: [CommonModule, VideoPosterComponent]
})
export class MediaElementComponent implements AfterViewInit, OnDestroy {
_track: Track;

8
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/activities-panel.component.ts
View File

@ -1,4 +1,9 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, OnInit, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { RecordingActivityComponent } from './recording-activity/recording-activity.component';
import { BroadcastingActivityComponent } from './broadcasting-activity/broadcasting-activity.component';
import { Subject, takeUntil } from 'rxjs';
import { PanelStatusInfo, PanelType } from '../../../models/panel.model';
import { OpenViduComponentsConfigService } from '../../../services/config/directive-config.service';
@ -21,7 +26,8 @@ import { BroadcastingStartRequestedEvent, BroadcastingStopRequestedEvent } from
templateUrl: './activities-panel.component.html',
styleUrls: ['../panel.component.scss', './activities-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe, RecordingActivityComponent, BroadcastingActivityComponent]
})
export class ActivitiesPanelComponent implements OnInit {
/**

7
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/broadcasting-activity/broadcasting-activity.component.ts
View File

@ -1,4 +1,8 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppMaterialModule } from '../../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../../pipes/translate.pipe';
import { Subject, takeUntil } from 'rxjs';
import {
BroadcastingStartRequestedEvent,
@ -19,7 +23,8 @@ import { OpenViduService } from '../../../../services/openvidu/openvidu.service'
templateUrl: './broadcasting-activity.component.html',
styleUrls: ['./broadcasting-activity.component.scss', '../activities-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, FormsModule, AppMaterialModule, TranslatePipe]
})
// TODO: Allow to add more than one broadcast url

12
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.ts
View File

@ -1,4 +1,8 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, OnDestroy, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppMaterialModule } from '../../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../../pipes/translate.pipe';
import { Subject, takeUntil } from 'rxjs';
import {
RecordingDeleteRequestedEvent,
@ -26,7 +30,13 @@ import { OpenViduComponentsConfigService } from '../../../../services/config/dir
templateUrl: './recording-activity.component.html',
styleUrls: ['./recording-activity.component.scss', '../activities-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [
CommonModule,
FormsModule,
AppMaterialModule,
TranslatePipe
]
})
// TODO: Allow to add more than one recording type

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/background-effects-panel/background-effects-panel.component.ts
View File

@ -1,4 +1,7 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { Subscription } from 'rxjs';
import { BackgroundEffect, EffectType } from '../../../models/background-effect.model';
import { PanelType } from '../../../models/panel.model';
@ -13,7 +16,8 @@ import { VirtualBackgroundService } from '../../../services/virtual-background/v
templateUrl: './background-effects-panel.component.html',
styleUrls: ['../panel.component.scss', './background-effects-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class BackgroundEffectsPanelComponent implements OnInit {
@Input() mode: 'prejoin' | 'meeting' = 'meeting';

8
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts
View File

@ -1,4 +1,9 @@
import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { LinkifyPipe } from '../../../pipes/linkify.pipe';
import { Subject, takeUntil } from 'rxjs';
import { ChatMessage } from '../../../models/chat.model';
import { PanelType } from '../../../models/panel.model';
@ -14,7 +19,8 @@ import { PanelService } from '../../../services/panel/panel.service';
templateUrl: './chat-panel.component.html',
styleUrls: ['../panel.component.scss', './chat-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, FormsModule, AppMaterialModule, TranslatePipe, LinkifyPipe]
})
export class ChatPanelComponent implements OnInit, AfterViewInit {
/**

4
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/panel.component.ts
View File

@ -8,6 +8,7 @@ import {
Output,
TemplateRef
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { skip, Subject, takeUntil } from 'rxjs';
import {
ActivitiesPanelDirective,
@ -39,7 +40,8 @@ import { TemplateManagerService, PanelTemplateConfiguration } from '../../servic
templateUrl: './panel.component.html',
styleUrls: ['./panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule]
})
export class PanelComponent implements OnInit {
/**

7
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/participants-panel/participant-panel-item/participant-panel-item.component.ts
View File

@ -1,4 +1,8 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, Input, OnDestroy, OnInit, TemplateRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../../pipes/translate.pipe';
import { TrackPublishedTypesPipe } from '../../../../pipes/participant.pipe';
import { Subscription } from 'rxjs';
import { ParticipantPanelItemElementsDirective } from '../../../../directives/template/openvidu-components-angular.directive';
import { ParticipantPanelParticipantBadgeDirective } from '../../../../directives/template/internals.directive';
@ -17,7 +21,8 @@ import { TemplateManagerService, ParticipantPanelItemTemplateConfiguration } fro
templateUrl: './participant-panel-item.component.html',
styleUrls: ['./participant-panel-item.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe, TrackPublishedTypesPipe]
})
export class ParticipantPanelItemComponent implements OnInit, OnDestroy {
/**

7
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/participants-panel/participants-panel/participants-panel.component.ts
View File

@ -9,6 +9,10 @@ import {
TemplateRef,
ViewChild
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../../pipes/translate.pipe';
import { ParticipantPanelItemComponent } from '../participant-panel-item/participant-panel-item.component';
// import { ParticipantModel } from '../../../../models/participant.model';
import { ParticipantService } from '../../../../services/participant/participant.service';
import { PanelService } from '../../../../services/panel/panel.service';
@ -28,7 +32,8 @@ import { OpenViduComponentsConfigService } from '../../../../services/config/dir
templateUrl: './participants-panel.component.html',
styleUrls: ['../../panel.component.scss', './participants-panel.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe, ParticipantPanelItemComponent]
})
export class ParticipantsPanelComponent implements OnInit, OnDestroy, AfterViewInit {
/**

20
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/settings-panel/settings-panel.component.ts
View File

@ -1,4 +1,12 @@
import { Component, ContentChild, EventEmitter, OnInit, Output, TemplateRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { ParticipantNameInputComponent } from '../../settings/participant-name-input/participant-name-input.component';
import { LangSelectorComponent } from '../../settings/lang-selector/lang-selector.component';
import { ThemeSelectorComponent } from '../../settings/theme-selector/theme-selector.component';
import { VideoDevicesComponent } from '../../settings/video-devices/video-devices.component';
import { AudioDevicesComponent } from '../../settings/audio-devices/audio-devices.component';
import { Subject, takeUntil } from 'rxjs';
import { PanelStatusInfo, PanelSettingsOptions, PanelType } from '../../../models/panel.model';
import { OpenViduComponentsConfigService } from '../../../services/config/directive-config.service';
@ -16,7 +24,17 @@ import { SettingsPanelGeneralAdditionalElementsDirective } from '../../../direct
selector: 'ov-settings-panel',
templateUrl: './settings-panel.component.html',
styleUrls: ['../panel.component.scss', './settings-panel.component.scss'],
standalone: false
standalone: true,
imports: [
CommonModule,
AppMaterialModule,
TranslatePipe,
ParticipantNameInputComponent,
LangSelectorComponent,
ThemeSelectorComponent,
VideoDevicesComponent,
AudioDevicesComponent
]
})
export class SettingsPanelComponent implements OnInit {
@Output() onVideoEnabledChanged = new EventEmitter<boolean>();

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

@ -9,6 +9,16 @@ import {
OnInit,
Output
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { LandscapeWarningComponent } from '../landscape-warning/landscape-warning.component';
import { LangSelectorComponent } from '../settings/lang-selector/lang-selector.component';
import { MediaElementComponent } from '../media-element/media-element.component';
import { VideoDevicesComponent } from '../settings/video-devices/video-devices.component';
import { AudioDevicesComponent } from '../settings/audio-devices/audio-devices.component';
import { ParticipantNameInputComponent } from '../settings/participant-name-input/participant-name-input.component';
import { BackgroundEffectsPanelComponent } from '../panel/background-effects-panel/background-effects-panel.component';
import { animate, state, style, transition, trigger } from '@angular/animations';
import { filter, Subject, take, takeUntil } from 'rxjs';
import { ILogger } from '../../models/logger.model';
@ -30,7 +40,19 @@ import { LangOption } from '../../models/lang.model';
templateUrl: './pre-join.component.html',
styleUrls: ['./pre-join.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false,
standalone: true,
imports: [
CommonModule,
AppMaterialModule,
TranslatePipe,
LandscapeWarningComponent,
LangSelectorComponent,
MediaElementComponent,
VideoDevicesComponent,
AudioDevicesComponent,
ParticipantNameInputComponent,
BackgroundEffectsPanelComponent
],
animations: [
trigger('containerResize', [
state(

7
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/session/session.component.ts
View File

@ -12,6 +12,10 @@ import {
TemplateRef,
ViewChild
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { LandscapeWarningComponent } from '../landscape-warning/landscape-warning.component';
import { ILogger } from '../../models/logger.model';
import { animate, style, transition, trigger } from '@angular/animations';
@ -68,7 +72,8 @@ import { safeJsonParse } from '../../utils/utils';
])
],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe, LandscapeWarningComponent]
})
export class SessionComponent implements OnInit, OnDestroy {
@ContentChild('toolbar', { read: TemplateRef }) toolbarTemplate: TemplateRef<any> | undefined;

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

@ -1,4 +1,7 @@
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { Subscription } from 'rxjs';
import { CustomDevice } from '../../../models/device.model';
import { DeviceService } from '../../../services/device/device.service';
@ -15,7 +18,8 @@ import { ILogger } from '../../../models/logger.model';
selector: 'ov-audio-devices-select',
templateUrl: './audio-devices.component.html',
styleUrls: ['./audio-devices.component.scss'],
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class AudioDevicesComponent implements OnInit, OnDestroy {
@Input() compact: boolean = false;

5
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/lang-selector/lang-selector.component.ts
View File

@ -1,4 +1,6 @@
import { Component, OnInit, Output, ViewChild, EventEmitter, Input, OnDestroy } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { MatMenuTrigger } from '@angular/material/menu';
import { MatSelect } from '@angular/material/select';
import { StorageService } from '../../../services/storage/storage.service';
@ -13,7 +15,8 @@ import { Subscription } from 'rxjs';
selector: 'ov-lang-selector',
templateUrl: './lang-selector.component.html',
styleUrls: ['./lang-selector.component.scss'],
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule]
})
export class LangSelectorComponent implements OnInit, OnDestroy {
/**

7
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/participant-name-input/participant-name-input.component.ts
View File

@ -1,4 +1,8 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { Subscription } from 'rxjs';
import { ParticipantService } from '../../../services/participant/participant.service';
import { StorageService } from '../../../services/storage/storage.service';
@ -10,7 +14,8 @@ import { StorageService } from '../../../services/storage/storage.service';
selector: 'ov-participant-name-input',
templateUrl: './participant-name-input.component.html',
styleUrls: ['./participant-name-input.component.scss'],
standalone: false
standalone: true,
imports: [CommonModule, FormsModule, AppMaterialModule, TranslatePipe]
})
export class ParticipantNameInputComponent implements OnInit {
name: string;

5
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/settings/theme-selector/theme-selector.component.ts
View File

@ -1,10 +1,13 @@
import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { OpenViduThemeService } from '../../../services/theme/theme.service';
import { OpenViduThemeMode } from '../../../models/theme.model';
@Component({
selector: 'ov-theme-selector',
standalone: false,
standalone: true,
imports: [CommonModule, AppMaterialModule],
template: `
<div class="theme-selector-container">
<button

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

@ -1,4 +1,7 @@
import { Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { Subscription } from 'rxjs';
import { CustomDevice } from '../../../models/device.model';
import { DeviceService } from '../../../services/device/device.service';
@ -15,7 +18,8 @@ import { ILogger } from '../../../models/logger.model';
selector: 'ov-video-devices-select',
templateUrl: './video-devices.component.html',
styleUrls: ['./video-devices.component.scss'],
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class VideoDevicesComponent implements OnInit, OnDestroy {
@Input() compact: boolean = false;

7
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/stream/stream.component.ts
View File

@ -1,4 +1,8 @@
import { Component, ElementRef, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { AudioWaveComponent } from '../audio-wave/audio-wave.component';
import { MediaElementComponent } from '../media-element/media-element.component';
import { MatMenuPanel, MatMenuTrigger } from '@angular/material/menu';
import { Track } from 'livekit-client';
import { Subject, takeUntil } from 'rxjs';
@ -16,7 +20,8 @@ import { ParticipantService } from '../../services/participant/participant.servi
selector: 'ov-stream',
templateUrl: './stream.component.html',
styleUrls: ['./stream.component.scss'],
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, AudioWaveComponent, MediaElementComponent]
})
export class StreamComponent implements OnInit, OnDestroy {
/**

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar-media-buttons/toolbar-media-buttons.component.ts
View File

@ -1,4 +1,7 @@
import { Component, ContentChild, EventEmitter, Input, Output, TemplateRef, computed, inject } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { RecordingStatus } from '../../../models/recording.model';
import { BroadcastingStatus } from '../../../models/broadcasting.model';
import { ToolbarAdditionalButtonsPosition } from '../../../models/toolbar.model';
@ -12,7 +15,8 @@ import { ToolbarMoreOptionsAdditionalMenuItemsDirective } from '../../../directi
selector: 'ov-toolbar-media-buttons',
templateUrl: './toolbar-media-buttons.component.html',
styleUrl: './toolbar-media-buttons.component.scss',
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class ToolbarMediaButtonsComponent {
// Camera related inputs

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar-panel-buttons/toolbar-panel-buttons.component.ts
View File

@ -1,11 +1,15 @@
import { Component, EventEmitter, Input, Output, TemplateRef } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../../pipes/translate.pipe';
import { ViewportService } from '../../../services/viewport/viewport.service';
@Component({
selector: 'ov-toolbar-panel-buttons',
templateUrl: './toolbar-panel-buttons.component.html',
styleUrl: './toolbar-panel-buttons.component.scss',
standalone: false
standalone: true,
imports: [CommonModule, AppMaterialModule, TranslatePipe]
})
export class ToolbarPanelButtonsComponent {
// Inputs from toolbar

14
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar.component.ts
View File

@ -1,3 +1,8 @@
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { ApiDirectiveModule } from '../../directives/api/api.directive.module';
import { ToolbarMediaButtonsComponent } from './toolbar-media-buttons/toolbar-media-buttons.component';
import { ToolbarPanelButtonsComponent } from './toolbar-panel-buttons/toolbar-panel-buttons.component';
import {
AfterViewInit,
ChangeDetectionStrategy,
@ -61,7 +66,14 @@ import { LeaveButtonDirective, ToolbarMoreOptionsAdditionalMenuItemsDirective }
templateUrl: './toolbar.component.html',
styleUrls: ['./toolbar.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
standalone: false
standalone: true,
imports: [
CommonModule,
AppMaterialModule,
ApiDirectiveModule,
ToolbarMediaButtonsComponent,
ToolbarPanelButtonsComponent
]
})
export class ToolbarComponent implements OnInit, OnDestroy, AfterViewInit {
/**

5
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/video-poster/video-poster.component.ts
View File

@ -1,10 +1,13 @@
import { Component, Input } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TranslatePipe } from '../../pipes/translate.pipe';
@Component({
selector: 'ov-video-poster',
templateUrl: './video-poster.component.html',
styleUrl: './video-poster.component.scss',
standalone: false
standalone: true,
imports: [CommonModule, TranslatePipe]
})
export class VideoPosterComponent {
letter: string = '';

38
openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/videoconference/videoconference.component.ts
View File

@ -1,4 +1,21 @@
import { animate, style, transition, trigger } from '@angular/animations';
import { CommonModule } from '@angular/common';
import { AppMaterialModule } from '../../openvidu-components-angular.material.module';
import { TranslatePipe } from '../../pipes/translate.pipe';
import { PreJoinComponent } from '../pre-join/pre-join.component';
import { SessionComponent } from '../session/session.component';
import { ToolbarComponent } from '../toolbar/toolbar.component';
import { PanelComponent } from '../panel/panel.component';
import { ChatPanelComponent } from '../panel/chat-panel/chat-panel.component';
import { ParticipantsPanelComponent } from '../panel/participants-panel/participants-panel/participants-panel.component';
import { BackgroundEffectsPanelComponent } from '../panel/background-effects-panel/background-effects-panel.component';
import { SettingsPanelComponent } from '../panel/settings-panel/settings-panel.component';
import { ActivitiesPanelComponent } from '../panel/activities-panel/activities-panel.component';
import { ParticipantPanelItemComponent } from '../panel/participants-panel/participant-panel-item/participant-panel-item.component';
import { LayoutComponent } from '../layout/layout.component';
import { StreamComponent } from '../stream/stream.component';
import { ApiDirectiveModule } from '../../directives/api/api.directive.module';
import { OpenViduComponentsDirectiveModule } from '../../directives/template/openvidu-components-angular.directive.module';
import {
AfterViewInit,
ChangeDetectionStrategy,
@ -86,7 +103,26 @@ import { E2eeService } from '../../services/e2ee/e2ee.service';
// transition(':leave', [style({ opacity: 1 }), animate('50ms ease-in', style({ opacity: 0.9 }))])
])
],
standalone: false
standalone: true,
imports: [
CommonModule,
AppMaterialModule,
TranslatePipe,
PreJoinComponent,
SessionComponent,
ToolbarComponent,
PanelComponent,
ChatPanelComponent,
ParticipantsPanelComponent,
BackgroundEffectsPanelComponent,
SettingsPanelComponent,
ActivitiesPanelComponent,
ParticipantPanelItemComponent,
LayoutComponent,
StreamComponent,
ApiDirectiveModule,
OpenViduComponentsDirectiveModule
]
})
export class VideoconferenceComponent implements OnDestroy, AfterViewInit {
// Constants

4
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/activities-panel.directive.ts
View File

@ -18,7 +18,7 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
*/
@Directive({
selector: 'ov-videoconference[activitiesPanelRecordingActivity], ov-activities-panel[recordingActivity]',
standalone: false
standalone: true
})
export class ActivitiesPanelRecordingActivityDirective implements AfterViewInit, OnDestroy {
@Input() set activitiesPanelRecordingActivity(value: boolean) {
@ -70,7 +70,7 @@ export class ActivitiesPanelRecordingActivityDirective implements AfterViewInit,
*/
@Directive({
selector: 'ov-videoconference[activitiesPanelBroadcastingActivity], ov-activities-panel[broadcastingActivity]',
standalone: false
standalone: true
})
export class ActivitiesPanelBroadcastingActivityDirective implements AfterViewInit, OnDestroy {
@Input() set activitiesPanelBroadcastingActivity(value: boolean) {

8
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/admin.directive.ts
View File

@ -13,7 +13,7 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
*/
@Directive({
selector: 'ov-admin-dashboard[recordingsList]',
standalone: false
standalone: true
})
export class AdminDashboardRecordingsListDirective implements AfterViewInit, OnDestroy {
@Input() set recordingsList(value: RecordingInfo[]) {
@ -55,7 +55,7 @@ export class AdminDashboardRecordingsListDirective implements AfterViewInit, OnD
*/
@Directive({
selector: 'ov-admin-dashboard[navbarTitle]',
standalone: false
standalone: true
})
export class AdminDashboardTitleDirective implements AfterViewInit, OnDestroy {
@Input() set navbarTitle(value: string) {
@ -97,7 +97,7 @@ export class AdminDashboardTitleDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-admin-login[navbarTitle]',
standalone: false
standalone: true
})
export class AdminLoginTitleDirective implements AfterViewInit, OnDestroy {
@Input() set navbarTitle(value: any) {
@ -139,7 +139,7 @@ export class AdminLoginTitleDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-admin-login[error]',
standalone: false
standalone: true
})
export class AdminLoginErrorDirective implements AfterViewInit, OnDestroy {
@Input() set error(value: any) {

2
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/api.directive.module.ts
View File

@ -119,7 +119,7 @@ const directives = [
];
@NgModule({
declarations: [...directives],
imports: [...directives],
exports: [...directives]
})
export class ApiDirectiveModule {}

26
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/internals.directive.ts
View File

@ -10,7 +10,7 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
*/
@Directive({
selector: 'img[ovLogo]',
standalone: false
standalone: true
})
export class FallbackLogoDirective implements OnInit {
defaultLogo =
@ -55,7 +55,7 @@ export class FallbackLogoDirective implements OnInit {
*/
@Directive({
selector: 'ov-layout[ovRemoteParticipants]',
standalone: false
standalone: true
})
export class LayoutRemoteParticipantsDirective {
private _ovRemoteParticipants: ParticipantModel[] | undefined;
@ -91,7 +91,7 @@ export class LayoutRemoteParticipantsDirective {
*/
@Directive({
selector: 'ov-videoconference[brandingLogo], ov-toolbar[brandingLogo]',
standalone: false
standalone: true
})
export class ToolbarBrandingLogoDirective implements AfterViewInit, OnDestroy {
/**
@ -134,7 +134,7 @@ export class ToolbarBrandingLogoDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[prejoinDisplayParticipantName]',
standalone: false
standalone: true
})
export class PrejoinDisplayParticipantName implements OnDestroy {
/**
@ -180,7 +180,7 @@ export class PrejoinDisplayParticipantName implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[recordingActivityReadOnly]',
standalone: false
standalone: true
})
export class RecordingActivityReadOnlyDirective implements OnDestroy {
/**
@ -236,7 +236,7 @@ export class RecordingActivityReadOnlyDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[recordingActivityShowControls]',
standalone: false
standalone: true
})
export class RecordingActivityShowControlsDirective implements OnDestroy {
/**
@ -296,7 +296,7 @@ export class RecordingActivityShowControlsDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[toolbarViewRecordingsButton], ov-toolbar[viewRecordingsButton]',
standalone: false
standalone: true
})
export class ToolbarViewRecordingsButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -355,7 +355,7 @@ export class ToolbarViewRecordingsButtonDirective implements AfterViewInit, OnDe
*/
@Directive({
selector: 'ov-videoconference[recordingActivityStartStopRecordingButton]',
standalone: false
standalone: true
})
export class StartStopRecordingButtonsDirective implements OnDestroy {
/**
@ -399,7 +399,7 @@ export class StartStopRecordingButtonsDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[recordingActivityViewRecordingsButton]',
standalone: false
standalone: true
})
export class RecordingActivityViewRecordingsButtonDirective implements AfterViewInit, OnDestroy {
@Input() set recordingActivityViewRecordingsButton(value: boolean) {
@ -445,7 +445,7 @@ export class RecordingActivityViewRecordingsButtonDirective implements AfterView
*/
@Directive({
selector: 'ov-videoconference[recordingActivityShowRecordingsList]',
standalone: false
standalone: true
})
export class RecordingActivityShowRecordingsListDirective implements AfterViewInit, OnDestroy {
@Input() set recordingActivityShowRecordingsList(value: boolean) {
@ -490,7 +490,7 @@ export class RecordingActivityShowRecordingsListDirective implements AfterViewIn
*/
@Directive({
selector: 'ov-videoconference[toolbarRoomName], ov-toolbar[roomName]',
standalone: false
standalone: true
})
export class ToolbarRoomNameDirective implements AfterViewInit, OnDestroy {
@Input() set toolbarRoomName(value: string | undefined) {
@ -541,7 +541,7 @@ export class ToolbarRoomNameDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[showThemeSelector]',
standalone: false
standalone: true
})
export class ShowThemeSelectorDirective implements AfterViewInit, OnDestroy {
@Input() set showThemeSelector(value: boolean) {
@ -587,7 +587,7 @@ export class ShowThemeSelectorDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[e2eeKey]',
standalone: false
standalone: true
})
export class E2EEKeyDirective implements AfterViewInit, OnDestroy {
@Input() set e2eeKey(value: string | undefined) {

2
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/participant-panel-item.directive.ts
View File

@ -18,7 +18,7 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
*/
@Directive({
selector: 'ov-videoconference[participantPanelItemMuteButton], ov-participant-panel-item[muteButton]',
standalone: false
standalone: true
})
export class ParticipantPanelItemMuteButtonDirective implements AfterViewInit, OnDestroy {
@Input() set participantPanelItemMuteButton(value: boolean) {

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/stream.directive.ts
View File

@ -18,7 +18,7 @@ import { OpenViduComponentsConfigService } from '../../services/config/directive
*/
@Directive({
selector: 'ov-videoconference[streamDisplayParticipantName], ov-stream[displayParticipantName]',
standalone: false
standalone: true
})
export class StreamDisplayParticipantNameDirective implements AfterViewInit, OnDestroy {
@Input() set streamDisplayParticipantName(value: boolean) {
@ -71,7 +71,7 @@ export class StreamDisplayParticipantNameDirective implements AfterViewInit, OnD
*/
@Directive({
selector: 'ov-videoconference[streamDisplayAudioDetection], ov-stream[displayAudioDetection]',
standalone: false
standalone: true
})
export class StreamDisplayAudioDetectionDirective implements AfterViewInit, OnDestroy {
@Input() set streamDisplayAudioDetection(value: boolean) {
@ -122,7 +122,7 @@ export class StreamDisplayAudioDetectionDirective implements AfterViewInit, OnDe
*/
@Directive({
selector: 'ov-videoconference[streamVideoControls], ov-stream[videoControls]',
standalone: false
standalone: true
})
export class StreamVideoControlsDirective implements AfterViewInit, OnDestroy {
@Input() set streamVideoControls(value: boolean) {

30
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/toolbar.directive.ts
View File

@ -19,7 +19,7 @@ import { ToolbarAdditionalButtonsPosition } from '../../models/toolbar.model';
*/
@Directive({
selector: 'ov-videoconference[toolbarCameraButton], ov-toolbar[cameraButton]',
standalone: false
standalone: true
})
export class ToolbarCameraButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -83,7 +83,7 @@ export class ToolbarCameraButtonDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[toolbarMicrophoneButton], ov-toolbar[microphoneButton]',
standalone: false
standalone: true
})
export class ToolbarMicrophoneButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -147,7 +147,7 @@ export class ToolbarMicrophoneButtonDirective implements AfterViewInit, OnDestro
*/
@Directive({
selector: 'ov-videoconference[toolbarScreenshareButton], ov-toolbar[screenshareButton]',
standalone: false
standalone: true
})
export class ToolbarScreenshareButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -211,7 +211,7 @@ export class ToolbarScreenshareButtonDirective implements AfterViewInit, OnDestr
*/
@Directive({
selector: 'ov-videoconference[toolbarRecordingButton], ov-toolbar[recordingButton]',
standalone: false
standalone: true
})
export class ToolbarRecordingButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -273,7 +273,7 @@ export class ToolbarRecordingButtonDirective implements AfterViewInit, OnDestroy
*/
@Directive({
selector: 'ov-videoconference[toolbarBroadcastingButton], ov-toolbar[broadcastingButton]',
standalone: false
standalone: true
})
export class ToolbarBroadcastingButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -334,7 +334,7 @@ export class ToolbarBroadcastingButtonDirective implements AfterViewInit, OnDest
*/
@Directive({
selector: 'ov-videoconference[toolbarFullscreenButton], ov-toolbar[fullscreenButton]',
standalone: false
standalone: true
})
export class ToolbarFullscreenButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -395,7 +395,7 @@ export class ToolbarFullscreenButtonDirective implements AfterViewInit, OnDestro
*/
@Directive({
selector: 'ov-videoconference[toolbarBackgroundEffectsButton], ov-toolbar[backgroundEffectsButton]',
standalone: false
standalone: true
})
export class ToolbarBackgroundEffectsButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -515,7 +515,7 @@ export class ToolbarBackgroundEffectsButtonDirective implements AfterViewInit, O
*/
@Directive({
selector: 'ov-videoconference[toolbarSettingsButton], ov-toolbar[settingsButton]',
standalone: false
standalone: true
})
export class ToolbarSettingsButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -576,7 +576,7 @@ export class ToolbarSettingsButtonDirective implements AfterViewInit, OnDestroy
*/
@Directive({
selector: 'ov-videoconference[toolbarLeaveButton], ov-toolbar[leaveButton]',
standalone: false
standalone: true
})
export class ToolbarLeaveButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -638,7 +638,7 @@ export class ToolbarLeaveButtonDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[toolbarParticipantsPanelButton], ov-toolbar[participantsPanelButton]',
standalone: false
standalone: true
})
export class ToolbarParticipantsPanelButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -701,7 +701,7 @@ export class ToolbarParticipantsPanelButtonDirective implements AfterViewInit, O
*/
@Directive({
selector: 'ov-videoconference[toolbarChatPanelButton], ov-toolbar[chatPanelButton]',
standalone: false
standalone: true
})
export class ToolbarChatPanelButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -762,7 +762,7 @@ export class ToolbarChatPanelButtonDirective implements AfterViewInit, OnDestroy
*/
@Directive({
selector: 'ov-videoconference[toolbarActivitiesPanelButton], ov-toolbar[activitiesPanelButton]',
standalone: false
standalone: true
})
export class ToolbarActivitiesPanelButtonDirective implements AfterViewInit, OnDestroy {
/**
@ -823,7 +823,7 @@ export class ToolbarActivitiesPanelButtonDirective implements AfterViewInit, OnD
*/
@Directive({
selector: 'ov-videoconference[toolbarDisplayRoomName], ov-toolbar[displayRoomName]',
standalone: false
standalone: true
})
export class ToolbarDisplayRoomNameDirective implements AfterViewInit, OnDestroy {
/**
@ -885,7 +885,7 @@ export class ToolbarDisplayRoomNameDirective implements AfterViewInit, OnDestroy
*/
@Directive({
selector: 'ov-videoconference[toolbarDisplayLogo], ov-toolbar[displayLogo]',
standalone: false
standalone: true
})
export class ToolbarDisplayLogoDirective implements AfterViewInit, OnDestroy {
/**
@ -944,7 +944,7 @@ export class ToolbarDisplayLogoDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: '[ovToolbarAdditionalButtonsPosition]',
standalone: false
standalone: true
})
export class ToolbarAdditionalButtonsPossitionDirective implements AfterViewInit, OnDestroy {
/**

24
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/api/videoconference.directive.ts
View File

@ -19,7 +19,7 @@ import { StorageService } from '../../services/storage/storage.service';
*/
@Directive({
selector: 'ov-videoconference[livekitUrl]',
standalone: false
standalone: true
})
export class LivekitUrlDirective implements OnDestroy {
/**
@ -72,7 +72,7 @@ export class LivekitUrlDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[token]',
standalone: false
standalone: true
})
export class TokenDirective implements OnDestroy {
/**
@ -124,7 +124,7 @@ export class TokenDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[tokenError]',
standalone: false
standalone: true
})
export class TokenErrorDirective implements OnDestroy {
/**
@ -176,7 +176,7 @@ export class TokenErrorDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[minimal]',
standalone: false
standalone: true
})
export class MinimalDirective implements OnDestroy {
/**
@ -241,7 +241,7 @@ export class MinimalDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[lang]',
standalone: false
standalone: true
})
export class LangDirective implements OnDestroy {
/**
@ -311,7 +311,7 @@ export class LangDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[langOptions]',
standalone: false
standalone: true
})
export class LangOptionsDirective implements OnDestroy {
/**
@ -493,7 +493,7 @@ export class LangOptionsDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[participantName]',
standalone: false
standalone: true
})
export class ParticipantNameDirective implements AfterViewInit, OnDestroy {
/**
@ -554,7 +554,7 @@ export class ParticipantNameDirective implements AfterViewInit, OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[prejoin]',
standalone: false
standalone: true
})
export class PrejoinDirective implements OnDestroy {
/**
@ -607,7 +607,7 @@ export class PrejoinDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[videoEnabled]',
standalone: false
standalone: true
})
export class VideoEnabledDirective implements OnDestroy {
/**
@ -679,7 +679,7 @@ export class VideoEnabledDirective implements OnDestroy {
@Directive({
selector: 'ov-videoconference[audioEnabled]',
standalone: false
standalone: true
})
export class AudioEnabledDirective implements OnDestroy {
/**
@ -746,7 +746,7 @@ export class AudioEnabledDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[showDisconnectionDialog]',
standalone: false
standalone: true
})
export class ShowDisconnectionDialogDirective implements OnDestroy {
/**
@ -812,7 +812,7 @@ export class ShowDisconnectionDialogDirective implements OnDestroy {
*/
@Directive({
selector: 'ov-videoconference[recordingStreamBaseUrl]',
standalone: false
standalone: true
})
export class RecordingStreamBaseUrlDirective implements AfterViewInit, OnDestroy {
/**

14
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/template/internals.directive.ts
View File

@ -185,7 +185,7 @@ import { Directive, TemplateRef, ViewContainerRef } from '@angular/core';
@Directive({
selector: '[ovPreJoin]',
standalone: false
standalone: true
})
export class PreJoinDirective {
constructor(
@ -213,7 +213,7 @@ export class PreJoinDirective {
*/
@Directive({
selector: '[ovParticipantPanelAfterLocalParticipant]',
standalone: false
standalone: true
})
export class ParticipantPanelAfterLocalParticipantDirective {
constructor(
@ -239,7 +239,7 @@ export class ParticipantPanelAfterLocalParticipantDirective {
*/
@Directive({
selector: '[ovToolbarLeaveButton]',
standalone: false
standalone: true
})
export class LeaveButtonDirective {
constructor(
@ -267,7 +267,7 @@ export class LeaveButtonDirective {
*/
@Directive({
selector: '[ovLayoutAdditionalElements]',
standalone: false
standalone: true
})
export class LayoutAdditionalElementsDirective {
constructor(
@ -300,7 +300,7 @@ export class LayoutAdditionalElementsDirective {
*/
@Directive({
selector: '[ovParticipantPanelParticipantBadge]',
standalone: false
standalone: true
})
export class ParticipantPanelParticipantBadgeDirective {
constructor(
@ -335,7 +335,7 @@ export class ParticipantPanelParticipantBadgeDirective {
*/
@Directive({
selector: '[ovSettingsPanelGeneralAdditionalElements]',
standalone: false
standalone: true
})
export class SettingsPanelGeneralAdditionalElementsDirective {
constructor(
@ -370,7 +370,7 @@ export class SettingsPanelGeneralAdditionalElementsDirective {
*/
@Directive({
selector: '[ovToolbarMoreOptionsAdditionalMenuItems]',
standalone: false
standalone: true
})
export class ToolbarMoreOptionsAdditionalMenuItemsDirective {
constructor(

2
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/template/openvidu-components-angular.directive.module.ts
View File

@ -25,7 +25,7 @@ import {
} from './internals.directive';
@NgModule({
declarations: [
imports: [
ChatPanelDirective,
LayoutDirective,
PanelDirective,

26
openvidu-components-angular/projects/openvidu-components-angular/src/lib/directives/template/openvidu-components-angular.directive.ts
View File

@ -120,7 +120,7 @@ import { Directive, TemplateRef, ViewContainerRef } from '@angular/core';
*/
@Directive({
selector: '[ovToolbar]',
standalone: false
standalone: true
})
export class ToolbarDirective {
/**
@ -260,7 +260,7 @@ export class ToolbarDirective {
@Directive({
selector: '[ovToolbarAdditionalButtons]',
standalone: false
standalone: true
})
export class ToolbarAdditionalButtonsDirective {
/**
@ -383,7 +383,7 @@ export class ToolbarAdditionalButtonsDirective {
*/
@Directive({
selector: '[ovToolbarAdditionalPanelButtons]',
standalone: false
standalone: true
})
export class ToolbarAdditionalPanelButtonsDirective {
/**
@ -533,7 +533,7 @@ export class ToolbarAdditionalPanelButtonsDirective {
*/
@Directive({
selector: '[ovPanel]',
standalone: false
standalone: true
})
export class PanelDirective {
/**
@ -720,7 +720,7 @@ export class PanelDirective {
*/
@Directive({
selector: '[ovAdditionalPanels]',
standalone: false
standalone: true
})
export class AdditionalPanelsDirective {
/**
@ -898,7 +898,7 @@ export class AdditionalPanelsDirective {
*/
@Directive({
selector: '[ovChatPanel]',
standalone: false
standalone: true
})
export class ChatPanelDirective {
constructor(
@ -913,7 +913,7 @@ export class ChatPanelDirective {
*/
@Directive({
selector: '[ovBackgroundEffectsPanel]',
standalone: false
standalone: true
})
export class BackgroundEffectsPanelDirective {
constructor(
@ -1026,7 +1026,7 @@ export class BackgroundEffectsPanelDirective {
*/
@Directive({
selector: '[ovActivitiesPanel]',
standalone: false
standalone: true
})
export class ActivitiesPanelDirective {
constructor(
@ -1197,7 +1197,7 @@ export class ActivitiesPanelDirective {
@Directive({
selector: '[ovParticipantsPanel]',
standalone: false
standalone: true
})
export class ParticipantsPanelDirective {
constructor(
@ -1335,7 +1335,7 @@ export class ParticipantsPanelDirective {
@Directive({
selector: '[ovParticipantPanelItem]',
standalone: false
standalone: true
})
export class ParticipantPanelItemDirective {
constructor(
@ -1478,7 +1478,7 @@ export class ParticipantPanelItemDirective {
@Directive({
selector: '[ovParticipantPanelItemElements]',
standalone: false
standalone: true
})
export class ParticipantPanelItemElementsDirective {
constructor(
@ -1674,7 +1674,7 @@ export class ParticipantPanelItemElementsDirective {
*/
@Directive({
selector: '[ovLayout]',
standalone: false
standalone: true
})
export class LayoutDirective {
constructor(
@ -1806,7 +1806,7 @@ export class LayoutDirective {
@Directive({
selector: '[ovStream]',
standalone: false
standalone: true
})
export class StreamDirective {
constructor(

18
openvidu-components-angular/projects/openvidu-components-angular/src/lib/openvidu-components-angular-ui.module.ts
View File

@ -87,7 +87,14 @@ const privateComponents = [
];
@NgModule({
declarations: [
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
AppMaterialModule,
OpenViduComponentsDirectiveModule,
ApiDirectiveModule,
DragDropModule,
...publicComponents,
...privateComponents,
LinkifyPipe,
@ -98,15 +105,6 @@ const privateComponents = [
TrackPublishedTypesPipe,
TranslatePipe
],
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
AppMaterialModule,
OpenViduComponentsDirectiveModule,
ApiDirectiveModule,
DragDropModule
],
exports: [
...publicComponents,
RemoteParticipantTracksPipe,

2
openvidu-components-angular/projects/openvidu-components-angular/src/lib/pipes/linkify.pipe.ts
View File

@ -4,7 +4,7 @@ import { Linkifier } from '../models/linkifier.model';
/**
* @internal
*/
@Pipe({ name: 'linkify', standalone: false })
@Pipe({ name: 'linkify', standalone: true })
export class LinkifyPipe implements PipeTransform {
private linkifer: Linkifier;

4
openvidu-components-angular/projects/openvidu-components-angular/src/lib/pipes/participant.pipe.ts
View File

@ -8,7 +8,7 @@ import { Track } from 'livekit-client';
* This is used to display the tracks in the videoconference layout.
* @returns {ParticipantTrackPublication[]} Array of tracks
*/
@Pipe({ name: 'tracks', standalone: false })
@Pipe({ name: 'tracks', standalone: true })
export class RemoteParticipantTracksPipe implements PipeTransform {
constructor() {}
@ -20,7 +20,7 @@ export class RemoteParticipantTracksPipe implements PipeTransform {
/**
* @internal
*/
@Pipe({ name: 'tracksPublishedTypes', standalone: false })
@Pipe({ name: 'tracksPublishedTypes', standalone: true })
export class TrackPublishedTypesPipe implements PipeTransform {
constructor(private translateService: TranslateService) {}

6
openvidu-components-angular/projects/openvidu-components-angular/src/lib/pipes/recording.pipe.ts
View File

@ -5,7 +5,7 @@ import { Pipe, PipeTransform } from '@angular/core';
*/
@Pipe({
name: 'duration',
standalone: false
standalone: true
})
export class DurationFromSecondsPipe implements PipeTransform {
transform(durationInSeconds: number): string {
@ -28,7 +28,7 @@ export class DurationFromSecondsPipe implements PipeTransform {
*/
@Pipe({
name: 'searchByStringProperty',
standalone: false
standalone: true
})
export class SearchByStringPropertyPipe implements PipeTransform {
transform(items: any[], props: { properties: string[]; filter: string }): any {
@ -60,7 +60,7 @@ export class SearchByStringPropertyPipe implements PipeTransform {
*/
@Pipe({
name: 'thumbnailUrl',
standalone: false
standalone: true
})
export class ThumbnailFromUrlPipe implements PipeTransform {
transform(url: string): string {

2
openvidu-components-angular/projects/openvidu-components-angular/src/lib/pipes/translate.pipe.ts
View File

@ -6,7 +6,7 @@ import { TranslateService } from '../services/translate/translate.service';
*/
@Pipe({
name: 'translate', pure: false,
standalone: false
standalone: true
})
export class TranslatePipe implements PipeTransform {
constructor(private translateService: TranslateService) {}