Support for H5P

[pwab]

I know this feature request could be way out of scope of LiaScript and its current goals. But I would like to at least discuss it here.

H5P is an openly documented specification for rich media content that can be implemented into websites especially learning courses. The libraries utilizing this scheme are also open source and based on JavaScript (as far as I can see). The functionality to open and run H5P-content is integrated into several LMS (namely Moodle, Brightspace, Canvas, Blackboard) via LTI and also CMS like WordPress or Drupal with plugins.

The current way of creating and hosting H5P-content is to use the authoring tools on h5p.org or using the plugins on WordPress, Drupal or Moodle. Those H5P-content can then be embedded as iframe or downloaded and shared as H5P-file (zip). Using the latter could be a chance to embed H5P-content into LiaScript without the need to host it at another website.

I added a test file for evaluation purposes: example-content-find-the-words-557697.zip
This is taken from the examples page and hopefully shows some capabilities of H5P and its structure.

Therefore, I request to evaluate the possibility to open up and run h5p-files directly from LiaScript. That would be a massive plus when comparing it to other LMS which do not support running those files out of the box. Apart from that H5P could be a big aggregator for OER and a smooth integration would clearly rise interest into LiaScript as an OER authoring tool.

TLDR:
LiaScript 📜 + H5P 🚀 = ❤️

[andre-dietrich]

Thanks a lot for pitching the idea ... and sorry for the late response. I just tried it out, and it seems, there is no need for additional implementations. I mean, you can use H5P directly, without any further modifications.

<!--
author:   Your Name
email:    your@mail.org
version:  0.0.1

script:   https://h5p.org/sites/all/modules/h5p/library/js/h5p-resizer.js

-->

# Course Main Title

<iframe src="https://h5p.org/h5p/embed/6725" width="1090" height="389" frameborder="0" allowfullscreen="allowfullscreen" allow="geolocation *; microphone *; camera *; midi *; encrypted-media *"></iframe>

I simply added an embed-tag and from their site, as well as the script in the main-comment, which seems to be required for responsive sizing for quizzes...

Here is the test repo: https://github.com/andre-dietrich/H5P-Test/blob/main/README.md

and here the resulting link ...

https://liascript.github.io/course/?https://raw.githubusercontent.com/andre-dietrich/H5P-Test/main/README.md#1

Regards... And thank you for the idea ;-)

[pwab]

Well this is at least an easy way of embedding h5p content which is hosted on a server that can unpack and run those packages. Thanks for trying and it shows that h5p is working well together with liascript. 😃

---

But my request was to go one step further: adding the possibility to open and run h5p packages directly - without the need of another server. This would eliminate the need of an external service that handles the h5p-stuff (apart from editing the quizzes).

So that it looks like that:

Repository

- quiz.h5p
- README.md

Content of README.md

<!--
author:   Your Name

...

-->

# H5P-Test

@h5p("quiz.h5p")

So every file is hosted inside my github repository to get independent of content hosters so when I share a liascript course I can be sure that it will work as long as the liascript interpreter (at this point: on github) is working.

I hope that it is now a bit clearer what I'm talking about. 😅

[andre-dietrich]

Okay ... sounds very interesting ... I will play around with it during the holidays ... thanks for the resources ...

[andre-dietrich]

I did not found a satisfying solution or project so far, that allows to load quizzes only within the browser by using javavascript only. All solutions seem to require a backend with a database...

If anyone has some more infos or has knowledge of a JavaScript (not Node.JS) project only?

[roman-yatsenko]

See this repo
https://github.com/tunapanda/h5p-standalone

[pwab]

Thanks to the project linked by @roman-yatsenko I was able to locally load a h5p-file (unzipped) without the normally needed backend. As this is possible with only a few js scripts it should be possible to add this functionality via template. Only need to find more info (and gain more understanding) about creating macros in liascript. 😄

[andre-dietrich]

@pwab ... that sounds great, if you can create a simple Browser example, with a simple script-tag, not necessarily LiaScript, then it could be easily added as a macro. Would love to do this... Before that, I could not load h5p, since it required NodeJS ... Hope that I am wrong ...

[abotzki]

@pwab This conversation happened quite a while ago and I am wondering whether you might have created an example or even the macro for embedding HP5 content in LiaScript courses.

[pwab]

@abotzki Unfortunately no. As so often in life, my focus has changed in the meantime. Since I no longer teach courses, I've turned to other tools that make my day-to-day work easier.

As far as I can see, not too much has happened on the H5P side. The focus seems to be on H5P-as-a-Service and no other plugins or simpler libraries have been added according to the integration list. The h5p-standalone library has various issues and has not been developed for a year.

However, there are a few new options:

• Lumieducation has created an H5P nodejs-library.
• The embedding of H5P using JS has been better described. Check out the section under "Viewing H5P content".

Maybe this can be used for an integration in LiaScript. Good luck and let me know if it worked.