Hooking into the Bright Javascript Lifecycle

All bright integrations involve a basic model

• a integration with the native webstack, authenticating with Bright
• writing the API key, and content data require for template generation to the browser.
• the browser also is instructed to download the bright.js script which handles template rendering.

So it's the web browser that actually handles the template render. This means that rendered HTML is not available when the page loads.

This document covers how to hook in the template render lifecycle so you can execute javascript after templates render for instance.

This is the most commonly run hook. You get control in javascript after Bright renders the available templates:

Bright.addHook('after_load',function() {
  if (Bright.bright_template_list && Bright.bright_template_list.length > 0) {
    Bright.bright_template_list.forEach(function(template) {
      var name = template.data.templateName;
      console.log('I found a rendered Bright template with name ' + name);
    });
  }
});

This simple example loops over all the Bright templates on the page, and outputs the name to the Browser console.

After return from SCORMCloud, the page will be refreshed as part as loading the most current data. A hook will enable a message to be generated during refresh

Bright.addHook('before_page_refresh', function() {
  jQuery('.entry-content').prepend('Loading your data, please wait......');
})

When Bright passes a health check, launch buttons of class bright-launchable are enabled.

Hook to this to add your own enabled logic.

This gets called after Bright fails a health check. By default everything of class 'bright-launchable' is disabled. If you want something else disabled, hook to it here.

Check if Bright is ready for action:

=> Bright.ready()
false
// not loaded, no auth token, not logged in, etc.

Altering a Generated Template After It Renders