Hi,

I have created a custom H5P content type (Contributed here) and it is working as desired.
Now I wish to be able to choose this in a Course Presentation content type, similar to how we can add dialog cards or drag-drop elements.

Should I add some code in 'H5P.CoursePresentation-1.xx' library or can this be done from within my library itself?

Can somebody please point me out in the right direction to achieve this?

Awaiting response,

Regards,
Supriya Rajgopal

CommentFileSizeAuthor
#4 clicktoreveal-error.png36.07 KBsupriyarajgopal

Comments

supriyarajgopal created an issue. See original summary.

icc’s picture

icc commented

Cool!

Currently, you'll have to add it to the semantics.json in order for it to work. Hopefully, we can get a more flexible solution in the future.
For testing purposes, you could add it through the semantics_alter hook, so you won't have to update CoursePresentation and the database.

I'm looking forward to seeing it on H5P.org :-)

supriyarajgopal’s picture

supriyarajgopal commented
Issue summary: View changes
supriyarajgopal’s picture

supriyarajgopal commented
StatusFileSize
new clicktoreveal-error.png36.07 KB

Hello icc,

Thank you so much for the prompt response!

As suggested, I included my custom content type library in using semantics_alter() hook by which I can now see an empty box-like thing to add in Course Presentation.

However, as soon as I click on it to add a 'Click to reveal' element (that's what my custom library is called :] ), I get the error "Unable to find constructor for: H5P.ClickToReveal 1.0" in h5p/library/js/h5p.js file. My custom clicktoreveal.js file does have a definition for constructor (Code can be found here).

Moving my library from sites/default/files/h5p/development folder to sites/default/files/h5p/libraries folder didn't make a difference.

And this happens only when I try to include it from Course Presentation; stand-alone implementation of my custom library works just fine. Am I missing adding something or should this be done in Course Presentation library?

I would also like to know how to add an icon for my custom content type in Course Presentation action bar.

Any help is greatly appreciated!

Regards,
Supriya Rajgopal

icc’s picture

icc commented

Ah yes, you'll need to add it to the preloadedDependencies in library.json of h5p-editor-course-presentation in order for it to work in the editor.

For a custom icon it will have to be inserted into the H5PCoursePresentation font and then updated in the styles/cp.css. You can also of course use font awesome.
Feel free to create a Pull Request on GitHub after you've made the changes needed to Course Presentation for your library to work.

supriyarajgopal’s picture

supriyarajgopal commented

icc,

Thank you for this! I added 

{
      "machineName": "H5P.ClickToReveal",
      "majorVersion": 1,
      "minorVersion": 0
    },

in library.json of H5PEditor.CoursePresentation-1.10. Still the same error even after clearing cache. :(

Please correct me if I am wrong: Creating a pull request on GitHub will ensure that I will not have to hack the Course Presentation library whenever an upgrade is released, correct?

icc’s picture

icc commented

Yes, you are correct :-)

supriyarajgopal’s picture

supriyarajgopal commented

icc,

Even after adding

{
"machineName": "H5P.ClickToReveal",
"majorVersion": 1,
"minorVersion": 0
},
in library.json of H5PEditor.CoursePresentation-1.10, I get the same error even after clearing cache :( Again, moving my library from development folder to libraries has no effect.

Kindly advise.

icc’s picture

icc commented

Is your H5PEditor.CoursePresentation-1.10 in the development folder?

supriyarajgopal’s picture

supriyarajgopal commented

No, H5PEditor.CoursePresentation-1.10 is in ites\default\files\h5p\libraries folder whereas H5P.ClickToReveal-1.0 is in sites\default\files\h5p\development folder.

icc’s picture

icc commented

You'll have to put both CoursePresentation in the development folder for the changes to take effect. For regular content types library.json is only read on upload. The development folder reads it for every request.

supriyarajgopal’s picture

supriyarajgopal commented

icc,

While my site clears its cache...how about putting H5P.ClickToReveal library inside sites\default\files\h5p\libraries folder instead? Wouldn't that work. Mostly not but why?

icc’s picture

icc commented

When you upload libraries all the JSON files are read into the database and the files placed in the library folder. I.e. changing any of the JSON files inside the libraries folder will have no effect. The development folder, on the other hand, is read on every page request and uses the files and not the database. Any library places in the development folder will override any libraries in the libraries folder. Using the development mode has a huge performance impact and must never be used on production sites.

supriyarajgopal’s picture

supriyarajgopal commented

Super!

After placing all 3 files viz. H5P.ClickToReveal, H5P.CoursePresentation-1.10 and H5PEditor.CoursePresentation-1.10 in sites\default\files\h5p\development folder, everything is working perfectly!

P.S. I had to comment two calls to 'self.resize()' in clicktoreveal.js file for the editor to load in Course Presentation.

Many thanks icc!

Regards,
Supriya Rajgopal

supriyarajgopal’s picture

supriyarajgopal commented
Status: Active » Closed (fixed)