MediaSFU Angular
    Preparing search index...

    Class RecordingModal

    RecordingModal - Modal for configuring and controlling session recording

    Provides recording configuration controls including record type (video/audio/both), format, text overlay, and HLS streaming. Includes Standard (quick start) and Advanced (detailed settings) panels.

    Supports three levels of customization:

    1. Basic Usage: Use default modal UI with Standard/Advanced panels
    2. Style Customization: Override modal appearance with overlayStyle and contentStyle
    3. Full Override: Provide a custom template via customTemplate for complete control

    Key Features:

    • Recording type selection (video, audio, all)
    • Custom text overlay with positioning and color
    • HLS streaming toggle
    • Pause/resume recording
    • Standard vs Advanced configuration modes

    app-recording-modal

    true

    CommonModule, FontAwesomeModule, StandardPanelComponent, AdvancedPanelComponent

    isRecordingModalVisible - Whether the modal is currently visible. Default: false

    onClose - Callback function to close the modal. Default: () => {}

    backgroundColor - Background color of the modal content. Default: '#83c0e9'

    position - Modal position on screen ('topRight', 'bottomRight', etc.). Default: 'bottomRight'

    confirmRecording - Callback to confirm and start recording. Default: () => {}

    startRecording - Callback to initiate recording with current settings. Default: () => {}

    parameters - Object containing recording settings and update functions. Default: {}

    overlayStyle - Custom CSS styles for the modal overlay backdrop. Default: undefined

    contentStyle - Custom CSS styles for the modal content container. Default: undefined

    customTemplate - Custom TemplateRef to completely replace default modal template. Default: undefined

    ngOnChanges - Updates recording parameters when modal visibility changes

    confirm - Validates and confirms recording settings

    start - Initiates recording with configured settings

    getCombinedOverlayStyle - Merges default and custom overlay styles

    getCombinedContentStyle - Merges default and custom content styles

    modalContainerStyle - Returns computed overlay styles

    modalContentStyle - Returns computed content styles

    Implements

    • OnChanges
    Index

    Accessors

    modalContainerStyle modalContentStyle

    Constructors

    constructor

    Methods

    ngOnChanges confirm start getCombinedOverlayStyle getCombinedContentStyle

    Properties

    isRecordingModalVisible onClose backgroundColor position confirmRecording startRecording parameters overlayStyle? contentStyle? customTemplate? faTimes faCheck faPlay

    Accessors

    • get modalContainerStyle(): {
          position: string;
          top: number;
          left: number;
          width: string;
          height: string;
          backgroundColor: string;
          display: string;
          zIndex: number;
      }

      Returns {
          position: string;
          top: number;
          left: number;
          width: string;
          height: string;
          backgroundColor: string;
          display: string;
          zIndex: number;
      }

    • get modalContentStyle(): {
          position: string;
          backgroundColor: string;
          borderRadius: string;
          padding: string;
          width: string;
          maxHeight: string;
          overflowY: string;
          top: string;
          bottom: string;
          left: string;
          right: string;
      }

      Returns {
          position: string;
          backgroundColor: string;
          borderRadius: string;
          padding: string;
          width: string;
          maxHeight: string;
          overflowY: string;
          top: string;
          bottom: string;
          left: string;
          right: string;
      }

    Constructors

    Methods

    • A callback method that is invoked immediately after the default change detector has checked data-bound properties if at least one has changed, and before the view and content children are checked.

      Parameters

      • changes: SimpleChanges

        The changed properties.

      Returns void

    Properties

    isRecordingModalVisible: boolean = false
    onClose: () => void
    backgroundColor: string = '#83c0e9'
    position: string = 'bottomRight'
    confirmRecording: (options: ConfirmRecordingOptions) => void
    startRecording: (options: StartRecordingOptions) => void
    parameters: RecordingModalParameters = ...
    overlayStyle?: Partial<CSSStyleDeclaration>
    contentStyle?: Partial<CSSStyleDeclaration>
    customTemplate?: any
    faTimes: IconDefinition = faTimes
    faCheck: IconDefinition = faCheck
    faPlay: IconDefinition = faPlay

    Settings

    Member Visibility

    On This Page

    Accessors
    Constructors
    Methods
    Properties