Skip to content

Managing timecodes

One of the key features of Ease Live is the ability to synchronize the broadcast graphics with the video playing behind it. This is brilliant for spoiler prevention.

Ease Live makes it possible by processing timecodes that are distributed together with the video.

New to video timecodes? Learn more about it here.

Ease Live has timecodes enabled by default. This means that your UI will automatically sync the graphics and the video for you. This is a key feature e.g. when displaying live in-game sports stats.

Adjusting timecode offset

Even if your video stream has timecodes, it is not guaranteed that the timing is 100% accurate. The best case scenario is timing being carried from the cameras at the stadium all the way out to the end-user's device. Not everyone is able to pull that off. This is why the timing data is sometimes added to the video further down the distribution, like at the encoder level.

If there's a 10 second distribution time between the stadium and the encoder, this delay will manifest itself in the UI. It means the graphics will be displayed on screen 10 seconds too late.

Ease Live addresses this by providing you with a timecode offset value that you can change at any time.

An offset is the number of seconds you want to adjust the timecode back in time, or forward in time.

Examples:

  • If the events are displaying 5 seconds too late in your stream, you need to add 5 seconds to the offset.
  • If the events are displaying 5 seconds too early in your stream, you need to subtract 5 seconds from the offset.

When you add 5 seconds to the timecode, Ease Live will calculate the time as 5 seconds ahead of the original timecode. E.g 11:00:00 becomes 11:00:05. Thus your events will display 5 seconds earlier because Ease Live's clock is ahead of the video.

Disabling timecodes

Why would you want to turn it off? There are to main use cases:

  • Dirty rendering: If you're using Ease Live in a traditional broadcast setup with broadcast graphics included in the video distribution. For those use cases you want the graphics to be rendered as fast as possible.

  • No timecodes available: Sometimes you might not have timecodes available in your video distribution. For those use cases you can turn it off and just display graphics in real time instead of being synchronized with the video.

How to do it

Timecodes can be adjusted on a project or program level basis. The settings on project level will be carried over to all programs within this project. In other words, you only need to set it once if your video distribution is stable.

Project timecode settings

Navigate to any project on your account, and you will find a timecode status button just below the header bar. For new projects, it will simply say "Timecodes on":

Project timecodes

Note

A project will always start with timecodes enabled and timecode offset set to 0 seconds.

Stream timecode offsets

If your project has multiple different streams per program, you may need to set offsets individually to correct timing differences. For this usecase, you have the stream timecode offsets section under project and program timecode settings, where you setup stream IDs to match and their offsets.

A stream ID is a fully custom ID that will be unique within your project. In addition to the stream name, it is recommended to include any other differentiating factors in the ID. Example: <stream>:<format>channel-4:dash special-event:hls

In order for this to work, you will need to pass the streamId to our SDKs on each platform where you want it to be used. See the API documentation for your platform for more information.

If the stream ID you passed to the SDK is not found in the timecode settings, it will use the closest valid setting, in the order described in the Timecode settings priority section.

Program timecode settings

Sometimes it's not enough to set adjust timecode settings on a project level. Maybe a particular program has an unexpected timecode delay. You don't want to change the timecode offset for the entire project because of one program, that might mess with the other programs that are running fine.

For this scenario we have program level adjustments. The settings are exactly the same as at project level, however the changes will only be applied to the specific program you're working on.

Program timecodes

Timecode settings priority

Timecode settings will be chosen in the following order, cascading until it finds a match:

  1. Program: Stream timecode offset (if overriding with matching stream)
  2. Project: Stream timecode offset (if matching stream)
  3. Program: Timecode offset|enabled (if overriding)
  4. Project: Timecode offset|enabled

Confirm changes

Since timecode settings are critical to the way Ease Live works, we ask you to confirm your changes before they are saved.

You can decide if you want to apply the changes to only new sessions or new and active sessions.

A new session means the changes will be in effect for new visits after the save.

Active sessions are users that are already watching the video and have the overlays loaded in already on their devices. When you confirm, these active sessions will immediately receive the timecode changes. No reload required.

Confirm changes

Advanced

Fixed timecode settings

If you want to make sure that the timecode settings are fixed and cannot be modified using the popups above, you can go into Project settings and modify the Production URL under Project environments.

  • To force enable or disable timecodes, use timecodeSupport=true|false.
  • To force a timecode offset of 1 second, use timecodeOffset=1000 (milliseconds)

You can add them as parameters to the Bridge SDK, like this:

javascript
// Web SDK example
easeLive.init({
  accountId: '<account_id>',
  programId: '<program_id>',
  params: {
    timecodeSupport: true,
    timecodeOffset: 1000
  }
})

Or if you're embedding the URL directly in vMix etc, you can add them as query parameters to the end of it, like this:

<YOUR_URL>&timecodeSupport=true&timecodeOffset=1000

If one of these query parameters are present in the URL, you'll get a warning about it in the timecode settings popups: