Home
  • 05 Apr 2024

Home


The content is currently unavailable in German. You are viewing the default English version.
Artikel-Zusammenfassung

About

The movingimage Player has a JavaScript API that lets you control the player, track usage, and collect analytics.

With the JavaScript API, you can:

  • Add, remove, or connect to a player using the VideoPlayerCollection

  • Control basic player functions, such as play, pause, and stop

  • Register functions to player events to collect usage statistics or add interactive functionality

Note: If lazy loading is enabled, the Player will not be accessible through the API until a user clicks play. This is because lazy loading prevents the Player from loading until needed.

Getting Started with the JavaScript API

Prerequisites

  • VideoManager Pro: Check your lazy loading setting (listed under the Player's "Additional Settings") - if lazy loading is enabled, the Player (including the API) will not load until a user clicks play.

  • Embed codes: Find the video embed code in your VideoManager Pro account in the Publish view. It will look like this:

    <div mi24-video-player video-id="4Zo1QNH5FKxQDLsgKBpvD8"
    player-id="2X32X_p31xVFCpkY7KoDhj" config-type="vmpro"
    flash-path="//e.video-cdn.net/v2/" api-url="//d.video-cdn.net/play">
    </div><script src="//e.video-cdn.net/v2/embed.js"></script>

Alternatively, you can use the embed-codes endpoint of the of the movingimage REST API.

Embed Codes

Each embed code includes the JavaScript source, which is needed to make the embed code work. However, it only needs to be added to the page once, regardless of how many videos are embedded.

The embed code also includes a <div> element that contains the mi24-video-player tag and the following attributes:

  • video-id: A unique string identifying the video that will be embedded.

  • player-id: A unique string identifying the Player that the embedded video will use.

  • config-type: Indicates the VideoManager type the embed code is for.

  • flash-path: The flash path of the Player.

  • api-url: The URL of the API.

To use the JavaScript API:

  1. Add the embed code to your page.

  2. Use the video and player IDs to reference the Player in JavaScript.

Tips:

  • Use the second option for adding the Player, which auto-loads the Player as soon as it is available.

  • Find the video and player IDs in the metadata accordion menu of the video or Player in VideoManager Pro.

Video and Player IDs

The video and player IDs are required embed code attributes. All of the videos and Players from a VideoManager have their own unique IDs. The embed code for every video will include a video-id and a player-id.

Embed code

Description

video-id

A unique string used to identify and differentiate each video.

player-id

A unique string used to identify and differentiate each Player.

Tips:

  • We highly recommend using the second option for adding the Player, which auto-loads the Player as soon as it is available. The first option should only be used when you wish to add the Player manually.

  • You can find the video and player IDs in the metadata accordion menu of the video or Player in VideoManager Pro.


War dieser Artikel hilfreich?