Video wrapper with xAPI tracking

Required files

We need to add this script in the page with the video we want to track using xAPI statements. This will create the window.ADL object we will use to send xAPI statements to LRS.

---

Potential Use Case

… track individual/global behaviour inside video (see youtube)!

Setup

Before sending any request, first we need to provide LRS configuration

initXAPITrack () {
  const conf = {
    endpoint: 'xxxxxxx',
    user: 'xxxxxxx',
    password: 'xxxxxxx'
  }
  window.ADL?.XAPIWrapper?.changeConfig(conf)
},

---

Implementation

Once we have the LRS configuration ready we can start sending requests to LRS using this function:

sendXAPIStatement (action) {
  const statement = {
    actor: {
      account: {
        homePage: 'xxxxxxx',
        name: 'xxxxxxx'
      },
      objectType: 'Agent'
    },
    verb: action,
    object: {
      id: 'xxxxxxx',
      objectType: 'Activity'
    }
  }
  window.ADL?.XAPIWrapper?.sendStatement(statement)
}

The statement structure we are using has 3 parts:

• Actor: is the user watching the video

• Verb: is the action the user did

• Object: identifies the video

This function receives one parameter, the action or verb that we send to LRS. You can create your own verbs but its better to use standard ones, which are already defined in window.ADL.verbs. They have the following structure, for example for the verb window.ADL.verbs.initialized:

{
    "id": "http://adlnet.gov/expapi/verbs/initialized",
    "display": {
        "de-DE": "initialisierte",
        "en-US": "initialized",
        "fr-FR": "a initialisé",
        "es-ES": "inicializó",
        "ar-AR": "بدأ"
    }
}

Next step, we have to select which verbs we will use to track the video, in our case we decided to use:

• initialized when video starts

• suspended when video pauses

• resumed when video plays again

• completed when video ends

So now we know which verbs we want to use and we have all the configuration done, we just have to set listenners for each video event and call the function mentioned above. For example:

• on video starts → sendXAPIStatement(window.ADL.verbs.initialized)

• on video pause → sendXAPIStatement(window.ADL.verbs.suspended)

• on video play → sendXAPIStatement(window.ADL.verbs.resumed)

• on video end → sendXAPIStatement(window.ADL.verbs.completed)

You can link any event with any verb you want and this function will send statements to the LRS each time those events are triggered.