diff --git a/core/static/webpack/easymde-index.js b/core/static/webpack/easymde-index.js
index d3495269..1200df14 100644
--- a/core/static/webpack/easymde-index.js
+++ b/core/static/webpack/easymde-index.js
@@ -9,181 +9,181 @@ import EasyMDE from 'easymde'
* @param {HTMLTextAreaElement} textarea to use
* @param {string} link to the markdown api
**/
-function easymde_factory (textarea, markdown_api_url) {
+export function easymdeFactory (textarea, markdownApiURL) {
const easymde = new EasyMDE({
element: textarea,
spellChecker: false,
autoDownloadFontAwesome: false,
previewRender: Alpine.debounce(async (plainText, preview) => {
- const res = await fetch(markdown_api_url, {
- method: "POST",
- body: JSON.stringify({ text: plainText }),
- });
- preview.innerHTML = await res.text();
- return null;
+ const res = await fetch(markdownApiURL, {
+ method: 'POST',
+ body: JSON.stringify({ text: plainText })
+ })
+ preview.innerHTML = await res.text()
+ return null
}, 300),
forceSync: true, // Avoid validation error on generic create view
toolbar: [
{
- name: "heading-smaller",
+ name: 'heading-smaller',
action: EasyMDE.toggleHeadingSmaller,
- className: "fa fa-header",
- title: gettext("Heading"),
+ className: 'fa fa-header',
+ title: gettext('Heading')
},
{
- name: "italic",
+ name: 'italic',
action: EasyMDE.toggleItalic,
- className: "fa fa-italic",
- title: gettext("Italic"),
+ className: 'fa fa-italic',
+ title: gettext('Italic')
},
{
- name: "bold",
+ name: 'bold',
action: EasyMDE.toggleBold,
- className: "fa fa-bold",
- title: gettext("Bold"),
+ className: 'fa fa-bold',
+ title: gettext('Bold')
},
{
- name: "strikethrough",
+ name: 'strikethrough',
action: EasyMDE.toggleStrikethrough,
- className: "fa fa-strikethrough",
- title: gettext("Strikethrough"),
+ className: 'fa fa-strikethrough',
+ title: gettext('Strikethrough')
},
{
- name: "underline",
- action: function customFunction(editor) {
- let cm = editor.codemirror;
- cm.replaceSelection("__" + cm.getSelection() + "__");
+ name: 'underline',
+ action: function customFunction (editor) {
+ const cm = editor.codemirror
+ cm.replaceSelection('__' + cm.getSelection() + '__')
},
- className: "fa fa-underline",
- title: gettext("Underline"),
+ className: 'fa fa-underline',
+ title: gettext('Underline')
},
{
- name: "superscript",
- action: function customFunction(editor) {
- let cm = editor.codemirror;
- cm.replaceSelection("^" + cm.getSelection() + "^");
+ name: 'superscript',
+ action: function customFunction (editor) {
+ const cm = editor.codemirror
+ cm.replaceSelection('^' + cm.getSelection() + '^')
},
- className: "fa fa-superscript",
- title: gettext("Superscript"),
+ className: 'fa fa-superscript',
+ title: gettext('Superscript')
},
{
- name: "subscript",
- action: function customFunction(editor) {
- let cm = editor.codemirror;
- cm.replaceSelection("~" + cm.getSelection() + "~");
+ name: 'subscript',
+ action: function customFunction (editor) {
+ const cm = editor.codemirror
+ cm.replaceSelection('~' + cm.getSelection() + '~')
},
- className: "fa fa-subscript",
- title: gettext("Subscript"),
+ className: 'fa fa-subscript',
+ title: gettext('Subscript')
},
{
- name: "code",
+ name: 'code',
action: EasyMDE.toggleCodeBlock,
- className: "fa fa-code",
- title: gettext("Code"),
+ className: 'fa fa-code',
+ title: gettext('Code')
},
- "|",
+ '|',
{
- name: "quote",
+ name: 'quote',
action: EasyMDE.toggleBlockquote,
- className: "fa fa-quote-left",
- title: gettext("Quote"),
+ className: 'fa fa-quote-left',
+ title: gettext('Quote')
},
{
- name: "unordered-list",
+ name: 'unordered-list',
action: EasyMDE.toggleUnorderedList,
- className: "fa fa-list-ul",
- title: gettext("Unordered list"),
+ className: 'fa fa-list-ul',
+ title: gettext('Unordered list')
},
{
- name: "ordered-list",
+ name: 'ordered-list',
action: EasyMDE.toggleOrderedList,
- className: "fa fa-list-ol",
- title: gettext("Ordered list"),
+ className: 'fa fa-list-ol',
+ title: gettext('Ordered list')
},
- "|",
+ '|',
{
- name: "link",
+ name: 'link',
action: EasyMDE.drawLink,
- className: "fa fa-link",
- title: gettext("Insert link"),
+ className: 'fa fa-link',
+ title: gettext('Insert link')
},
{
- name: "image",
+ name: 'image',
action: EasyMDE.drawImage,
- className: "fa-regular fa-image",
- title: gettext("Insert image"),
+ className: 'fa-regular fa-image',
+ title: gettext('Insert image')
},
{
- name: "table",
+ name: 'table',
action: EasyMDE.drawTable,
- className: "fa fa-table",
- title: gettext("Insert table"),
+ className: 'fa fa-table',
+ title: gettext('Insert table')
},
- "|",
+ '|',
{
- name: "clean-block",
+ name: 'clean-block',
action: EasyMDE.cleanBlock,
- className: "fa fa-eraser fa-clean-block",
- title: gettext("Clean block"),
+ className: 'fa fa-eraser fa-clean-block',
+ title: gettext('Clean block')
},
- "|",
+ '|',
{
- name: "preview",
+ name: 'preview',
action: EasyMDE.togglePreview,
- className: "fa fa-eye no-disable",
- title: gettext("Toggle preview"),
+ className: 'fa fa-eye no-disable',
+ title: gettext('Toggle preview')
},
{
- name: "side-by-side",
+ name: 'side-by-side',
action: EasyMDE.toggleSideBySide,
- className: "fa fa-columns no-disable no-mobile",
- title: gettext("Toggle side by side"),
+ className: 'fa fa-columns no-disable no-mobile',
+ title: gettext('Toggle side by side')
},
{
- name: "fullscreen",
+ name: 'fullscreen',
action: EasyMDE.toggleFullScreen,
- className: "fa fa-arrows-alt no-disable no-mobile",
- title: gettext("Toggle fullscreen"),
+ className: 'fa fa-expand no-mobile',
+ title: gettext('Toggle fullscreen')
},
- "|",
+ '|',
{
- name: "guide",
- action: "/page/Aide_sur_la_syntaxe",
- className: "fa fa-question-circle",
- title: gettext("Markdown guide"),
- },
- ],
- });
+ name: 'guide',
+ action: '/page/Aide_sur_la_syntaxe',
+ className: 'fa fa-question-circle',
+ title: gettext('Markdown guide')
+ }
+ ]
+ })
const submits = textarea
- .closest("form")
- .querySelectorAll('input[type="submit"]');
- const parentDiv = textarea.parentElement;
- let submitPressed = false;
+ .closest('form')
+ .querySelectorAll('input[type="submit"]')
+ const parentDiv = textarea.parentElement
+ let submitPressed = false
- function checkMarkdownInput(e) {
+ function checkMarkdownInput (e) {
// an attribute is null if it does not exist, else a string
- const required = textarea.getAttribute("required") != null;
- const length = textarea.value.trim().length;
+ const required = textarea.getAttribute('required') != null
+ const length = textarea.value.trim().length
- if (required && length == 0) {
- parentDiv.style.boxShadow = "red 0px 0px 1.5px 1px";
+ if (required && length === 0) {
+ parentDiv.style.boxShadow = 'red 0px 0px 1.5px 1px'
} else {
- parentDiv.style.boxShadow = "";
+ parentDiv.style.boxShadow = ''
}
}
- function onSubmitClick(e) {
+ function onSubmitClick (e) {
if (!submitPressed) {
- easymde.codemirror.on("change", checkMarkdownInput);
+ easymde.codemirror.on('change', checkMarkdownInput)
}
- submitPressed = true;
- checkMarkdownInput(e);
+ submitPressed = true
+ checkMarkdownInput(e)
}
submits.forEach((submit) => {
- submit.addEventListener("click", onSubmitClick);
- });
+ submit.addEventListener('click', onSubmitClick)
+ })
};
-window.easymde_factory = easymde_factory;
+window.easymdeFactory = easymdeFactory
diff --git a/core/templates/core/widgets/markdown_textarea.jinja b/core/templates/core/widgets/markdown_textarea.jinja
index ea73b197..1a35056d 100644
--- a/core/templates/core/widgets/markdown_textarea.jinja
+++ b/core/templates/core/widgets/markdown_textarea.jinja
@@ -6,7 +6,7 @@