Skip to main content

Skip interval

What you learn​

You're instantiating DIVA Player in your ios front-end and relying on DIVA Back Office as the video streaming source.

The goal of this article is to build the simplest front-end to stream a video from the DIVA Back Office with skip intervals.

Before starting​

  • Ensure the DIVA Back Office instance you rely on is up and running.
  • Ask your video engineers team the <video id> and the related <settings URL>.
  • Ensure the videodata file contains the skip intervals properties: 
    {
     "skipIntervals": [
        {
           "start": 0,   // start in millis from the beginning of the video + trimIn
           "end": 10000, // end in millis from the beginning of the video + trimIn
           "label": "diva_skip_intro", // Key to look into the dictionary (optional, with 'diva_skip_interval_button' as default),
           "autoHide": 5000, // Autohide if not interacted (optional, default 5000)
        }
     ]
    }

Instantiation​

There's no code to add to the Basic instantiation code.

Behaviour​

Skip Intro Button Visibility and Interaction:​

  • When watching a VOD content piece, the "Skip Intro" button is displayed at the start of an intro interval and is usable by the user.
  • When casting content through Chromecast, the "Skip Intro" button is also shown on the casting device, allowing the user to click it from there.

Button Focus and Playback Skipping:​

  • When a skippable intro interval is reached, the "Skip Intro" button is focused, and pressing it advances playback to the end of the interval.

Minimal View Behavior​

  • The "Skip Intro" button is not shown when the player is in minimal view, even during skippable intervals.

Interaction Priority​

  • If the user's interaction overlaps with the "Skip Intro" button, the user's interaction takes precedence, allowing a smooth experience.

Live Content Behavior​

  • For live content, the "Skip Intro" button is not shown when the user is at the live point.
  • If the user is not at the live point and a skippable interval exists, the "Skip Intro" button is displayed, allowing the user to skip the interval.

Native Mobile App Behavior​

  • On native mobile apps (NM), the "Skip Intro" button is displayed in landscape view but hidden in portrait view. Switching back to landscape view resets the autoHide timer.

Pause and Seek Behavior​

  • When the video is paused, the "Skip Intro" button remains visible.
  • If the user seeks to a skippable interval while the video is paused, the "Skip Intro" button appears only after the play button is pressed, with a fade-in animation.
  • If the video is paused while the "Skip Intro" button is displayed, and the player controls fade out, the button remains visible.

Content Skipping Precision​

  • Pressing the "Skip Intro" button skips precisely to the end of the intro, ensuring no part of the main content is skipped.

Button Appearance and Animation​

  • The "Skip Intro" button consistently appears with a fade-in animation when the intro begins, ensuring predictable button display timing.

AutoHide Behavior​

  • If the "Skip Intro" button is not pressed, it automatically hides after a default period of time (5 seconds, configurable), ensuring it doesn’t obstruct the viewing experience.
  • When the video is paused, the autoHide time of the "Skip Intro" button is paused and resumes when the video playback is resumed.

Seek and Skip Visibility​

  • If a user performs a seek action and the landing position is within a skippable interval, the "Skip Intro" button is displayed and the autoHide timer resets to ensure button visibility.

Dictionary​

Ensure the dictionary file contains the relevant keys.

Analytics events​

Find here the available analytics events for the Skip interval.

Accessibility​

Text-to-Speech Announcement for "Skip Intro" Button​

  • When interacting with DIVA, if text-to-speech (TTS) is enabled, DIVA will ensure that the focus is automatically placed on the "Skip Intro" button as soon as it appears.
  • DIVA will announce the presence of the "Skip Intro" button through the TTS system, ensuring the user is aware of the button's availability.

Non-RCU Input Compatibility​

  • DIVA will support alternate input devices such as keyboards or gamepads in addition to the standard remote control unit (RCU).
  • Users interacting with DIVA via non-RCU devices will be able to activate the "Skip Intro" feature seamlessly.

Contrast and Visibility of UI Elements​

  • The "Skip Intro" button, when overlaid on other elements, will maintain a contrast ratio that meets or exceeds WCAG 2.0 AA standards.
  • DIVA will ensure that the button is easily distinguishable from its background for better visibility and accessibility.