Interface CollapsedStateOptions

The configuration used to customize the MediaPanel in the collapsed state. Setting values here will override the values set in the parent MediaPanelConfiguration.

Hierarchy

  • BaseCollapsedStateOptions
    • CollapsedStateOptions

Properties

elements showWrapper

Properties

elements

elements: {
    activeUsersCount: {
        position: number;
        show: boolean;
        showIcon: boolean;
    };
    avatarList: {
        maxAvatars: 5;
        position: number;
        show: boolean;
    };
    joinButton: {
        position: number;
        show: boolean;
        showIcon: boolean;
        showText: boolean;
    };
    leaveButton: {
        position: number;
        show: boolean;
        showIcon: boolean;
        showText: boolean;
    };
    microphoneButton: {
        position: number;
        show: boolean;
    };
    startButton: {
        position: number;
        show: boolean;
        showIcon: boolean;
        showText: boolean;
    };
}

Elements of the collapse state You can order, hide and customize text and icons

Type declaration

  • activeUsersCount: {
        position: number;
        show: boolean;
        showIcon: boolean;
    }
    • position: number

      Relative position of the element from left to right

      Default Value

      3

    • show: boolean

      Show the active number of users present in the audio call

      Default Value

      true

    • showIcon: boolean

      Show the icon To customize the icon, see ThemeConfiguration.icons.usersCount

      Default Value

      true

  • avatarList: {
        maxAvatars: 5;
        position: number;
        show: boolean;
    }
    • maxAvatars: 5

      Maximum number of avatars that are shown. After that, the rest is shown as "+99 others".

      Default Value

      5

    • position: number

      Relative position of the element from left to right

      Default Value

      5

    • show: boolean

      Show the active user avatar list

      Default Value

      true

  • joinButton: {
        position: number;
        show: boolean;
        showIcon: boolean;
        showText: boolean;
    }
    • position: number

      Relative position of the element from left to right

      Default Value

      2

    • show: boolean

      Show the explicit join button

      Default Value

      true

    • showIcon: boolean

      Show the icon To customize the icon, see ThemeConfiguration.icons.join

      Default Value

      true

    • showText: boolean

      Show the text string To customize text, see MediaPanelConfiguration.strings.joinButton

      Default Value

      true

  • leaveButton: {
        position: number;
        show: boolean;
        showIcon: boolean;
        showText: boolean;
    }
    • position: number

      Relative position of the element from left to right

      Default Value

      '6'

    • show: boolean

      Show the explicit leave button

      Default Value

      false

    • showIcon: boolean

      Show the icon To customize the icon, see ThemeConfiguration.icons.close

      Default Value

      true

    • showText: boolean

      Show the text string To customize the text, see MediaPanelConfiguration.strings.leaveButton

      Default Value

      true

  • microphoneButton: {
        position: number;
        show: boolean;
    }
    • position: number

      Relative position of the element from left to right

      Default Value

      4

    • show: boolean

      Show the audio Microphone on/off quick access button

      Default Value

      true

  • startButton: {
        position: number;
        show: boolean;
        showIcon: boolean;
        showText: boolean;
    }
    • position: number

      Relative position of the element from left to right

      Default Value

      1

    • show: boolean

      Show the explicit start conversation button when there is NO user on the call

      Default Value

      true

    • showIcon: boolean

      Show the icon To customize the icon, see ThemeConfiguration.icons.join

      Default Value

      true

    • showText: boolean

      Show the text string To customize text -> MediaPanelConfiguration.strings.startButton

      Default Value

      true

showWrapper

showWrapper: boolean

If showWrapper is false, main border and background will not be rendered.

Default Value

true