# Client Events Guide
This serves as a guide to events emitted by the javascript via the embed events
hook, as described below in [Viewer Events](#viewer-events).
## Table of Contents
- [Viewer Events](#viewer-events)
- [Viewer Network Events](#viewer-network-events)
- [Event List](#event-list)
- [Index](#index)
- [Events](#events)
## Viewer Events
_Viewer Events_ are emitted when the viewer performs certain actions.
They can be subscribed to using the `events` parameter in
`Coral.createStreamEmbed`.
```html
```
Example events:
- `setMainTab {tab: "PROFILE"}`
- `showFeaturedCommentTooltip`
- `viewConversation {from: "FEATURED_COMMENTS", commentID: "c45fb5f5-03f9-49a3-a755-488c698ca0df"}`
### Viewer Network Events
_Viewer Network Events_ are events that involves a network request and thus can succeed or fail. Succeeding events will have a `.success` appended to the event name while failing events have an `.error` appended to the event name.
Moreover _Viewer Network Events_ contains the `rtt` field which indicates the time it needed from initiating the request until the _UI_ has been updated with the response data.
Example events:
```
createComment.success
{
body: "Hello world!",
storyID: "238b95ec-2b80-43f4-ab68-a6ea1f4e2584",
rtt: 307,
success: {
id: "6fecfb11-4d0f-4edc-89b7-878a9928addd"
status: "APPROVED"`
}
}
```
```
createComment.error
{
body: "Hi!",
storyID: "238b95ec-2b80-43f4-ab68-a6ea1f4e2584",
rtt: 229,
error: {
code: "COMMENT_BODY_TOO_SHORT"
message: "Comment body must have at least 10 characters."
}
}
```
## Event List
### Index
- approveComment
- banUser
- cancelAccountDeletion
- changeEmail
- changePassword
- changeUsername
- closeStory
- copyPermalink
- createComment
- createCommentFocus
- createCommentReaction
- createCommentReply
- editComment
- featureComment
- gotoModeration
- ignoreUser
- loadMoreAllComments
- loadMoreFeaturedComments
- loadMoreHistoryComments
- loginPrompt
- openSortMenu
- openStory
- rejectComment
- removeCommentReaction
- removeUserIgnore
- replyCommentFocus
- reportComment
- requestAccountDeletion
- requestDownloadCommentHistory
- resendEmailVerification
- setCommentsOrderBy
- setCommentsTab
- setMainTab
- setProfileTab
- showAbsoluteTimestamp
- showAllReplies
- showAuthPopup
- showEditEmailDialog
- showEditForm
- showEditPasswordDialog
- showEditUsernameDialog
- showFeaturedCommentTooltip
- showIgnoreUserdDialog
- showModerationPopover
- showMoreOfConversation
- showMoreReplies
- showReplyForm
- showReportPopover
- showSharePopover
- showUserPopover
- signOut
- unfeatureComment
- updateNotificationSettings
- updateStorySettings
- viewConversation
- viewFullDiscussion
- viewNewComments
### Events
- : This event is emitted when the viewer approves a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **banUser.success**, **banUser.error**: This event is emitted when the viewer bans a user.
```ts
{
userID: string;
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **cancelAccountDeletion.success**, **cancelAccountDeletion.error**: This event is emitted when the viewer cancels the account deletion.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **changeEmail.success**, **changeEmail.error**: This event is emitted when the viewer changes its email.
```ts
{
oldEmail: string;
newEmail: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **changePassword.success**, **changePassword.error**: This event is emitted when the viewer changes its password.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **changeUsername.success**, **changeUsername.error**: This event is emitted when the viewer changes its username.
```ts
{
oldUsername: string;
newUsername: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **closeStory.success**, **closeStory.error**: This event is emitted when the viewer closes the story.
```ts
{
storyID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **copyPermalink**: This event is emitted when the viewer copies the permalink with the button.
```ts
{
commentID: string;
}
```
- : This event is emitted when a top level comment is created.
```ts
{
storyID: string;
body: string;
success: {
id: string;
status: COMMENT_STATUS;
};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer focus on the RTE to create a comment.
- : This event is emitted when the viewer reacts to a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when a comment reply is created.
```ts
{
body: string;
parentID: string;
success: {
id: string;
status: COMMENT_STATUS;
};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer edits a comment.
```ts
{
body: string;
commentID: string;
success: {
status: COMMENT_STATUS;
};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer features a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **gotoModeration**: This event is emitted when the viewer goes to moderation.
```ts
{
commentID: string;
}
```
- **ignoreUser.success**, **ignoreUser.error**: This event is emitted when the viewer ignores a user.
```ts
{
userID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer loads more top level comments into the comment stream.
```ts
{
storyID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer loads more featured comments.
```ts
{
storyID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer loads more top level comments into the history comment stream.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **loginPrompt**: This event is emitted when the viewer does an action that will prompt a login dialog.
- : This event is emitted when the viewer clicks on the sort menu.
- **openStory.success**, **openStory.error**: This event is emitted when the viewer opens the story.
```ts
{
storyID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer rejects a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer removes its reaction from a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **removeUserIgnore.success**, **removeUserIgnore.error**: This event is emitted when the viewer remove a user from its ignored users list.
```ts
{
userID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer focus on the RTE to reply to a comment.
- : This event is emitted when the viewer reports a comment.
```ts
{
reason: string;
commentID: string;
additionalDetails?: string | undefined;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **requestAccountDeletion.success**, **requestAccountDeletion.error**: This event is emitted when the viewer requests to delete its account.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer requests to download its comment history.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **resendEmailVerification.success**, **resendEmailVerification.error**: This event is emitted when the viewer request another email verification email.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer changes the sort order of the comments.
```ts
{
orderBy: string;
}
```
- : This event is emitted when the viewer changes the tab of the comments tab bar.
```ts
{
tab: string;
}
```
- **setMainTab**: This event is emitted when the viewer changes the tab of the main tab bar.
```ts
{
tab: string;
}
```
- **setProfileTab**: This event is emitted when the viewer changes the tab of the profile tab bar.
```ts
{
tab: string;
}
```
- **showAbsoluteTimestamp**: This event is emitted when the viewer clicks on the relative timestamp to show the absolute time.
- **showAllReplies.success**, **showAllReplies.error**: This event is emitted when the viewer reveals all replies of a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer requests the auth popup.
```ts
{
view: string;
}
```
- **showEditEmailDialog**: This event is emitted when the viewer opens the edit email dialog.
- **showEditForm**: This event is emitted when the viewer opens the edit form.
```ts
{
commentID: string;
}
```
- **showEditPasswordDialog**: This event is emitted when the viewer opens the edit password dialog.
- **showEditUsernameDialog**: This event is emitted when the viewer opens the edit username dialog.
- : This event is emitted when the viewer clicks to show the featured comment tooltip.
- **showIgnoreUserdDialog**: This event is emitted when the viewer opens the ignore user dialog.
- **showModerationPopover**: This event is emitted when the viewer opens the moderation popover.
```ts
{
commentID: string;
}
```
- **showMoreOfConversation.success**, **showMoreOfConversation.error**: This event is emitted when the viewer reveals more of the parent conversation thread.
```ts
{
commentID: string | null;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **showMoreReplies**: This event is emitted when the viewer reveals new live replies.
```ts
{
commentID: string;
count: number;
}
```
- **showReplyForm**: This event is emitted when the viewer opens the reply form.
```ts
{
commentID: string;
}
```
- **showReportPopover**: This event is emitted when the viewer opens the report popover.
```ts
{
commentID: string;
}
```
- **showSharePopover**: This event is emitted when the viewer opens the share popover.
```ts
{
commentID: string;
}
```
- **showUserPopover**: This event is emitted when the viewer clicks on a username which shows the user popover.
```ts
{
userID: string;
}
```
- **signOut.success**, **signOut.error**: This event is emitted when the viewer signs out.
```ts
{
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- : This event is emitted when the viewer unfeatures a comment.
```ts
{
commentID: string;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **updateNotificationSettings.success**, **updateNotificationSettings.error**: This event is emitted when the viewer updates its notification settings.
```ts
{
onReply?: boolean | null | undefined;
onFeatured?: boolean | null | undefined;
onStaffReplies?: boolean | null | undefined;
onModeration?: boolean | null | undefined;
digestFrequency?: "NONE" | "DAILY" | "HOURLY" | null | undefined;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **updateStorySettings.success**, **updateStorySettings.error**: This event is emitted when the viewer updates the story settings.
```ts
{
storyID: string;
live?: {
enabled?: boolean | null | undefined;
} | null | undefined;
moderation?: "POST" | "PRE" | null | undefined;
premodLinksEnable?: boolean | null | undefined;
messageBox?: {
enabled?: boolean | null | undefined;
icon?: string | null | undefined;
content?: string | null | undefined;
} | null | undefined;
success: {};
error: {
message: string;
code?: string | undefined;
};
}
```
- **viewConversation**: This event is emitted when the viewer changes to the single conversation view.
```ts
{
from: "FEATURED_COMMENTS" | "COMMENT_STREAM" | "COMMENT_HISTORY";
commentID: string;
}
```
- **viewFullDiscussion**: This event is emitted when the viewer exits the single conversation.
```ts
{
commentID: string | null;
}
```
- : This event is emitted when the viewer reveals new live comments.
```ts
{
storyID: string;
count: number;
}
```