Index

Changelog

Please refer to Changelog

About Web UI

Browser background is transparent by default. Video will be shown under browser/webpage.

Disable scrolling

To disable window scrolling, set position fixed

e.g. body { position: fixed }

About EnableJS

To use JS API inside iframe (iframe and parent frame have to be under the same domain), please access variable ENABLE by using

top.ENABLE

How to Use enablejs.d.ts for Development

Download enablejs.d.ts
Place the File in Your Project
- Place the enablejs.d.ts file in a location where your TypeScript/JavaScript project can access it.
- If you don't have a types directory, create one or place it in another directory where you keep your type definitions.
- A common place is in a types directory at the root of your project:

your-project/
├── src/
│   └── index.js
├── types/
│   └── enablejs.d.ts
└── package.json

Reference the .d.ts File in Your JavaScript
- Add a triple-slash directive at the top of your JavaScript file where you want to use the types from enablejs.d.ts. For example, in index.js:
- Note: The path in the reference directive should be relative to the JavaScript file where you're adding it.

/// <reference path="../types/enablejs.d.ts" />

// Now you can use the types defined in enablejs.d.ts
let player = ENABLE.player.getInstance(0);

Configure Your TypeScript Environment (Optional)
- If you're using TypeScript or a TypeScript-aware IDE, you might want to configure your tsconfig.json to include this file or directory:
- This step ensures that TypeScript automatically includes your custom type definitions when compiling.

{
  "compilerOptions": {
    "typeRoots": ["./types", "./node_modules/@types"]
  }
}

Visual Effects in VS Code

Here's an image demonstrating how your IDE (like Visual Studio Code) will show the effect of having enablejs.d.ts referenced:

Visual Effect in VS Code

You'll see IntelliSense autocompletion, type hints, and error detection based on the definitions in enablejs.d.ts.

About Web Inspector

Install Android ADB tools.
Enable Android Developer options and USB debugging.
Connect host PC with STB, via command adb connect <STB_IP>:5555.
Web inspector on host PC, please refer to https://developers.google.com/web/tools/chrome-devtools/remote-debugging.

Quick Start Guide

Key event handling

Please use event.key for comparing remote control key event.

let keyHandler = function(e) {
    let key = e.key;
    if (key === ENABLE.input.KEY_CHANNELUP) {
        // zap to next channel
    }
}
document.addEventListener("keydown", keyHandler);

Play a video

let player = ENABLE.player.getInstance(0);
player.setSource("udp://224.0.0.14");

For details please refer to ENABLE.player#setSource

Webpage Example

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">
        let player = ENABLE.player.getInstance(0);
        player.setSource("https://cmafref.akamaized.net/cmaf/live-ull/2006350/akambr/out.mpd");
    </script>
</head>
<body>
</body>
</html>

EnableJS API for H-series