Login Register

Documentation

Layouts configuration and switching

Player layouts API

Name Params Description
getResponsiveLayouts() --- Returns JavaScriptObject with the lesson layouts configuration.
changeLayout() Layout ID Changes a current lesson layout, returns flag if the layout was changed.

Player asynchronous loading configuration

Player loading is an asynchronous operation. Calling player.load("...") sends the request for a resource. It takes the player some time to parse the XML response with lesson and layout configuration.

The player sends onPageLoaded event after loading the page and parsing data. A user can respond to this event to retrieve layouts configuration. See examples below.

Getting configuration

It is possible to get the lesson layouts configuration

var player;
function icOnAppLoaded(){
    player = icCreatePlayer('_icplayer');
    player.load('content/default.ic.xml');
    player.onPageLoaded(function () {
        var configuration = player.getResponsiveLayouts();
        ...
    });
}

Configuration description

Configuration is a JavaScript object, where keys are the layout's IDs required by changeLayout. Values are the objects described below.

Key Type Value Description
id string Random generated uuid Layout generated ID
deviceOrientation string vertical | horizontal Mobile device orientation destination for the layout.
isDefault boolean Layout configuration contains only one default layout.
name string Name for the layout.
styleID string Random generated uuid CSS stylesheet ID assigned to the layout.
threshold Number Integer value greater than 0 Device screen max width for the layout.
useDeviceOrientation boolean Flag which indicates if the layout is configured for mobile devices.

Switching layout

The current lesson layout can be switched. As the parameter, please provide a new layout ID.

var player;
function icOnAppLoaded(){
    player = icCreatePlayer('_icplayer');
    player.load('content/default.ic.xml');
    player.onPageLoaded(function () {
        var configuration = player.getResponsiveLayouts();
        var hasChanged = player.changeLayout("newLayoutID");
        ...
    });
}

Changing layout returns boolean true value if the layout has been changed by the player.