Vanilla JS Example

Dual-player control surface for Live and VOD

This page follows the repo README guidance for native browser usage: the Gcore player is loaded from the Gcore CDN, the built-in stylesheet is included, and the page uses plain JavaScript for source switching, event logging, and external controls. Repo gcore-videoplayer-js.

Live

Switch between the standard live feed and the low-latency CMAF variant.

Current source Standard latency

Select a stream

UTC time 0000-00-00 00:00:00

Player actions

Plugins: MediaControl keeps the native player UI visible, DvrControls shows the in-player live state, QualityLevels adds quality selection through the gear menu, SourceController makes source reloading predictable, Spinner exposes buffering feedback, BigMuteButton adds a prominent unmute action for muted autoplay, CmcdConfig enables CMCD metadata, and ErrorScreen shows fatal playback errors. Events: ready, play, pause, ended, seek, volumeupdate, fullscreen, and error keep the controls and log synchronized.

VOD

Switch between two VOD playlists while reusing the same external controls and event log.

Current source Blender, Sintel

Select a stream

UTC time 0000-00-00 00:00:00

Player actions

Plugins: this VOD panel uses the same MediaControl, QualityLevels, SourceController, Spinner, BigMuteButton, CmcdConfig, Thumbnails, and ErrorScreen stack so the external buttons can coexist with the built-in control bar. Events: the log focuses on lifecycle and control events, especially play, pause, volumeupdate, seek, ended, and error.