Getting Started

How to use?

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

• Installation
• Initialization JetstreamPlayer

Installation

Jetstrem player API can be installed in an existing project via npm.

npm i @hopecloud/jetstream-player

Once installed, you will be able to import JetstreamPlayer class and main.css styles from the library into your component

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

@import '@hopecloud/jetstream-player/dist/main.css';

Initialization JetstreamPlayer

Important ☝️⬇️

In order to connect our iframe with JetstreamPlayer class, we need determines which player exactly you want to interact with. We should somehow distinguish between embedded windows in our template. Since we can have one or many iframes.

For example:

<div id="player1" />
<div id="player2" />

const player1 = new JetstreamPlayer('#player1');
const player2 = new JetstreamPlayer('#player2');

WARNING

If you're using framework like Vue.js you should make sure that DOM has been mounted!

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

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

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

Using with TypeScript

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