I would like to add some functionality to the standard CodeMirror editor field in Grav Admin. I experimented with CodeMirror in a static html page and was able to change the set of specialChars that get replaced with a red dot in the editor by adding specialChars: /[\u00a0\u00ad]/g
to the CodeMirror options. However, if I add this to the codemirrorOptions
twig variable defined in /user/plugins/admin/themes/grav/templates/forms/fields/codemirror/codemirror.html.twig like so:
{% set codemirrorOptions = {'spellcheck': 'true', 'inputStyle': 'contenteditable', 'mode': 'gfm', 'theme': theme, 'font': font, 'specialChars': '/[\u00a0\u00ad]/g', 'ignore': []}|merge(field.codemirror|default({})) %}
I get a javascript error: Uncaught TypeError: val.test is not a function
.
val.test
is found on line 13184 of /user/plugins/admin/themes/grav/js/vendor.min.js, it seems to check the regexp that was passed in the options. I don’t understand why it works in standalone CodeMirror but not in Grav Admin?
The other thing I can’t figure out is how to add a CodeMirror addon, or do anything with the editor in javascript myself. {% do assets.addJs('plugins://my/path/trailingspace.js') %}
results in a javascript error: Uncaught ReferenceError: CodeMirror is not defined
.
The way I understand it is, the whole webpack thing that bundles up all the vendor js code for the Admin plugin somehow renames the variables, and I can’t find out where or how.
Standalone CodeMirror is fantastically easy to extend, is there an easy way to do this within Admin? All ideas are very much appreciated!