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

Merge branch 'rework-front' into 'master'

Browse Source 
Markdown widget follows the required attribute

See merge request ae/Sith!249
This commit is contained in:
Antoine Bartuccio 2019-10-17 14:47:56 +02:00
commit 6d0eba6bcf
1 changed files with 191 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
core/templates/core/markdown_textarea.jinja
View File

@ -5,35 +5,34 @@
{# The easymde script can be included twice, it's safe in the code #}
<script src="{{ statics.js }}"> </script>
<script type="text/javascript">
var css = "{{ statics.css }}";
var lastAPICall;
$(function() {
const css = "{{ statics.css }}";
let lastAPICall;
// Only import the css once
if (!document.head.innerHTML.includes(css)){
if (!document.head.innerHTML.includes(css)) {
document.head.innerHTML += '<link rel="stylesheet" href="' + css + '">';
}
// Custom markdown parser
function customMarkdownParser(plainText, preview) {
function customMarkdownParser(plainText, cb) {
$.ajax({
url: "{{ markdown_api_url }}",
method: "POST",
data: { text: plainText, csrfmiddlewaretoken: getCSRFToken() },
}).done(function (msg) {
preview.innerHTML = msg;
});
}).done(cb);
}
// Pretty markdown input
var easymde = new EasyMDE({
const easymde = new EasyMDE({
element: document.getElementById("{{ widget.attrs.id }}"),
spellChecker: false,
autoDownloadFontAwesome: false,
previewRender: function(plainText, preview){ // Async method
previewRender: function(plainText, preview) { // Async method
clearTimeout(lastAPICall);
lastAPICall = setTimeout(function (plainText, preview){
customMarkdownParser(plainText, preview);
}, 300, plainText, preview);
lastAPICall = setTimeout(() => {
customMarkdownParser(plainText, (msg) => preview.innerHTML = msg);
}, 300);
return preview.innerHTML;
},
forceSync: true, // Avoid validation error on generic create view
@ -65,7 +64,7 @@
{
name: "underline",
action: function customFunction(editor){
var cm = editor.codemirror;
let cm = editor.codemirror;
cm.replaceSelection('__' + cm.getSelection() + '__');
},
className: "fa fa-underline",
@ -74,7 +73,7 @@
{
name: "superscript",
action: function customFunction(editor){
var cm = editor.codemirror;
let cm = editor.codemirror;
cm.replaceSelection('<sup>' + cm.getSelection() + '</sup>');
},
className: "fa fa-superscript",
@ -83,7 +82,7 @@
{
name: "subscript",
action: function customFunction(editor){
var cm = editor.codemirror;
let cm = editor.codemirror;
cm.replaceSelection('<sub>' + cm.getSelection() + '</sub>');
},
className: "fa fa-subscript",
@ -168,5 +167,37 @@
},
]
});
const textarea = document.getElementById('{{ widget.attrs.id }}');
const submits = textarea
.closest('form')
.querySelectorAll('input[type="submit"]');
const parentDiv = textarea.parentElement;
let submitPressed = false;
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;
if (required && length == 0) {
parentDiv.style.boxShadow = 'red 0px 0px 1.5px 1px';
} else {
parentDiv.style.boxShadow = '';
}
}
function onSubmitClick(e) {
if (!submitPressed) {
easymde.codemirror.on('change', checkMarkdownInput);
}
submitPressed = true;
checkMarkdownInput(e);
}
submits.forEach((submit) => {
submit.addEventListener('click', onSubmitClick);
})
})
</script>
</div>