How to listen for xAPI events

[sloopint]

Hello,
I plan to send data to an LRS after listening to x-apis. Thanks to tdjac0bs (issue #79, closed), I tried this :
H5P.externalDispatcher.on("xAPI", (e)=>{
console.log("Event ", e);
});
But it doesn’t work. I get the following message in the console :
TypeError: H5P.externalDispatcher is undefined
Since I am not a developer, I don’t know what to do (maybe add something in the single.html file?).
Thanks for your help.

[0xMurage]

Hi @sloopint ,
if you need to listen to H5P events, you need to wait until the player has loaded everything successfully.
That can easily be accomplished by :

  <script type="text/javascript">
    const {  H5P } = H5PStandalone;

new H5P(document.getElementById('h5p-container'), {
        h5pJsonPath: 'full_workspace',
        frameJs: '/dist/frame.bundle.js',
        frameCss: '/dist/styles/h5p.css'
    })
    .then(function() {

        // this is where you will listen for the xAPI event
        H5P.externalDispatcher.on('xAPI', (event) => {
            // add your logic to send the event to the LRS  here. 
            console.log('xAPI event: ', event); //(I am just logging to browser developer console for demo purpose)
        });

    });

</script>

I hope that solves your issue

[github-actions]

🎉 This issue has been resolved in version 3.1.1 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀