theoplayer

THEOplayer

THEOplayer is the universal video player solution created by THEO Technologies. It enables you to quickly deliver cross-platform content playback.

Prerequisites

• A valid THEOplayer license. Request yours via our THEOportal.

Included features

The THEOplayer SDK consists of modular features. This package includes the following features: ui, dash, hls, hls-legacy, chromecast, vr, vr-webxr, yospace, airplay, spotx, relatedcontent, social, upnext, conviva, cache, visibility, contextmenu, youbora, mediamelon, ads, moat, texttrackstyle-ui, google-dai, freewheel, activequalitylabel, upcomingadnotification, agama, webaudio, verizonmedia, streamone, lcevc, mediatailor

If you need a different set of features, you can:

• Install a different variant of this package:

  • theoplayer
  • @theoplayer/basic-hesp
  • @theoplayer/basic-hls
  • @theoplayer/basic-dash
  • @theoplayer/basic-hls-dash
  • @theoplayer/extended

  (You should only install one of the above mentioned variants at a time.)

• Make your own custom build via our THEOportal.

Installation

Install using your favorite package manager for Node (such as npm or yarn):

npm install theoplayer

You can also install a specific version instead:

npm install theoplayer@2.82.0

Note that versions earlier than 2.82.0 (release 2021.1.2) are not available on the public npm registry. Earlier versions are available through our THEOportal.

Usage

Add the THEOplayer library to your JavaScript web app:

const THEOplayer = require('theoplayer');

Depending on your choice of module loader, transpiler or bundler, you may need to use an import instead:

import * as THEOplayer from 'theoplayer';

Add the CSS stylesheet for the THEOplayer UI to your HTML page:

<link rel="stylesheet" href="/url/to/node_modules/theoplayer/ui.css" />

Next, create an HTML element that will contain the player:

<div id="theoplayer-container" class="video-js theoplayer-skin"></div>

Finally, create a player instance using the THEOplayer.Player constructor. Pass it the created HTML element and a configuration object.

The configuration object must contain a valid license obtained from THEOportal. See our how-to guides for more information.

// The HTML element
let element = document.querySelector('#theoplayer-container');
// The player configuration
let configuration = {
    // Your license as given by THEOportal.
    license: 'your_theoplayer_license',
    // The URL where other JavaScript files from this package will be hosted on your web server.
    // THEOplayer may need to load these files as Web Workers in order to play certain streams.
    libraryLocation: '/url/to/node_modules/theoplayer/'
};
// Create the player instance
let player = new THEOplayer.Player(element, configuration);

That's it! You should now have a working player on your web page. You can control this player through its UI, or through the player variable's JavaScript API.

Documentation

The documentation for THEOplayer is located on our documentation website. For an example on how to setup THEOplayer, take a look at our Getting started guide.

Support

If you are having issues installing or using the package, first look for existing answers on our documentation website, and in particular our FAQ.

You can also contact our technical support team by following the instructions on our support page. Note that your level of support depends on your selected support plan.

License

The contents of this package are subject to the THEOplayer license.