Live JavaScript v1
Live JavaScript
Live
JavaScript
Home
/
Live
/
JavaScript
/
UIKit

Host a live event

When a live event is created, or a user enters a live event as a host, HostView is opened. HostView can display the host’s media stream, multiple options to configure the live event, and a chat where the host and participants can send messages.

Users included in userIdsForHost can enter the live event one at a time to host. Once they have entered, they can start the live event as a host and stream video and audio during the live event.

Note: Before starting the live event, you can test your media stream and devices on your own using liveEvent.startStreaming. Participants can receive your media stream when you start the live event by calling the liveEvent.startEvent() method.

The following table lists the features included in HostView.

List of features

FeatureDescription

Enter a live event as a host

Allows a user who had already been selected as one of the users who can be a host to enter a live event as the host.

Set up a live event

Allows the host to choose the audio and video settings for the live event.

Manage live event settings

Allows the host to turn on or off video and audio, hide the chat, and change the title and cover image of the event.

Use the chat and moderate chat activity

Allows the host to chat with participants and freeze the chat to prohibit inappropriate activity when needed.

Change live event status

Allows the host to update the live event status. A host can start the event, exit the live event without ending the event, and end the live event. A host may opt to view a summary of the live event metrics after ending the event.


Customization

The following table lists a set of customizable properties of HostView. These properties can be set in the customize.HostView object in the App component's props.

Property nameTypeDescription

showDuration

boolean

Determines whether to display the duration of a live event in the view. If set to true, the duration of the live event is displayed. (Default: true)

onEndEventClick

(props: { onClick: () => void }) => void

Called when a host clicks the exit button. By default, a host is given the choice to end or leave without ending the live event. (Default: null)

showStatusLabel

boolean

Determines whether to display the live event status in the view. If set to true, the live event status is displayed. (Default: true)

showParticipantCount

boolean

Determines whether to display the number of participants in real time. If set to true, the number of views is displayed. (Default: true)

allowExitWithoutEnding

boolean

Determines whether the host can exit the live event without ending the event. If set to true, the host can exit the event without ending the streaming and the chat. (Default: true)

showEventSummary
View

boolean

Determines whether to show a summary of the live event after the event has ended. If set to true, a summary of the live event is displayed. (Default: true)

String set

The following table lists the properties of stringSet you can customize to modify the live event’s host view.

CategoryKeyString

Create view

COVER_IMAGE

Cover image

Create view

TITLE

Title

Create view

UPLOAD_IMAGE

Upload photo

Create view

USERS_FOR_HOST

Users who can be host

Host view

CHANGE_EVENT_INFO_TITLE

Edit live event information

Host view

CREATED_AT

Created on

Host view

CREATED_BY

Created by

Host view

FREEZE_CHAT

Freeze chat

Host view

FREEZE_CHAT_DESCRIPTION

Only operators can send a message. This doesn't stop the live event.

Host view

LIVE_EVENT_INFORMATION_TITLE

Live event information

Host view

USERS_FOR_HOST_DESCRIPTION

Any one of the users in the list below can act as a host for the live event. If the current host leaves the event, another user can act as the host.

Host view

DURATION

Duration

Host view

EDIT_LIVE_EVENT_USERS_FOR_HOST

Users who can be host

Host view

HOST

Host

Host view

HOSTS

Host

Host view

HOST_LABEL

Host

Host view

LIVE_EVENT_END_DIALOG_OPTION_END

End live event

Host view

LIVE_EVENT_END_DIALOG_OPTION_EXIT

Exit without ending

Host view

LIVE_EVENT_ID

Live event ID

Host view

LIVE_EVENT_MESSAGE_INPUT_PLACEHOLDER

Enter message

Host view

LIVE_EVENT_SUMMARY_DIALOG_TITLE

Live event ended

Host view

PEAK_CONCURRENT_PARTICIPANTS_COUNT

Peak concurrent participants

Host view

START_LIVE_EVENT_HEADER_BUTTON

Start live event

Host view

STARTED_AT

Started on

Host view

STARTED_BY

Started by

Host view

TOTAL_PARTICIPANTS_COUNT

Total participants

Live event information

PARTICIPANTS

Participants

Live event information

PARTICIPANT_LIST_HEADER_TITLE

Participants