Skip to content

Getting Started

How to use?

If you want to use the library in your project, you need to perform the following steps:

  • Installation
  • Initialization of JetstreamPlayer

Installation

The Jetstream Player API can be installed in an existing project via npm.

js
npm i @hopecloud/jetstream-player

Once installed, you can import the JetstreamPlayer class into your component.

js
import { JetstreamPlayer } from '@hopecloud/jetstream-player';

Initialization JetstreamPlayer

Important ☝️⬇️

To connect the iframe with the JetstreamPlayer class, you need to determine which player you want to interact with. You should distinguish between embedded windows in your template, since you can have one or many iframes.

For example:

html
<div id="player1" />
<div id="player2" />
js
const player1 = new JetstreamPlayer('#player1', { mediaId: 'jsv:xxxxxxxxxx' });
const player2 = new JetstreamPlayer('#player2', { mediaId: 'jsv:yyyyyyyyyy' });

WARNING

If you're using a framework like Vue.js, make sure the DOM has been mounted.

After that, the library will generate the iframe, and you can access the player variable and call the methods available in the JetstreamPlayer class.

js
const player = new JetstreamPlayer('#player', {
  mediaId: 'jsv:xxxxxxxxxx',
  events: {
    ready: function (value) {
      // ...do stuff
    };
  },
});

You can find all available methods and events and options in the following sections.

Using with TypeScript

The library is written in TypeScript and provides first-class TypeScript support. The package comes with bundled type declarations that should work out of the box.