Connecting Moodle H5P Content with an LRS

This post is updated version of this blog post by Julian Davis. There is an existing plugin for Moodle called Trax Logs for Moodle which allows Moodle to send xAPI statements about H5P content to an LRS. This is a more robust solution for many installations but as of the writing of this post much of the data generated by the H5P content is lost before sending the xAPI statement to the LRS. One of the drawbacks of the solution outlined here is that the statements can not be sent retroactively, this will only send xAPI statements as they are being made by the H5P content. This solution has been tested on Moodle version 3.9 with PHP version 7.4.9.

You will need to make a new directory js in the mod/hvp of your Moodle installation. There you will make 3 new files as shown in this directory tree

.
├── mod
│   └── hvp
│       ├── view.php
│       └── js
│           ├── xapi-stmt-dispatcher.js
│           ├── xapiwrapper.min.js
│           └── xapiwrapper.min.js.map
...

This first file xapi-stmt-dispatcher.js should have the following contents.

$(document).ready(function () {
	ADL.XAPIWrapper.changeConfig({
		'endpoint': 'http://your.lrs.edu/data/xAPI/',
		"auth" : "Basic " + toBase64('username:password')
	});
	H5P.externalDispatcher.on('xAPI', function(event) {
		console.log(event.data.statement);
		var stmt = new ADL.XAPIStatement(
			event.data.statement.actor,
			event.data.statement.verb,
			event.data.statement.object,
			event.data.statement.result);
		stmt.generateId();
		stmt.context = event.data.statement.context;
		stmt.generateRegistration();
		console.log(JSON.stringify(stmt));
		ADL.XAPIWrapper.sendStatement(stmt)
	});
});

The information for the result and context were added (not included in the post by Julian Davis) as this information is also provided by the H5P content.

The other two files xapiwrapper.min.js and xapiwrapper.min.js.map should have the contents of xapiwrapper.min.js and xapiwrapper.min.js.map respectively. This has been tested with the files as they were after the commit in the xAPIWrapper repo with hash fd2e083.

Further the mod/hvp/view.php file should be updated to include the following lines

// xAPI (ADL) js wrapper.
$PAGE->requires->js(new moodle_url('/mod/hvp/js/xapiwrapper.min.js'), true);
$PAGE->requires->jquery();
$PAGE->requires->js(new moodle_url('/mod/hvp/js/xapi-stmt-dispatcher.js'), true);

after the lines

// Configure page.
$PAGE->set_url(new \moodle_url('/mod/hvp/view.php', array('id' => $id)));

Once you save these changes you should see the xAPI statements outputted to the JavaScript console in your browser (to suppress these logs remove the log calls from the file) and sent to the LRS stated in the xapi-stmt-dispatcher.js file.