klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2024-11-22 06:03:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

Apply standard to easymde

Browse Source
This commit is contained in:
Antoine Bartuccio 2024-10-07 00:10:24 +02:00
parent ee965008d1
commit a3cca056ae
2 changed files with 100 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

198
core/static/webpack/easymde-index.js
View File

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

2
core/templates/core/widgets/markdown_textarea.jinja
View File

@ -6,7 +6,7 @@
<link rel="stylesheet" type="text/css" href="{{ statics.css }}" defer> <link rel="stylesheet" type="text/css" href="{{ statics.css }}" defer>
<script type="text/javascript"> <script type="text/javascript">
addEventListener("DOMContentLoaded", (event) => { addEventListener("DOMContentLoaded", (event) => {
easymde_factory( easymdeFactory(
document.getElementById("{{ widget.attrs.id }}"), document.getElementById("{{ widget.attrs.id }}"),
"{{ markdown_api_url }}", "{{ markdown_api_url }}",
); );