Skip to main content

Video playback

We know how crucial video is for digital signage. So we made it easy. This guide will walk you through playing video using the sos.video API. This allows you to play video natively on any platform.

The sos.video provides you 4 methods to handle the playback:

warning

First 5 parameters (uri, x, y, width, height) are unique identifiers for playing the video using play, stop, resume and pause methods.

  • play() - This method loads the video into memory (if it haven't been loaded previously) and starts the video playback.
  • pause() / resume() - This method pauses the video which was previously started to play, it is possible to resume the playback with resume().
  • stop() - This method stops the playback and unloads the video from memory.
  • prepare() - Prepare will load the video into memory and prepares it for immediate playback.

Simple video playback example​

const { filePath } = await sos.offline.cache.loadOrSaveFile(
	'video-1.mp4',
	'https://static.signageos.io/assets/video-test-1_e07fc21a7a72e3d33478243bd75d7743.mp4',
);

const video = [filePath, 0, 0, 1280, 720];

await sos.video.play(...video);

// pause the video after 2s
setTimeout(() => sos.video.pause(...video), 2000);

// resume the paused video
setTimeout(() => sos.video.resume(...video), 2500);

// stop and unload the video
setTimeout(() => sos.video.stop(...video), 4000);

Gapless video playback​

It is often desirable to be able to play different videos consecutively without "black" frames. To achieve this next video in queue needs to be loaded before the current video ends. How to achieve this may differ from platform to platform. Applet JS SDK handles this under the hood and provides you with prepare(), play() and stop() methods.

Each video has to be pre-loaded with prepare() while previous video is still playing and after the video ends it should be unloaded immediately with stop(). This is because some (especially older ones) platforms support that only 2 videos are loaded into memory at any time (one playing and one ready to play).

Gapless video playback lifecycle

Video playback events​

Besides the methods for video playback, the sos.video API also provides methods for binding event listeners to specific events of video playback. Those methods are described in detail in the API reference

Examples​