Introduction
Docebo embedded learning allows you to start an instance of your Docebo platform on any external web page, as long as you have access to its HTML and JavaScript code.
The Docebo platform instance opens as a launcher activated either when the user clicks on a button or interacts with an element - such as a link, or a string - on the external web page or it is embedded as a widget within the page. The platform instance shows the training content you, as the Superadmin, have selected for the user on the basis of the action he or she is performing, in order to provide the best learning on the fly experience, enriching it with ad hoc training.
Embedded learning is available as a web-based application on desktop and mobile platforms.
The embedded learning launcher allows you to open an instance of your Docebo platform in any external web platform, as long as you have access to its HTML and JavaScript code. Find out more on embedded learning and the embedded learning launcher in their respective knowledge base articles.
This article is a technical guide on how to interact with the launcher using commands in your web platform.
Lifecycle commands
| Command |
Description |
setTokenProvider(callback)
|
Provides the launcher a function to invoke when the current access token expires. The provided function must return a promise that resolves with the new access token.
This command uses the following parameter:
callback (required): a function that provides a new access token
Example:
function renewToken(){
// an HTTP call to your
// backend-to-backend login process
}
DFlow.setTokenProvider(renewToken);
|
start({
domain: {domain},
[launcher_code: {code}],
[token: {token}],
[language: {language code}]
})
|
This command starts the launcher.
This command uses the following parameters:
| Parameter |
Description |
domain |
Type:
String
Requirement:
Required
Description:
The domain of the Docebo platform (this can be also a custom domain managed in Domain Management)
|
launcherCode |
Type:
String
Requirement:
Optional
Description:
The unique code assigned to the launcher
|
token |
Type:
String
Requirement:
Optional
Description:
The access token to perform authenticated calls to the Docebo platform
|
language |
Type:
String
Requirement:
Optional
Description:
The display language used by the launcher and all widgets contained within. For a list of available language codes, please see the List of Supported Languages article. By default the language of the launcher is set to English (US).
|
The command returns a promise that resolves when the launcher has fully started and loaded. This makes the parent page to become aware of the status of the launcher which allows for the triggering of events based on that information.
The start command promise resolves only after the launcher is ready to be shown. This gives you the ability to use this feature to open the launcher automatically or, for example, perform searches behind the scenes prior to displaying the results.
Example:
DFlow.start({
domain: "customer.docebosaas.com",
launcherCode: "Launcher123",
token: "access token",
language: "en"
});
By default when the launcher is first started, it will display the icon only with the popup in a closed state (see the Interaction commands section; the default state after start() visually appears as if the commands show() and close() were issued together).
(In case of Custom Button usage the opening the logic remains the same but the Icon will not be shown)
Please note: An older version of this command, which does not have the ability to set the language parameter, can also be used to start the launcher.
Deprecation warning:
Docebo strongly advises you to update your code to use the new command to start the launcher.
The instructions for the old command are as follows:
start(domain, [code], [token])
This command starts the launcher. This command uses the following parameters:
-
domain (string, required): The domain of the Docebo platform (this can be also a custom domain managed in Domain Management)
-
code (string, optional): The unique code assigned to the launcher (if any)
-
token (string, optional): The access token to perform authenticated calls to the Docebo platform
Example:
DFlow.start(
“customer.docebosaas.com”,
“Launcher123”,
”access_token”)
.then(() => console.log(‘Launcher running’));
By default when the launcher is first started, it will display the icon only with the popup in a closed state (see the Interaction commands section; the default state after start() visually appears as if the commands show() and close() were issued together). (In case of Custom Button usage the opening the logic remains the same but the icon will not be shown)
|
shutdown()
|
This command stops and removes the launcher from the screen. Returns a promise that resolves when the app launcher has been terminated.
Example:
DFlow.shutdown()
.then(() => console.log(‘Launcher stopped’));
|
restart({
domain: {domain},
[launcher_code: {code}],
[token: {token}],
[language: {language code}]
})
|
This command restarts the launcher.
This command uses the following parameters:
| Parameter |
Description |
domain |
Type:
String
Requirement:
Required
Description:
The domain of the Docebo platform (this can be also a custom domain managed in Domain Management)
|
launcherCode |
Type:
String
Requirement:
Optional
Description:
The unique code assigned to the launcher
|
token |
Type:
String
Requirement:
Optional
Description:
The access token to perform authenticated calls to the Docebo platform
|
language |
Type:
String
Requirement:
Optional
Description:
The display language used by the launcher and all widgets contained within. For a list of available language codes, please see the List of Supported Languages article. By default the language of the launcher is set to English (US).
|
Returns a promise that resolves when the launcher has fully started again.
Example:
DFlow.restart({
domain: "customer.docebosaas.com",
launcherCode: "Launcher123",
token: "access token",
language: "en"
});
Please note: An older version of this command, which does not have the ability to set the language parameter, can also be used to restart the launcher.
Deprecation warning:
Docebo strongly advises you to update your code to use the new command to restart the launcher.
The instructions for the old command are as follows:
restart(domain, [code], [token])
This command restarts the app launcher.
This command uses the following parameters:
-
domain (string, required): The domain of the Docebo platform (this can be also a custom domain managed in Domain Management)
-
code (string, optional): The unique code assigned to the app launcher (if any)
-
token (string, optional): The access token to perform authenticated calls to the Docebo platform
Example:
DFlow.restart(
"customer.docebosaas.com",
"Launcher123",
"access_token")
.then(() => console.log('Launcher successfully restarted'));
|
Interaction commands
The following commands allow the user to interact with the launcher on the page. The command structure is set out as follows:
DFlow.getCommandBus().send(
'action',
'widget ID',
{}
)
Please note that the widget ID is always “launcher”. These commands do not return a response promise payload.
| Command |
Description |
DFlow.getCommandBus().send(
'show_launcher',
'launcher',
{}
)
|
This command makes the launcher visible if it has been previously hidden. |
DFlow.getCommandBus().send(
'hide_launcher',
'launcher',
{}
)
|
This command hides the launcher. |
DFlow.getCommandBus().send(
'open_launcher_popup',
'launcher',
{}
)
|
This command opens the launcher container. |
DFlow.getCommandBus().send(
'close_launcher_popup',
'launcher',
{}
)
|
This command closes the launcher container. |
DFlow.getCommandBus().send(
'toggle_launcher_popup',
'launcher',
{}
)
|
This command toggles the launcher container open status. |