Bug 29153: Fix CodeMirror textareas to work with all languages

To test:
1. Go to Tools > HTML customizations
2. Open or create a new entry with CodeMirror. ( Edit with text editor )
3. CodeMirror doesn't work, notice a console error.
4. Apply patch
5. Try steps 1 & 2 again. The CodeMirror editor should now load.
6. Make sure it works in both the Default and English(en) tabs.
7. BONUS: install some other language packs and look at the tabs for that language, it should still work.

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This commit is contained in:
Lucas Gass 2021-10-15 17:05:42 +00:00 committed by Jonathan Druart
parent 78db69fb56
commit 1021b1dc88

View file

@ -257,7 +257,7 @@
</li>
<li style="list-style: none;">
<label for="content_[% language.lang | html %]">Content: </label>
<textarea name="content" id="content_[% language.lang | html %]" cols="75" rows="10">[% translated_contents.item(language.lang).content | html %]</textarea>
<textarea name="content" id="content_[% language.lang | html %]" data-lang="[% language.lang | html%]" cols="75" rows="10">[% translated_contents.item(language.lang).content | html %]</textarea>
<input type="hidden" name="lang" value="[% language.lang | html %]" />
</li>
</ol>
@ -268,7 +268,7 @@
[% ELSE %]
<div id="lang_default">
<div class="clearfix">
<textarea name="content" id="content_default" cols="75" rows="10">[% additional_content.content | html %]</textarea>
<textarea name="content" id="content_default" data-lang="[% language.lang | html %]" cols="75" rows="10">[% additional_content.content | html %]</textarea>
</div>
</div>
[% END %]
@ -582,13 +582,16 @@
[% Asset.js( "lib/linters/htmlhint.min.js" ) | $raw %]
[% Asset.js( "lib/codemirror/html-lint.min.js" ) | $raw %]
<script>
var editor = CodeMirror.fromTextArea(document.getElementById('content'), {
lineNumbers: true,
lineWrapping: true,
lint: true,
mode: "text/html",
gutters: ["CodeMirror-lint-markers"],
viewportMargin: Infinity,
$("textarea[name='content']").each( function(index) {
var this_lang = $(this).attr('data-lang');
var editor = CodeMirror.fromTextArea(document.getElementById('content_' + this_lang), {
lineNumbers: true,
lineWrapping: true,
lint: true,
mode: "text/html",
gutters: ["CodeMirror-lint-markers"],
viewportMargin: Infinity,
});
});
</script>
[% ELSE %]