diff --git a/pages/index.md b/pages/index.md index 01364da..4fd0e08 100644 --- a/pages/index.md +++ b/pages/index.md @@ -37,10 +37,18 @@ La numérotation n'est pas automatique. 3.1. élément 3.1. 3.1.1. élément 3.1.1. ### Tableaux -Pour l'instant la syntaxe n'est pas complètement implémentée, il n'est pas possible d'aligner le texte. -|Nom|Prénom|Âge| -|Sanchez|Sofia|8 ans| +|:Nom:|:Prénom:|:Âge:| +|:Sanchez|:Sofia|8 ans:| |Sanchez|Paul|6 ans| |Sanchez|Elena|10 ans| |Sanchez|Sunga|44 ans| -|Sanchez|Nicolas|44 ans| \ No newline at end of file +|Sanchez|Nicolas|44 ans| +### **Gras**, *italic* etc. +|Syntaxe|Résultat| +|`**gras**`|**gras**| +|`*italic*`|*italic*| +|`__gras__`|__gras__| +|`_italic_`|_italic_| +|`***gras_italic***`|***gras_italic***| +|`___gras_italic___`|___gras_italic___| +|````texte formaté````|`texte formaté`| \ No newline at end of file diff --git a/static/mdnotes.css b/static/mdnotes.css index 2cc5a5b..6dca185 100644 --- a/static/mdnotes.css +++ b/static/mdnotes.css @@ -26,6 +26,7 @@ div#mdnotes { padding-left: 3rem; padding-right: 3rem; padding-bottom: 1rem; + margin-bottom: 3rem; background-color: #ffffff; min-height: 90%; } diff --git a/static/modules/md.js b/static/modules/md.js index 015b210..b08b843 100644 --- a/static/modules/md.js +++ b/static/modules/md.js @@ -1,23 +1,12 @@ function load(textarea, div) { div.innerHTML = ''; let lines = textarea.value.split('\n'); - let firsttableline = null; for (let i = 0; i < lines.length; i++) { let line = lines[i]; let elem = formatLine(line); div.append(elem); - if (elem.classList.contains('tablerow')) { - if (firsttableline == null) { - firsttableline = elem; - } - } else if (firsttableline != null) { - formatTable(firsttableline); - firsttableline = null; - } - } - if (firsttableline != null) { - formatTable(firsttableline); } + redrawTables(div, 0); } function save(textarea, div) { @@ -177,13 +166,14 @@ function formatLine(line) { } function addTableLine(line) { - if (line.match(/^\s*\|(\s*.*?\|)*/)) { + if (line.match(/^\s*\|:{0,1}(\s*.*?:{0,1}\|:{0,1})*/)) { let cpt = 0; - let re = /\|/g; + let re = /:{0,1}\|:{0,1}/g; let match; let matches = []; + let lengthes = [] while ((match = re.exec(line)) != null) { - matches[cpt] = match.index; + matches[cpt] = match; if (cpt > 1000) { continue; } @@ -191,25 +181,76 @@ function addTableLine(line) { } matches = matches.reverse(); for(let i=0; i|' + line.substring(index+1, line.length); - continue; - } - if (i == 0 && index == line.length - 1) { + let leftdp = ' data-dp="false"'; + if (match[0].length == 2) { + leftdp = ' data-dp="true"'; + } + let line1 = line.substring(0, match.index); + let line2 = '' + match[0] + '' + let line3 = line.substring(match.index + match[0].length, line.length); + line = line1 + line2 + line3; + } else if (i == 0 && match.index == line.length - 1) { // dernier | - line = line.substring(0, index) + '|' + line.substring(index+1, line.length); - continue; + let rightdp = ' data-dp="false"'; + if (match[0].charAt(0) == ':') { + rightdp = ' data-dp="true"'; + } + let line1 = line.substring(0, match.index); + let line2 = '' + match[0] + '' + let line3 = line.substring(match.index + match[0].length, line.length); + line = line1 + line2 + line3; + } else { + let rightdp = ' data-dp="false"'; + let leftdp = ' data-dp="false"'; + if (match[0].length == 3) { + rightdp = ' data-dp="true"'; + leftdp = ' data-dp="true"'; + } else if (match[0].length == 2) { + if (match[0].charAt(0) == ':') { + rightdp = ' data-dp="true"'; + } else { + leftdp = ' data-dp="true"'; + } + } + let line1 = line.substring(0, match.index); + let line2 = '' + match[0] + ''; + let line3 = line.substring(match.index + match[0].length, line.length); + line = line1 + line2 + line3; } - line = line.substring(0, index) + '|' + line.substring(index+1, line.length); } line = '' + line + ''; } return line; } -function formatTable(line) { +function redrawTables(mdnotes, dpwidth = 0) { + if (mdnotes.childNodes.length == 0) { + return; + } + let child = mdnotes.childNodes[0]; + let firsttableline = null; + while(child != null) { + if (firsttableline == null) { + if (child.classList.contains('tablerow')) { + firsttableline = child; + } + } else { + if (! child.classList.contains('tablerow')) { + formatTable(firsttableline, dpwidth); + firsttableline = null; + } + } + child = child.nextSibling; + } + if (firsttableline != null) { + formatTable(firsttableline, dpwidth); + } +} + +function formatTable(line, dpwidth = 0) { if (! line.classList.contains('tablerow')) { return; } @@ -228,12 +269,12 @@ function formatTable(line) { } firstline.classList.add('firsttablerow'); lastline.classList.add('lasttablerow'); - resizeTableCols(firstline, lastline) + resizeTableCols(firstline, lastline, dpwidth) } - -function resizeTableCols(firstline, lastline) { +function resizeTableCols(firstline, lastline, dpwidth) { let colsmaxwidth = []; + let colsjustif = []; let currentline = firstline; while (currentline !== null && currentline.classList.contains('tablerow')) { let tablerow = currentline.getElementsByClassName('tablerow')[0]; @@ -243,27 +284,42 @@ function resizeTableCols(firstline, lastline) { let currentleft; for(let i=0; i {redrawTables(mdnotesdiv);}); + mdnotesdiv.addEventListener('focus', () => {redrawTables(mdnotesdiv, 5.5);}); let saveButton = document.getElementById('saveButton'); saveButton.addEventListener('click', onsave); loadButton.addEventListener('click', onload);