Tornado Development with JavaScript

Overview

Tornado M55 supports web technologies intrinsically. Developers can leverage the full capabilities of HTML5, CSS and JavaScript to create rich, interactive applications for IPTV, VOD and other media oriented services. A JavaScript SDK is provided, that exposes an easy to use API for interacting with the built-in hardware accelerated player and the remote control.

The SDK also provides utility classes to help you build scalable user interface components that are well tested and optimized for the TV interface. The components are customizable via CSS files and easily extendible to allow rapid development of your application. A custom user interface is build on top of those components that allow the SDK to be used directly as it is for deployment and can be used as a base for your application.

The SDK also supports framed application mode, which means that it is able to load your custom application and bridge the user interaction to it.

For more details, download the SDK and take a look at the examples and documentation.

Download SDK

If you would like to deploy the SDK provided user interface to your customers or you are interested in the SDK for your project, the latest release version can be downloaded from the following URL

Zip archive: here

The extracted archive will contain a directory with all the needed files to run the SDK and the attached user interface on any M55 STB. To use it set the startURL option in the STB to point to the URL of the extracted archive.

Demo

To see a demo on you equipment, please log into your M55 STB, go to the System Configuration dialog and set the "Start URL" to the following URL: http://www.sysmaster.com/demo/M55/index.html

Stand alone SMJS API

Pre-built version of the SMJS API interface along with utility function is available as a stand alone script that can be included in your project as a regular javascript file.

It will export the SMJS object in the global scope with several utility methods and properties.

The following methods are available:

get - Retrieves named resource (listing) from the backend. Accepts two parameters, a source name (see SMJS.Sources) and a function as second parameter, that accepts two parameters, an Error instance and Array. The array will be populated with the results
play - Plays an object, accepts two parameters, an object to play (the object should be one of the list retrieved previsouly with the get function), and a boolean, if set to true, the playback will be resumed from previous position (only if the file was previously played)
stop - take no parameters, stops the playback
listen - binds a function that will receive the remote control keypress events. Takes one parameter, a function, that should accept events. The event itslef exposes the getKey method to retrieve the pressed key on the remote. Only one listener is currently supported, trying to add a new one will throw an error
unlisten - Removes the remote controlled listener and thus makes possible for a new one to be added with listen

The following properties are available:

Sources - Object literal with named listing sources, should be used with the get method (see example bellow)
Player - Exposes the player object to allow one to add listeners to its events. One should not attempt to use the player directly to control the playback, the play and stop methods should be used instead
Events - Object literal with named player events to use when adding listeners to the player (see example)

The build contains development utilities. To use it in development mode (i.e. test your application in browser), one need to provide the variable named TORNADO_URL in the global scope before the script is included. An example follows

<!doctype html>
<html>
  <head>
    <title>Tornado UI</title>
  </head>
  <body>
    <script>window.TORNADO_URL = 'ws://192.168.2.64:7681';</script>
    <script src="smjsapi-1.1.min.js"></script>
    <script>
        var listing;

        SMJS.Player.addEventListener(SMJS.Events.PLAYBACK_START, function(e) {
            console.log('Started playing', e.getDetails().publishName);
        });
        SMJS.Player.addEventListener(SMJS.Events.PLAYBACK_INFO, function(e) {
            console.log('Received playback info event', e.getDetails());
        });

        SMJS.Player.addEventListener(SMJS.Events.PLAYBACK_STOP, function(e) {
            console.log('Playback stopped', e.getDetails());
        });

        SMJS.listen(function(ev) {
            console.log('received key', ev.getKey());
            var key = ev.getKey();
            if ( key == 'play') {
                SMJS.play(listing[0]);
            } else if ( key == 'stop') {

                SMJS.stop();
            }
        });

        function saveList(err, list) {
            if ( !err ) listing = list;
        }

        SMJS.get(SMJS.Sources.IPTVLIST, saveList);
    </script>
  </body>
</html>

The TORNADO_URL variable should point to the IP of your development tornado box, the protocol and port should remain the same. To obtain a develoment tornado box, please contact a sales representative to receive instructions how to proceed.

The script is compiler with the closure compiler and does not polute the global scope. It is 23KB minified and 8.9KB gziped.

The script can be downloaded from here. The build script will be included in the next version of the SDK

The following variants are also available, select the one that suits your needs:

Complete API with enabled debug support - use this version if you want to develop and debug your code from within your browser of choice (currently only browsers with websoket support, FF, Chrome, IE10)
Remote control support only - this build provides only the remote constrol bindings and allow you to integrate your app with the remote control. It is suited for already developed applications that just want to be accessible on the STB.