mediasfu-angular 1.0.0

package/dist/lib/components/display-components/mini-card-audio/mini-card-audio.component.d.ts

@@ -0,0 +1,95 @@
+import { OnInit, OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+export interface MiniCardAudioOptions {
+    customStyle?: Partial<CSSStyleDeclaration>;
+    name?: string;
+    showWaveform?: boolean;
+    overlayPosition?: string;
+    barColor?: string;
+    textColor?: string;
+    imageSource?: string;
+    roundedImage?: boolean;
+    imageStyle?: Partial<CSSStyleDeclaration>;
+}
+export type MiniCardAudioType = (options: MiniCardAudioOptions) => HTMLElement;
+/**
+ * MiniCardAudio component displays an audio card with optional waveform animation.
+ *
+ * @component
+ * @selector app-mini-card-audio
+ * @standalone true
+ * @imports CommonModule
+ *
+ * @template
+ * The template includes:
+ * - A card container with customizable styles.
+ * - An optional background image.
+ * - An overlay with the name and waveform animation.
+ *
+ * @styles
+ * The styles include:
+ * - Card dimensions and background color.
+ * - Overlay positioning and grid layout.
+ * - Name column styling.
+ * - Waveform bar styling.
+ * - Background image positioning and optional rounded corners.
+ *
+ * @inputs
+ * @param {any} customStyle - Custom styles for the card.
+ * @param {string} name - The name to display on the card.
+ * @param {boolean} showWaveform - Flag to show or hide the waveform animation.
+ * @param {string} overlayPosition - Position of the overlay on the card.
+ * @param {string} barColor - Color of the waveform bars.
+ * @param {string} textColor - Color of the name text.
+ * @param {string} imageSource - Source URL for the background image.
+ * @param {boolean} roundedImage - Flag to apply rounded corners to the background image.
+ * @param {any} imageStyle - Custom styles for the background image.
+ *
+ * @class
+ * @implements OnInit, OnDestroy
+ *
+ * @constructor
+ * @param {Partial<CSSStyleDeclaration>} injectedCustomStyle - Injected custom styles for the card.
+ * @param {string} injectedName - Injected name to display on the card.
+ * @param {boolean} injectedShowWaveform - Injected flag to show or hide the waveform animation.
+ * @param {string} injectedOverlayPosition - Injected position of the overlay on the card.
+ * @param {string} injectedBarColor - Injected color of the waveform bars.
+ * @param {string} injectedTextColor - Injected color of the name text.
+ * @param {string} injectedImageSource - Injected source URL for the background image.
+ * @param {boolean} injectedRoundedImage - Injected flag to apply rounded corners to the background image.
+ * @param {Partial<CSSStyleDeclaration>} injectedImageStyle - Injected custom styles for the background image.
+ *
+ * @methods
+ * @method ngOnInit - Lifecycle hook that is called after data-bound properties are initialized.
+ * @method ngOnDestroy - Lifecycle hook that is called just before the component is destroyed.
+ * @method animateWaveform - Starts the waveform animation.
+ * @method resetWaveform - Resets the waveform animation.
+ * @method clearIntervals - Clears all animation intervals.
+ * @method getAnimationDuration - Returns the animation duration for a given index.
+ * @method getImageStyle - Returns the styles for the background image.
+ * @method getOverlayPosition - Returns the styles for the overlay position.
+ */
+export declare class MiniCardAudio implements OnInit, OnDestroy {
+    customStyle: any;
+    name: string;
+    showWaveform: boolean;
+    overlayPosition: string;
+    barColor: string;
+    textColor: string;
+    imageSource: string;
+    roundedImage: boolean;
+    imageStyle: any;
+    waveformAnimations: number[];
+    intervals: NodeJS.Timeout[];
+    constructor(injectedCustomStyle: Partial<CSSStyleDeclaration>, injectedName: string, injectedShowWaveform: boolean, injectedOverlayPosition: string, injectedBarColor: string, injectedTextColor: string, injectedImageSource: string, injectedRoundedImage: boolean, injectedImageStyle: Partial<CSSStyleDeclaration>);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    animateWaveform(): void;
+    resetWaveform(): void;
+    clearIntervals(): void;
+    getAnimationDuration(index: number): number;
+    getImageStyle(): any;
+    getOverlayPosition(position: string): import("../../../@types/types").OverlayPositionStyle;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MiniCardAudio, [{ optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MiniCardAudio, "app-mini-card-audio", never, { "customStyle": { "alias": "customStyle"; "required": false; }; "name": { "alias": "name"; "required": false; }; "showWaveform": { "alias": "showWaveform"; "required": false; }; "overlayPosition": { "alias": "overlayPosition"; "required": false; }; "barColor": { "alias": "barColor"; "required": false; }; "textColor": { "alias": "textColor"; "required": false; }; "imageSource": { "alias": "imageSource"; "required": false; }; "roundedImage": { "alias": "roundedImage"; "required": false; }; "imageStyle": { "alias": "imageStyle"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-components/other-grid-component/other-grid-component.component.d.ts

@@ -0,0 +1,45 @@
+import * as i0 from "@angular/core";
+export interface OtherGridComponentOptions {
+    backgroundColor?: string;
+    width?: number;
+    height?: number;
+    showAspect?: boolean;
+    timeBackgroundColor?: string;
+    showTimer?: boolean;
+    meetingProgressTime?: string;
+}
+export type OtherGridComponentType = (options: OtherGridComponentOptions) => HTMLElement;
+/**
+ * Component representing a customizable grid with an optional timer.
+ *
+ * @selector app-other-grid-component
+ * @standalone true
+ * @imports CommonModule, MeetingProgressTimer
+ *
+ * @template
+ * <div [ngStyle]="{...}">
+ *   <app-meeting-progress-timer *ngIf="showTimer" [meetingProgressTime]="meetingProgressTime" [initialBackgroundColor]="timeBackgroundColor" [showTimer]="showTimer"></app-meeting-progress-timer>
+ *   <ng-content></ng-content>
+ * </div>
+ *
+ * @class OtherGridComponent
+ *
+ * @property {string} backgroundColor - The background color of the grid. Default is 'transparent'.
+ * @property {number} width - The width of the grid in pixels. Default is 0.
+ * @property {number} height - The height of the grid in pixels. Default is 0.
+ * @property {boolean} showAspect - Flag to show or hide the grid. Default is true.
+ * @property {string} timeBackgroundColor - The background color of the timer. Default is 'green'.
+ * @property {boolean} showTimer - Flag to show or hide the timer. Default is false.
+ * @property {string} meetingProgressTime - The meeting progress time to be displayed in the timer. Default is '00:00:00'.
+ */
+export declare class OtherGridComponent {
+    backgroundColor: string;
+    width: number;
+    height: number;
+    showAspect: boolean;
+    timeBackgroundColor: string;
+    showTimer: boolean;
+    meetingProgressTime: string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<OtherGridComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<OtherGridComponent, "app-other-grid-component", never, { "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "showAspect": { "alias": "showAspect"; "required": false; }; "timeBackgroundColor": { "alias": "timeBackgroundColor"; "required": false; }; "showTimer": { "alias": "showTimer"; "required": false; }; "meetingProgressTime": { "alias": "meetingProgressTime"; "required": false; }; }, {}, never, ["*"], true, never>;
+}

package/dist/lib/components/display-components/pagination/pagination.component.d.ts

@@ -0,0 +1,112 @@
+import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { GeneratePageContent, GeneratePageContentParameters } from '../../../consumers/generate-page-content.service';
+import { Socket } from 'socket.io-client';
+import { BreakoutParticipant, ComponentSizes, ShowAlert } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface PaginationParameters extends GeneratePageContentParameters {
+    mainRoomsLength: number;
+    memberRoom: number;
+    breakOutRoomStarted: boolean;
+    breakOutRoomEnded: boolean;
+    member: string;
+    breakoutRooms: BreakoutParticipant[][];
+    hostNewRoom: number;
+    roomName: string;
+    islevel: string;
+    showAlert?: ShowAlert;
+    socket: Socket;
+    getUpdatedAllParams: () => PaginationParameters;
+    [key: string]: any;
+}
+export interface PaginationOptions {
+    totalPages: number;
+    currentUserPage: number;
+    handlePageChange: (options: any) => Promise<void>;
+    position: 'left' | 'middle' | 'right' | string;
+    location: 'top' | 'middle' | 'bottom' | string;
+    direction: 'horizontal' | 'vertical';
+    buttonsContainerStyle: any;
+    activePageStyle: any;
+    inactivePageStyle: any;
+    backgroundColor: string;
+    paginationHeight: number;
+    showAspect?: boolean;
+    parameters: PaginationParameters;
+}
+export type PaginationType = (options: PaginationOptions) => HTMLElement;
+/**
+ * Pagination component for displaying and handling pagination controls.
+ *
+ * @component
+ * @selector app-pagination
+ * @standalone true
+ * @imports [CommonModule, FontAwesomeModule]
+ *
+ * @description
+ * This component renders pagination controls with customizable styles and behavior.
+ * It supports horizontal and vertical layouts, different positions, and dynamic data.
+ *
+ * @example
+ * <app-pagination
+ *   [totalPages]="10"
+ *   [currentUserPage]="1"
+ *   [handlePageChange]="handlePageChange"
+ *   [position]="'middle'"
+ *   [location]="'bottom'"
+ *   [direction]="'horizontal'"
+ *   [backgroundColor]="'#ffffff'"
+ *   [paginationHeight]="40"
+ *   [showAspect]="true"
+ *   [parameters]="paginationParameters">
+ * </app-pagination>
+ *
+ * @input {number} totalPages - Total number of pages.
+ * @input {number} currentUserPage - Current active page.
+ * @input {Function} handlePageChange - Function to handle page change.
+ * @input {'left' | 'middle' | 'right' | string} position - Position of the pagination controls.
+ * @input {'top' | 'middle' | 'bottom' | string} location - Location of the pagination controls.
+ * @input {'horizontal' | 'vertical' | string} direction - Direction of the pagination controls.
+ * @input {any} buttonsContainerStyle - Custom styles for the buttons container.
+ * @input {any} activePageStyle - Custom styles for the active page button.
+ * @input {any} inactivePageStyle - Custom styles for the inactive page buttons.
+ * @input {string} backgroundColor - Background color of the pagination controls.
+ * @input {number} paginationHeight - Height of the pagination controls.
+ * @input {boolean} showAspect - Flag to show or hide the pagination controls.
+ * @input {PaginationParameters} parameters - Additional parameters for pagination.
+ *
+ * @method ngOnInit - Initializes the component and sets up initial data.
+ * @method ngOnChanges - Handles changes to input properties and updates data accordingly.
+ * @method handleClick - Handles click events on pagination buttons and performs necessary actions.
+ * @method getPageStyle - Returns the style for a given page button based on its state.
+ * @method isBreakoutRoom - Determines if a given item represents a breakout room.
+ * @method getDisplayItem - Returns the display text for a given item.
+ */
+export declare class Pagination implements OnInit, OnChanges {
+    private generatePageContentService;
+    totalPages: number;
+    currentUserPage: number;
+    handlePageChange: (options: any) => Promise<void>;
+    position: 'left' | 'middle' | 'right' | string;
+    location: 'top' | 'middle' | 'bottom' | string;
+    direction: 'horizontal' | 'vertical';
+    buttonsContainerStyle: any;
+    activePageStyle: any;
+    inactivePageStyle: any;
+    backgroundColor: string;
+    paginationHeight: number;
+    showAspect: boolean;
+    parameters: PaginationParameters;
+    constructor(generatePageContentService: GeneratePageContent);
+    faStar: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faLock: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    data: number[];
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    handleClick: (page: number) => Promise<void>;
+    componentSizes: ComponentSizes;
+    getPageStyle(item: number): any;
+    isBreakoutRoom: (item: number) => boolean;
+    getDisplayItem(item: number): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<Pagination, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<Pagination, "app-pagination", never, { "totalPages": { "alias": "totalPages"; "required": false; }; "currentUserPage": { "alias": "currentUserPage"; "required": false; }; "handlePageChange": { "alias": "handlePageChange"; "required": false; }; "position": { "alias": "position"; "required": false; }; "location": { "alias": "location"; "required": false; }; "direction": { "alias": "direction"; "required": false; }; "buttonsContainerStyle": { "alias": "buttonsContainerStyle"; "required": false; }; "activePageStyle": { "alias": "activePageStyle"; "required": false; }; "inactivePageStyle": { "alias": "inactivePageStyle"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "paginationHeight": { "alias": "paginationHeight"; "required": false; }; "showAspect": { "alias": "showAspect"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-components/sub-aspect-component/sub-aspect-component.component.d.ts

@@ -0,0 +1,61 @@
+import { OnInit, OnDestroy, OnChanges, SimpleChanges } from '@angular/core';
+import * as i0 from "@angular/core";
+export interface SubAspectComponentOptions {
+    backgroundColor?: string;
+    showControls?: boolean;
+    containerWidthFraction?: number;
+    containerHeightFraction?: number;
+    defaultFractionSub?: number;
+}
+export type SubAspectComponentType = (options: SubAspectComponentOptions) => HTMLElement;
+/**
+ * @fileoverview SubAspectComponent is an Angular component that displays a sub-aspect of a media element.
+ * It adjusts its size and visibility based on input properties and window events.
+ *
+ * @component
+ * @selector app-sub-aspect-component
+ * @standalone true
+ * @imports CommonModule
+ *
+ * @template
+ * <div *ngIf="showControls" [ngStyle]="{ position: 'absolute', bottom: '0', margin: '0', backgroundColor: backgroundColor, height: aspectStyles.height + 'px', width: aspectStyles.width + 'px' }">
+ *   <ng-content></ng-content>
+ * </div>
+ *
+ * @styles []
+ *
+ * @class SubAspectComponent
+ * @implements OnInit, OnDestroy, OnChanges
+ *
+ * @property {string} backgroundColor - The background color of the component. Default is 'transparent'.
+ * @property {boolean} showControls - Determines whether the controls are shown. Default is true.
+ * @property {number} containerWidthFraction - The fraction of the container's width. Default is 1.
+ * @property {number} containerHeightFraction - The fraction of the container's height. Default is 1.
+ * @property {number} defaultFractionSub - The default fraction for the sub-aspect. Default is 0.0.
+ * @property {object} aspectStyles - The styles for the aspect, including height and width.
+ * @property {number} aspectStyles.height - The height of the aspect.
+ * @property {number} aspectStyles.width - The width of the aspect.
+ * @property {number} subAspectFraction - The fraction of the sub-aspect.
+ *
+ * @method ngOnInit - Lifecycle hook that is called after data-bound properties are initialized. Adds event listeners for window resize and orientation change.
+ * @method ngOnChanges - Lifecycle hook that is called when any data-bound property changes. Updates aspect styles if relevant properties change.
+ * @method ngOnDestroy - Lifecycle hook that is called just before the component is destroyed. Removes event listeners for window resize and orientation change.
+ * @method updateAspectStyles - Updates the aspect styles based on the current window size and input properties.
+ */
+export declare class SubAspectComponent implements OnInit, OnDestroy, OnChanges {
+    backgroundColor: string;
+    showControls: boolean;
+    containerWidthFraction: number;
+    containerHeightFraction: number;
+    defaultFractionSub: number;
+    aspectStyles: {
+        height: number;
+        width: number;
+    };
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    ngOnDestroy(): void;
+    private updateAspectStyles;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SubAspectComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SubAspectComponent, "app-sub-aspect-component", never, { "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "showControls": { "alias": "showControls"; "required": false; }; "containerWidthFraction": { "alias": "containerWidthFraction"; "required": false; }; "containerHeightFraction": { "alias": "containerHeightFraction"; "required": false; }; "defaultFractionSub": { "alias": "defaultFractionSub"; "required": false; }; }, {}, never, ["*"], true, never>;
+}

package/dist/lib/components/display-components/video-card/video-card.component.d.ts

@@ -0,0 +1,89 @@
+import { OnInit, OnDestroy } from '@angular/core';
+import { ControlMedia } from '../../../consumers/control-media.service';
+import { Participant, AudioDecibels, CoHostResponsibility, ShowAlert, EventType, CustomComponent } from '../../../@types/types';
+import { Socket } from 'socket.io-client';
+import * as i0 from "@angular/core";
+export interface VideoCardParameters {
+    socket: Socket;
+    roomName: string;
+    coHostResponsibility: CoHostResponsibility[];
+    showAlert?: ShowAlert;
+    coHost: string;
+    participants: Participant[];
+    member: string;
+    islevel: string;
+    audioDecibels: AudioDecibels[];
+    getUpdatedAllParams: () => VideoCardParameters;
+}
+export interface VideoCardOptions {
+    customStyle?: Partial<CSSStyleDeclaration>;
+    name: string;
+    barColor?: string;
+    textColor?: string;
+    imageSource: string;
+    roundedImage?: boolean;
+    imageStyle?: Partial<CSSStyleDeclaration>;
+    remoteProducerId: string;
+    eventType: EventType;
+    forceFullDisplay?: boolean;
+    videoStream: MediaStream | null;
+    showControls?: boolean;
+    showInfo?: boolean;
+    videoInfoComponent?: HTMLElement | CustomComponent;
+    videoControlsComponent?: HTMLElement | CustomComponent;
+    controlsPosition?: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+    infoPosition?: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+    participant: Participant;
+    backgroundColor: string;
+    audioDecibels: AudioDecibels[];
+    doMirror?: boolean;
+    parameters: VideoCardParameters;
+}
+export type VideoCardType = (options: VideoCardOptions) => HTMLElement;
+export declare class VideoCard implements OnInit, OnDestroy {
+    private controlMediaService;
+    customStyle: Partial<CSSStyleDeclaration>;
+    name: string;
+    barColor: string;
+    textColor: string;
+    imageSource: string;
+    roundedImage: boolean;
+    imageStyle: Partial<CSSStyleDeclaration>;
+    remoteProducerId: string;
+    eventType: EventType;
+    forceFullDisplay: boolean;
+    videoStream: MediaStream | null;
+    showControls: boolean;
+    showInfo: boolean;
+    videoInfoComponent?: HTMLElement | CustomComponent;
+    videoControlsComponent?: HTMLElement | CustomComponent;
+    controlsPosition: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+    infoPosition: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+    participant: Participant;
+    backgroundColor: string;
+    audioDecibels: AudioDecibels[];
+    doMirror: boolean;
+    parameters: VideoCardParameters;
+    waveformAnimations: number[];
+    showWaveform: boolean;
+    interval: any;
+    faMicrophone: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faMicrophoneSlash: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faVideo: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    faVideoSlash: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    constructor(controlMediaService: ControlMedia, injectedCustomStyle: Partial<CSSStyleDeclaration>, injectedName: string, injectedBarColor: string, injectedTextColor: string, injectedImageSource: string, injectedRoundedImage: boolean, injectedImageStyle: Partial<CSSStyleDeclaration>, injectedRemoteProducerId: string, injectedEventType: EventType, injectedForceFullDisplay: boolean, injectedVideoStream: MediaStream | null, injectedShowControls: boolean, injectedShowInfo: boolean, injectedVideoInfoComponent: HTMLElement, injectedVideoControlsComponent: HTMLElement, injectedControlsPosition: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight', injectedInfoPosition: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight', injectedParticipant: Participant, injectedBackgroundColor: string, injectedAudioDecibels: AudioDecibels[], injectedDoMirror: boolean, injectedParameters: VideoCardParameters);
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    animateWaveform(): void;
+    animateBar(index: number): void;
+    resetWaveform(): void;
+    getAnimationDuration(index: number): number;
+    toggleAudio(): Promise<void>;
+    toggleVideo(): Promise<void>;
+    renderControls(): HTMLElement | CustomComponent | "\n      <div class=\"overlayControls\">\n        <button class=\"controlButton\" (click)=\"toggleAudio()\">\n          <fa-icon [icon]=\"participant?.muted ? faMicrophoneSlash : faMicrophone\" [style.color]=\"participant?.muted ? 'red' : 'green'\"></fa-icon>\n        </button>\n        <button class=\"controlButton\" (click)=\"toggleVideo()\">\n          <fa-icon [icon]=\"participant?.videoOn ? faVideo : faVideoSlash\" [style.color]=\"participant?.videoOn ? 'green' : 'red'\"></fa-icon>\n        </button>\n      </div>\n    " | null;
+    getOverlayPosition(position: string): import("../../../@types/types").OverlayPositionStyle;
+    isCustomComponent(comp: HTMLElement | CustomComponent | (() => HTMLElement | CustomComponent)): comp is CustomComponent;
+    isFunctionComponent(comp: HTMLElement | CustomComponent | (() => HTMLElement | CustomComponent)): comp is () => HTMLElement | CustomComponent;
+    static ɵfac: i0.ɵɵFactoryDeclaration<VideoCard, [null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<VideoCard, "app-video-card", never, { "customStyle": { "alias": "customStyle"; "required": false; }; "name": { "alias": "name"; "required": false; }; "barColor": { "alias": "barColor"; "required": false; }; "textColor": { "alias": "textColor"; "required": false; }; "imageSource": { "alias": "imageSource"; "required": false; }; "roundedImage": { "alias": "roundedImage"; "required": false; }; "imageStyle": { "alias": "imageStyle"; "required": false; }; "remoteProducerId": { "alias": "remoteProducerId"; "required": false; }; "eventType": { "alias": "eventType"; "required": false; }; "forceFullDisplay": { "alias": "forceFullDisplay"; "required": false; }; "videoStream": { "alias": "videoStream"; "required": false; }; "showControls": { "alias": "showControls"; "required": false; }; "showInfo": { "alias": "showInfo"; "required": false; }; "videoInfoComponent": { "alias": "videoInfoComponent"; "required": false; }; "videoControlsComponent": { "alias": "videoControlsComponent"; "required": false; }; "controlsPosition": { "alias": "controlsPosition"; "required": false; }; "infoPosition": { "alias": "infoPosition"; "required": false; }; "participant": { "alias": "participant"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "audioDecibels": { "alias": "audioDecibels"; "required": false; }; "doMirror": { "alias": "doMirror"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/display-settings-components/display-settings-modal.component.d.ts

@@ -0,0 +1,65 @@
+import { ModifyDisplaySettings, ModifyDisplaySettingsOptions, ModifyDisplaySettingsParameters } from '../../methods/display-settings-methods/modify-display-settings.service';
+import * as i0 from "@angular/core";
+export interface DisplaySettingsModalParameters extends ModifyDisplaySettingsParameters {
+    meetingDisplayType: string;
+    autoWave: boolean;
+    forceFullDisplay: boolean;
+    meetingVideoOptimized: boolean;
+}
+export interface DisplaySettingsModalOptions {
+    isDisplaySettingsModalVisible: boolean;
+    onDisplaySettingsClose: () => void;
+    onModifyDisplaySettings: (options: ModifyDisplaySettingsOptions) => void;
+    parameters: DisplaySettingsModalParameters;
+    position: string;
+    backgroundColor: string;
+}
+export type DisplaySettingsModalType = (options: DisplaySettingsModalOptions) => HTMLElement;
+/**
+ * Component for displaying and modifying display settings in a modal.
+ *
+ * @selector app-display-settings-modal
+ * @standalone true
+ * @imports [CommonModule, FontAwesomeModule, FormsModule]
+ * @templateUrl ./display-settings-modal.component.html
+ * @styleUrls ['./display-settings-modal.component.css']
+ *
+ * @property {boolean} isDisplaySettingsModalVisible - Determines if the display settings modal is visible.
+ * @property {() => void} onDisplaySettingsClose - Callback function to handle closing the display settings modal.
+ * @property {(params: any) => void} onModifyDisplaySettings - Callback function to handle modifying display settings.
+ * @property {DisplaySettingsModalParameters} parameters - Parameters for the display settings modal.
+ * @property {string} position - Position of the modal on the screen. Default is 'topRight'.
+ * @property {string} backgroundColor - Background color of the modal. Default is '#83c0e9'.
+ *
+ * @property {IconDefinition} faTimes - FontAwesome icon for the close button.
+ *
+ * @property {string} meetingDisplayTypeState - State for the meeting display type.
+ * @property {boolean} autoWaveState - State for the auto wave setting. Default is false.
+ * @property {boolean} forceFullDisplayState - State for the force full display setting. Default is false.
+ * @property {boolean} meetingVideoOptimizedState - State for the meeting video optimized setting. Default is false.
+ *
+ * @constructor
+ * @param {ModifyDisplaySettings} modifyDisplaySettingsService - Service to modify display settings.
+ *
+ * @method ngOnInit - Initializes the component and sets the initial state based on the input parameters.
+ * @method handleSaveSettings - Handles saving the modified display settings.
+ */
+export declare class DisplaySettingsModal {
+    private modifyDisplaySettingsService;
+    isDisplaySettingsModalVisible: boolean;
+    onDisplaySettingsClose: () => void;
+    onModifyDisplaySettings: (params: any) => void;
+    parameters: DisplaySettingsModalParameters;
+    position: string;
+    backgroundColor: string;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    meetingDisplayTypeState: string;
+    autoWaveState: boolean;
+    forceFullDisplayState: boolean;
+    meetingVideoOptimizedState: boolean;
+    constructor(modifyDisplaySettingsService: ModifyDisplaySettings);
+    ngOnInit(): void;
+    handleSaveSettings: () => Promise<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<DisplaySettingsModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DisplaySettingsModal, "app-display-settings-modal", never, { "isDisplaySettingsModalVisible": { "alias": "isDisplaySettingsModalVisible"; "required": false; }; "onDisplaySettingsClose": { "alias": "onDisplaySettingsClose"; "required": false; }; "onModifyDisplaySettings": { "alias": "onModifyDisplaySettings"; "required": false; }; "parameters": { "alias": "parameters"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; }, {}, never, never, true, never>;
+}

package/dist/lib/components/event-settings-components/event-settings-modal/event-settings-modal.component.d.ts

@@ -0,0 +1,124 @@
+import { OnInit, OnChanges, SimpleChanges } from '@angular/core';
+import { ModifySettings, ModifySettingsOptions } from '../../../methods/settings-methods/modify-settings.service';
+import { Socket } from 'socket.io-client';
+import { ShowAlert } from '../../../@types/types';
+import * as i0 from "@angular/core";
+export interface EventSettingsModalOptions {
+    isEventSettingsModalVisible: boolean;
+    onEventSettingsClose: () => void;
+    onModifyEventSettings?: (options: ModifySettingsOptions) => Promise<void>;
+    position?: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+    backgroundColor?: string;
+    audioSetting: string;
+    videoSetting: string;
+    screenshareSetting: string;
+    chatSetting: string;
+    updateAudioSetting: (setting: string) => void;
+    updateVideoSetting: (setting: string) => void;
+    updateScreenshareSetting: (setting: string) => void;
+    updateChatSetting: (setting: string) => void;
+    updateIsSettingsModalVisible: (isVisible: boolean) => void;
+    roomName: string;
+    socket: Socket;
+    showAlert?: ShowAlert;
+}
+export type EventSettingsModalType = (options: EventSettingsModalOptions) => HTMLElement;
+/**
+ * Component for managing event settings modal.
+ *
+ * @selector app-event-settings-modal
+ * @standalone true
+ * @imports CommonModule, FontAwesomeModule, FormsModule
+ * @templateUrl ./event-settings-modal.component.html
+ * @styleUrls ./event-settings-modal.component.css
+ *
+ * @class EventSettingsModal
+ * @implements OnInit, OnChanges
+ *
+ * @property {boolean} isEventSettingsModalVisible - Indicates if the event settings modal is visible.
+ * @property {() => void} onEventSettingsClose - Callback function to close the event settings modal.
+ * @property {(options: ModifySettingsOptions) => Promise<void>} onModifyEventSettings - Callback function to modify event settings.
+ * @property {string} position - Position of the modal on the screen.
+ * @property {string} backgroundColor - Background color of the modal.
+ * @property {string} audioSetting - Current audio setting.
+ * @property {string} videoSetting - Current video setting.
+ * @property {string} screenshareSetting - Current screenshare setting.
+ * @property {string} chatSetting - Current chat setting.
+ * @property {(setting: string) => void} updateAudioSetting - Callback function to update audio setting.
+ * @property {(setting: string) => void} updateVideoSetting - Callback function to update video setting.
+ * @property {(setting: string) => void} updateScreenshareSetting - Callback function to update screenshare setting.
+ * @property {(setting: string) => void} updateChatSetting - Callback function to update chat setting.
+ * @property {(isVisible: boolean) => void} updateIsSettingsModalVisible - Callback function to update modal visibility.
+ * @property {string} roomName - Name of the room.
+ * @property {Socket} socket - Socket instance for communication.
+ * @property {ShowAlert} [showAlert] - Optional alert function.
+ *
+ * @property {string} audioState - State of the audio setting.
+ * @property {string} videoState - State of the video setting.
+ * @property {string} screenshareState - State of the screenshare setting.
+ * @property {string} chatState - State of the chat setting.
+ *
+ * @property {IconDefinition} faTimes - FontAwesome icon for close button.
+ *
+ * @constructor
+ * @param {ModifySettings} modifySettingsService - Service for modifying settings.
+ *
+ * @method ngOnInit - Lifecycle hook that is called after data-bound properties are initialized.
+ * @method ngOnChanges - Lifecycle hook that is called when any data-bound property changes.
+ * @param {SimpleChanges} changes - Object of current and previous property values.
+ *
+ * @method updateStatesFromParameters - Updates the state variables from the input parameters.
+ *
+ * @method getModalContentStyle - Returns the style object for the modal content.
+ * @returns {Object} Style object for the modal content.
+ *
+ * @method handleSaveSettings - Handles the save settings action.
+ * @returns {Promise<void>} Promise that resolves when settings are saved.
+ *
+ * @method closeModal - Closes the modal.
+ */
+export declare class EventSettingsModal implements OnInit, OnChanges {
+    private modifySettingsService;
+    isEventSettingsModalVisible: boolean;
+    onEventSettingsClose: () => void;
+    onModifyEventSettings: (options: ModifySettingsOptions) => Promise<void>;
+    position: string;
+    backgroundColor: string;
+    audioSetting: string;
+    videoSetting: string;
+    screenshareSetting: string;
+    chatSetting: string;
+    updateAudioSetting: (setting: string) => void;
+    updateVideoSetting: (setting: string) => void;
+    updateScreenshareSetting: (setting: string) => void;
+    updateChatSetting: (setting: string) => void;
+    updateIsSettingsModalVisible: (isVisible: boolean) => void;
+    roomName: string;
+    socket: Socket;
+    showAlert?: ShowAlert;
+    audioState: string;
+    videoState: string;
+    screenshareState: string;
+    chatState: string;
+    faTimes: import("@fortawesome/fontawesome-common-types").IconDefinition;
+    constructor(modifySettingsService: ModifySettings);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    updateStatesFromParameters(): void;
+    getModalContentStyle(): {
+        backgroundColor: string;
+        borderRadius: string;
+        padding: string;
+        width: string;
+        maxHeight: string;
+        overflowY: string;
+        top: string;
+        bottom: string;
+        left: string;
+        right: string;
+    };
+    handleSaveSettings(): Promise<void>;
+    closeModal(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<EventSettingsModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EventSettingsModal, "app-event-settings-modal", never, { "isEventSettingsModalVisible": { "alias": "isEventSettingsModalVisible"; "required": false; }; "onEventSettingsClose": { "alias": "onEventSettingsClose"; "required": false; }; "onModifyEventSettings": { "alias": "onModifyEventSettings"; "required": false; }; "position": { "alias": "position"; "required": false; }; "backgroundColor": { "alias": "backgroundColor"; "required": false; }; "audioSetting": { "alias": "audioSetting"; "required": false; }; "videoSetting": { "alias": "videoSetting"; "required": false; }; "screenshareSetting": { "alias": "screenshareSetting"; "required": false; }; "chatSetting": { "alias": "chatSetting"; "required": false; }; "updateAudioSetting": { "alias": "updateAudioSetting"; "required": false; }; "updateVideoSetting": { "alias": "updateVideoSetting"; "required": false; }; "updateScreenshareSetting": { "alias": "updateScreenshareSetting"; "required": false; }; "updateChatSetting": { "alias": "updateChatSetting"; "required": false; }; "updateIsSettingsModalVisible": { "alias": "updateIsSettingsModalVisible"; "required": false; }; "roomName": { "alias": "roomName"; "required": false; }; "socket": { "alias": "socket"; "required": false; }; "showAlert": { "alias": "showAlert"; "required": false; }; }, {}, never, never, true, never>;
+}