Customized interaction


Hi I need to add my own behaviour to a content type. What I would like the behaviour to do is add a css animation if the wrong hotspot is selected and possibly play a sound. 

I'm currently looking into using xAPI, but concerned that I will not be able to override the default behaviour of the hotspot and therefore catch the event to late. Am I right that I would have to modify the content type javascript to override standard behaviours?

Thank you Jorgen

otacke's picture

Hi Jorgen!

Luckily, H5P has hooks that you can use to customize content. Please have a look at the documentation.

There's a hook (alter_styles) that you can use to override the existing classes. Might already be enough for the animation.

There's also one (alter_scripts) that allows you to load custom JavaScript and to add Listeners or even extend or even override existing functions. Please see the documentation for how to use the hooks for your host system. I don't think the H5P object that you'll find doesn't yet have some kind of loaded event that you could listen to, but you could simply poll for your instance to be set in the H5P.instances array and then manipulate it as needed. Listening to xAPI events without changing the existing code should work for playing sound samples timely.