Installation

Which flow to choose?

• If you use a bundler (Webpack, Rollup, Vite), choose With NPM. This version supports all browsers.
• Otherwise, choose a CDN :
  • If you do not need to support Internet Explorer 11, we recommend to use via CDN (ESM).
  • Otherwise, choose Via CDN (UMD)

With NPM

1. Install the library into your project

   npm install @enghouse-qumu/player-sdk

2. Add your iframe on the HTML page

   <iframe src="<url-to-presentation>" frameborder="0"></iframe>

3. Add the logic to your application

   import { PlayerSdk } from '@enghouse-qumu/player-sdk';
   
   const iframe = document.querySelector('iframe');
   
   const sdk = new PlayerSdk(iframe);
   
   sdk.addEventListener('timeupdate', (newTime) => {
     console.log('timeupdate', newTime);
   });
   
   sdk.getDuration().then((duration) => {
     console.log('duration', duration);
   });
   
   sdk.play();

Via CDN (UMD)

1. Add your iframe on the HTML page

   • Replace <url-to-presentation> with the URL of a Qumu presentation.

   <iframe src="<url-to-presentation>" frameborder="0"></iframe>

2. Load the JavaScript library

   • Replace <version> with the version of the library you want to use. Get the latest version from https://unpkg.com/@enghouse-qumu/player-sdk

   <script src="https://unpkg.com/@enghouse-qumu/player-sdk@<version>/dist/index.umd.js"></script>

   Caution

   You need to load the script BEFORE your code to interact with the SDK.

3. Add the logic to your application

   <script>
     const iframe = document.querySelector('iframe');
   
     const sdk = new window.playerSdk.PlayerSdk(iframe);
   
     sdk.addEventListener('timeupdate', (newTime) => {
       console.log('timeupdate', newTime);
     });
   
     sdk.getDuration().then((duration) => {
       console.log('duration', duration);
     });
   
     sdk.play();
   </script>

Via CDN (ESM)

1. Add your iframe on the HTML page

   • Replace <url-to-presentation> with the URL of a Qumu presentation.

   <iframe src="<url-to-presentation>" frameborder="0"></iframe>

2. Add the logic to your application

   • Replace <version> with the version of the library you want to use. Get the latest version from https://unpkg.com/@enghouse-qumu/player-sdk

   <script type="module">
     import { PlayerSdk } from 'https://unpkg.com/@enghouse-qumu/player-sdk@<version>/dist/index.modern.mjs'
   
     const iframe = document.querySelector('iframe');
   
     const sdk = new PlayerSdk(iframe);
   
     sdk.addEventListener('timeupdate', (newTime) => {
       console.log('timeupdate', newTime);
     });
   
     sdk.getDuration().then((duration) => {
       console.log('duration', duration);
     });
   
     sdk.play();
   </script>

TypeScript support

This library supports TypeScript by default.