# Stream loading states

## Overview

If you wish to know more about the stream loading state, or even build your own loading UI, you can watch for MessageChannel event payloads with `type == "stream-loading-state"`. Each will contain a `value` field with one of the following values:

*Note: Percentage is provided to help indicate how far through the loading process each state is*

* `play-button-clicked` - If you are using our loading screen, the user has selected the "Join" button
* `received-video-frames` - Stream has received at least 60 frames or 1MB of video data - 110%
* `ready` - Pixel stream player is ready and playing - 100%
* `webrtc-connected` - WebRTC is connected to the Unreal Engine game client - 90%
* `webrtc-connecting` - WebRTC is connecting to the Unreal Engine game client - 75%
* `unreal-client-started` - Unreal Engine game client has started - 50%
* `waiting-for-compute` - Waiting for a compute node on which to run the Unreal Engine game client - 25%

### Additional Info

There's also the `additionalInfo` field which is a map of extra contextual information. Here's the possible values:

* `isRefresh: boolean`- Informs whether this state change occurred as part of a browser refresh or not.

## Example payload

```json
{
  "type": "stream-loading-state",
  "value": "ready"
  "additionalInfo": {
    "isRefresh": false
  }
}
```