📢
Resumable H5P Content State
  • With this new update,
    H5P content state/progress can be saved and resumed
    . This feature is added at the interaction level, meaning it can be turned on or off per interaction as opposed to the course/site level. Look for this option in the advanced section. By default, this option is turned off.
image
  • When this option is enabled, a log is created when each learner interacts with the H5P content. The log is updated with the state data (aka user content data) and saved to the database table when the interaction is dismissed or closed. When the interaction is relaunched, we'll attempt to get the relevant log. If the log exists, we'll show a confirmation dialogue in which the learner can choose to resume or start from the beginning.
image
  • Also comes with the feature is
    the ability to view the learner's response on the report page
    . When the state saving is enabled, teachers can click on the report cell (see below) to launch the content with the submitted response. This response is final and does not change after the learner re-attempts the content.
image
  • Technical Implementation:
    How is this feature implemented?
Most of the standard H5P content types can restore the state/progress, while some do not implement it intentionally. However, it's up to the LMS to implement the saving and resuming process. Unfortunately, Moodle does not implement this in its core H5P. After some research and testing, we learned that state saving can be turned on by modifying the H5PIntegration class. Here are the steps:
  1. First, we check if the specific H5P Content has state saving enabled by the teacher. If so, we're attempting to get the existing state (aka log) from the database.
  2. If the learner chooses to resume the content from the previous state, we're going to keep the log as is; otherwise, we use
    log=''
    .
  3. As soon as the interaction is launched, we use
    requestAnimationFrame()
    to detect the
    H5PIntegration
    class from the iframe. As soon as the class is found (before the
    .h5p-initialized
    CSS class is applied to the DOM), we have to enable state saving by changing
    H5PIntegration.saveFreq
    from
    false
    to
    1
    , meaning we want the state to be saved every second. This does not necessarily mean the state will be saved in the database every second. The state data is updated in
    H5PIntegration.contents[id].contentUserData[0].state
    .
  4. Now we use the log value as the default state.
    H5PIntegration.contents[id].contentUserData[0].state = log
    .
  5. And just like that, the state saving is ready.
  6. When the interaction is closed, dismissed, or refreshed, we check the value from
    H5PIntegration.contents[id].contentUserData[0].state
    and save it to the database.
📢
Lockable Chapter
  • Chapters can now be locked until a condition is met. The available conditions are:
  1. Until all interactions in the previous chapter are complete
  2. Until all interactions in all previous chapters are complete
  3. Until the interactive video activity is complete (based on the activity completion condition)
  • When a chapter is locked, all interactions within that chapter are temporarily removed.
image