Skip to main content

API playback layout changes

· 2 min read
Stefan Benicke

We've made changes to the API playbacks layout that you need to be aware of!

tl;dr
  • Playback videos will use object-fit setting of its layout box
  • In "auto" layout, the object-fit is "auto" which most of the times means "cover" - in contrast to former "contain"!
  • To get the old behaviour, you have to set a layout with object-fit "contain"

Layout object-fit

There are currently 3 types available for object-fit.

"cover" fully fills the box with the video content. This means that the video is zoomed and oversized parts will be cropped.

"contain" displays the whole video content inside the box. Black bars might appear.

"auto" is a special type. It translates to default "cover", but "contain" for narrow portrait video content.

What has changed

So far, playbacks have always been shown using object-fit "contain" and there was no way of changing it.

From now on, playback makes use of the object-fit setting of its layout box. The default object-fit is "auto", which in most cases will zoom the video and crop oversized parts.

What can I do?

If you want show the whole video content inside the box (black bars might appear), you need to set a layout with object-fit "contain" for the box where the playback is shown.

Here's an example:

curl -X POST \
-d "playback[audio]=true" \
-d "playback[play_id]=demo-video" \
-d "playback[url]=https://..." \
https://api.eyeson.team/rooms/<ACCESS_KEY>/playbacks

curl -X POST \
-d "layout=auto" \
-d "name=playback-layout" \
-d "users[]=demo-video" \
-d "users[]=" \
-d "map="[[320,0,640,360,\"contain\"],[320,360,640,360,\"auto\"]]"
https://api.eyeson.team/rooms/<ACCESS_KEY>/layout

Please note the playback's play_id is the same as the layout's user id.

Read more about the layout map API.

Contact

If you have a question or want to share any feedback, do not hesitate to create a ticket on GitHub.