HUB Events

HUBEvents is a WebComponent that triggers an application's usage events to the HUB. These events are sent and registered to HUB reporting platform.



We have a step-by-step guide on how to implement HUB Events in the recipe below


constructor(apiKey, userId, appId)

Component hub-events has 4 (three) required attributes:

  • api-key: APIKEY linked to the Institution;
  • hub-user-id: Session User Profile Global Code
  • hub-app-id: Application id the user is using
  • pool-id: Authentication token

Optional Attributes:

  • custom-activity-id: Id of the current activity in which the student is accessing
  • auto-open: Disables automatic submission of OPEN_APP, default value is true auto-open="false"
  • stream-name: Name of the Stream to be sent events, to which environment the events should be sent.
    • prd-HubStream - Production (default when not informed)
    • HubStream - QA
  • alive-intervel: It is the value in minutes of the periodicity of triggering the ALIVE event automatically by lib. When not informed, the default value is used.
    • Default: 5 minutes
    • Minimum 3 minutes
    • Maximum 20 minutes


<hub-events api-key="MINHA-API-KEY" hub-user-id="CODIGO-GLOBAL-DO-PERFIL" hub-app-id="ID-DA-APLICACAO" pool-id="IDENTITY-POOL-ID" custom-activity-id="ID-ATIVIDADE" stream-name="STREAM" ></hub-events>



The GLOBAL-PROFILE CODE is the unique code used by the HUB to identify the user. Within the data received by LTI the field that returns the global code of the profile is user_id.

APP-ID is the unique code used by HUB to identify which solution the user is accessing. The field returned by LTI that has your application code is app_id.


The onReady function registers a callback function to be fired when the hub-events component is fully configured


hubEvents.onReady(() => console.log('HUBEvents is ready'))


Registers a callback function that will be called each time a HUBEvents log event occurs. In each called function, an object containing the following attributes is passed as parameter: logTime , logLevel , logMessage .


 hubEvents.onLog((event) => {
    const { detail } = event;
    const { logTime, logLevel, logMessage } = detail;

    console.log(logTime, logLevel, logMessage);


Registers a callback function that will be called each time an event triggered by HUBEvents occurs. Each function called is passed as a parameter an object containing the following attributes: eventTime , eventName , eventDetail .


hubEvents.onEvent((event) => {
  const { detail } = event;
  const { eventTime, eventName, eventDetail } = detail;

  if (eventName == 'ALIVE') {
    console.log(eventTime, eventDetail)


  • ALIVE: Registers that the application is being used
  • OPEN_APP: Logs when application is loaded
  • CLOSE_APP: Registers when application is closed
  • HIDDEN_STATE: Logs when the application loses focus or is minimized
  • VISIBLE_STATE: Registers when the application is maximized and focused on the user's screen
  • CHANGED_VIEW: Event to trigger when the user modifies the viewed page
  • STARTED_TASK: Event that can be triggered when the user starts a task
  • FINISHED_TASK: Event that can be triggered when the user finishes a task

What's Next