Modifying h5p-interactive-video code

Submitted by nadavkav on Mon, 05/14/2018 - 08:09
nadavkav's picture
Forums: 
Developers

Hello H5P dev Team,

I would like to make some improvement to the h5p-interactive-video librery, and some of its dependencies.

I used h5p-cli to download it locally ("h5p get h5p-interactive-video") and I am tring to view it with the local web server by using: "h5p server"

But I am getting to many JS errors. some I can ignore, but others are fatal. and it seems I am not on the right track :-(

btw, if I unzip a distributed h5p package from h5p.org it works fine, but obviously... all the JS is minified, and I can not use it.

I read all the documentation on the site, and did not find any answer. also the forums (that are hard to search)

Can you please help with some instructions of what should be the proper why to go about donwloading h5p-interactive-video and setting up the proper development envirunment for it, and how to build a working h5p package out of it (not how to push patches to github, as it works fine)

Best,

Nadav Kavalerchik 

BV52's picture

BV52

Mon, 05/14/2018 - 08:14

Hi Nadav,

Can you please elaborate on what you are trying to modify? Also adding a screenshot of the error logs in the browser can help diagnosing the issue.

-BV52

otacke's picture

otacke

Mon, 05/14/2018 - 08:59

Hi Nadav!

Some of the H5P libraries need to be build first using npm (using babel for transpiling, etc.).

  1. Go into the folder and use npm install to get all the dependencies. You need to have npm, of course.
  2. Use npm run watch while coding to build the archive in the background or npm run build to get a version that's ready for production.

Hope that helps.

Best,
Oliver

nadavkav's picture

nadavkav

Tue, 05/15/2018 - 08:15

Thanks Oliver!

I had to go into 5 dependent libreries of h5p-interactive-video and run npm install and npm run build to get babel to install and transpile the JS code.

( I went through all the JS missing files errors in the browser's developer console, until all errors were gone)

Also had in git clone https://github.com/h5p/h5p-lib-controls, which was not recognised as dependancy to h5p-interactive-video when I initally h5p get ... it, but was needed. maybe you should fix that.

Now "h5p server" works fine with the h5p-interactive-video. and I am using npm run watch to see any changes I make in the code reflect in the debugger window of the browser :-)

Again, thank you very much.

I think this should go into the H5P developer documentation. (In Moodle, we have a developer wiki that anyone can update, but here... I guess it is up to you guys and girls to update the documentation)

Best,

Nadav

otacke's picture

otacke

Mon, 05/14/2018 - 23:29

Hey, Nadav!

Glad it's working. And true: You'll have to get and build some sub content, too. And I agree, the documentation needs an update. We're actually planning a little more than just setting up a wiki and it may take a while longer, but it'll be worth it, I guess.