Building an AAMP UVE Player using Lightning

Prerequisite:

• Lightning-CLI should be pre-installed in the system. If not, install it by running the 
  following command

  Code Block
  theme Midnight
  npm install -g rdkcentral/Lightning-CLI

  
  

Setting up Lightning App:

1. Navigate to the folder on your pc where you want to start your project.
2. type lng create to create a new Lightning app.
3. Give name of the app.
4. Fill in the identifier.
5. Choose if you want to enable ESlint or not.
6. Select yes to install the NPM dependencies.
7. Choose yes if you need to initialize an empty GIT repository.
8. Navigate to the created app folder. Use the lng options,
   1. lng build: it will create a standalone bundle that you can run in the browser
   2. lng serve: it will start a local webserver and run the app
   3. lng dev it will build the app, start a webserver and watch for changes
   4. lng dist: it will build a standalone, distributable version of your App that can either be run locally

Adding UVE code to the App:

1. Goto src/App.js.

2. Add the following lines for UVE playback.

   Code Block
   theme Midnight
   var player = new AAMPMediaPlayer() var locator = "http://amssamples.streaming.mediaservices.windows.net/683f7e47-bd83-4427-b0a3-26a6c4547782/BigBuckBunny.ism/manifest(format=mpd-time-csf)” player.load(locator)

   
   

Running the App:

1. type lng dist to create the Lightning app distributable bundle.
2. Goto dist/es6 folder.
3. Zip the es6 folder and copy to /opt/www of STB.

4. Use rdkbrowser to run the app like

   Code Block
   theme Midnight
   rdkbrowser2.sh http://localhost:50050/manu/es6/index.html

   
   

Snapshot of public APIs

minimal reference player - HTML/js web app

html-minref.html

pre-built minimal lightning app  - video playback and text overlay

uve-lightning.html