Add LaTeX support to H5P using MathJax (and possibly other libraries in the future).
The MathDisplay library requires the appropriate update to your host system and the appropriate update to h5p-php-library.
- Upload the library in the H5P library screen.
- Add LaTex to your content using the common LaTeX notation:
\(some LaTeX\)
for inline LaTeX\[some LaTeX\]
for block LaTeX$$some LaTeX$$
for block LaTeX
The MathDisplay library can be configured setting the environment variable H5P_MATHDISPLAY_CONFIG
of your host system.
So far, the MathDisplay library supports MathJax for rendering math. Support for other libraries such as KaTeX could be added in the future.
The MathDisplay library expects to find a renderer
property within H5P_MATHDISPLAY_CONFIG
which itself holds an object named after the library that's used.
In the case of MathJax, this object uses the same structure that you may be accustomed to by the MathJax in-line configuration options.
TODO: List the default values.
There are different "observers" that will tell the renderer that the page might need an update. It is not necessary to use all observers at the same time, but it is possible.
mutationObserver
: Will constantly listen to DOM changes and trigger an update if a change occurs. Parameters:cooldown
: Number of milliseconds that updates will be triggered after an update
domChangedListener
: Will trigger an update if it detects an H5P Event with the handledomChanged
by a content type.interval
: Will repreatedly trigger an update after a defined interval. Parameters:time
: Number of milliseconds between each update.
TODO: List the default values after tweaking.
You can alter the default configuration of the MathDisplay library by adding something like this to the settings.php
file within your /sites/YOUR_SITE
folder, typically it's /sites/default
.
$conf['h5p_library_config'] = array(
"H5P.MathDisplay" => array(
"observers" => array(
array("name" => "mutationObserver", "params" => array("cooldown" => 500)),
array("name" => "domChangedListener"),
array("name" => "interval", "params" => array("time" => 1000))
),
"renderer" => array(
"mathjax" => array(
"src" => "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js",
"config" => array(
"extensions" => array("tex2jax.js"),
"jax" => array("input/TeX", "output/HTML-CSS"),
"tex2jax" => array(
// Important, otherwise MathJax will be rendered inside CKEditor
"ignoreClass" => "ckeditor"
),
"messageStyle" => "none"
)
)
)
)
);
You can alter the default configuration of the MathDisplay library by adding something like this to the settings.php
file within your /sites/YOUR_SITE
folder, typically it's /sites/default
.
$config['h5p.settings']['h5p_library_config'] = array(
'H5P.MathDisplay' => array(
"observers" => array(
array("name" => "mutationObserver", "params" => array("cooldown" => 500)),
array("name" => "domChangedListener"),
array("name" => "interval", "params" => array("time" => 1000))
),
"renderer" => array(
"mathjax" => array(
"src" => "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js",
"config" => array(
"extensions" => array("tex2jax.js"),
"jax" => array("input/TeX", "output/HTML-CSS"),
"tex2jax" => array(
// Important, otherwise MathJax will be rendered inside CKEditor
"ignoreClass" => "ckeditor"
),
"messageStyle" => "none"
)
)
)
)
);
You can alter the default configuration of the MathDisplay library by adding something like this to the wp-config.php
file.
define('H5P_LIBRARY_CONFIG', array(
"H5P.MathDisplay" => array(
"observers" => array(
array("name" => "mutationObserver", "params" => array("cooldown" => 500)),
array("name" => "domChangedListener"),
array("name" => "interval", "params" => array("time" => 1000))
),
"renderer" => array(
"mathjax" => array(
"src" => "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js",
"config" => array(
"extensions" => array("tex2jax.js"),
"jax" => array("input/TeX", "output/HTML-CSS"),
"tex2jax" => array(
// Important, otherwise MathJax will be rendered inside CKEditor
"ignoreClass" => "ckeditor"
),
"messageStyle" => "none"
)
)
)
)
));
You can alter the default configuration of the MathDisplay library by adding something like this to the config.php
file.
$CFG->mod_hvp_library_config = array(
"H5P.MathDisplay" => array(
"observers" => array(
array("name" => "mutationObserver", "params" => array("cooldown" => 500)),
array("name" => "domChangedListener"),
array("name" => "interval", "params" => array("time" => 1000))
),
"renderer" => array(
"mathjax" => array(
"src" => "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js",
"config" => array(
"extensions" => array("tex2jax.js"),
"jax" => array("input/TeX", "output/HTML-CSS"),
"tex2jax" => array(
// Important, otherwise MathJax will be rendered inside CKEditor
"ignoreClass" => "ckeditor"
),
"messageStyle" => "none"
)
)
)
)
);