cheeze.fr
/
CheezeNotes
1
0
Fork 0
Code Issues 15 Pull Requests Packages Projects Releases Wiki Activity

ajout de l'italic et autre

Browse Source
pull/1/head
Nicolas Sanchez 3 years ago
parent d2d7ab2aa4
commit 6d9f610209
5 changed files with 93 additions and 52 deletions
Show Stats Download Patch File Download Diff File

6
README.md
Unescape View File

@ -7,3 +7,9 @@ Création dynamique de pages en créant un lien dans une page.
Ranges :
https://stackoverflow.com/questions/6249095/how-to-set-the-caret-cursor-position-in-a-contenteditable-element-div
(?:^|\S): Match start or a non-whitespace
:: Match a colon
|: OR
:: Match a colon
(?:$|\S): Match end or a non-whitespace

15
static/mdnotes.css
Unescape View File

@ -31,8 +31,9 @@ div#mdnotes:focus {
div#mdnotes div.h1 {
font-size: 3rem;
margin-top: 1rem;
margin-bottom: 1.5rem;
border-bottom: 1px solid #666666;
margin-bottom: 1.3rem;
padding-bottom: 0.5rem;
border-bottom: 1px solid #dddddd;
}
div#mdnotes div.h2 {
@ -107,9 +108,13 @@ div#mdnotes div.ol3.bq1 { padding-left: 2.9rem; }
div#mdnotes div.ol3.bq2 { padding-left: 2.6rem; }
div#mdnotes div.ol3.bq3 { padding-left: 2.3rem; }
div#mdnotes div.tablecell {
display: inline-block;
}
div#mdnotes div.mdnotes_line span.token {
font-weight: 1;
color: #446699;
color: #1353b3;
overflow: hidden;
}
@ -130,6 +135,10 @@ div#mdnotes span.bold {
font-weight: bold;
}
div#mdnotes span.italic {
font-style: italic;
}
div#mdnotes span.mono {
font-family: monospace;
color: #885511;

93
static/modules/md.js
Unescape View File

@ -3,6 +3,7 @@ function load(textarea, div) {
let lines = textarea.value.split('\n');
for (let i = 0; i < lines.length; i++) {
let line = lines[i];
line = line.replace(/\t/, emsp());
let elem = formatLine(line);
div.append(elem);
}
@ -12,11 +13,15 @@ function save(textarea, div) {
let lines = div.children;
let text = '';
for (let i=0; i<lines.length; i++) {
text += lines[i].innerText + '\n';
text += lines[i].innerText.replace(emsp(), '\t') + '\n';
}
textarea.value = text;
}
function emsp() {
return ' ';
}
function onlinkin(e) {
let link = e.currentTarget;
if (document.getElementById('mdnotes') !== document.activeElement) {
@ -49,83 +54,73 @@ function onlinkout(e) {
}
function formatLine(line) {
let normLine = line.trimStart();
let token = null;
let elem = document.createElement('div');
if (normLine.match(/^####\s/i)) {
token = /^(####\s)/i;
line = line.replace('&', '&amp;');
line = line.replace('<', '&lt;');
if (line.match(/^\s*####\s/i)) {
token = /^(\s*####\s)/i;
elem.classList.add('h4');
} else if (normLine.match(/^###\s/i)) {
token = /^(###\s)/i;
} else if (line.match(/^\s*###\s/i)) {
token = /^(\s*###\s)/i;
elem.classList.add('h3');
} else if (normLine.match(/^##\s/)) {
token = /^(##\s)/i;
} else if (line.match(/^\s*##\s/)) {
token = /^(\s*##\s)/i;
elem.classList.add('h2');
} else if (normLine.match(/^#\s/i)) {
token = /^(#\s)/i;
} else if (line.match(/^\s*#\s/i)) {
token = /^(\s*#\s)/i;
elem.classList.add('h1');
} else if (normLine.match(/^>\s*>\s*>\s/i)) {
token = /^(>\s*>\s*>\s)/i;
} else if (line.match(/^\s*>\s*>\s*>\s/i)) {
token = /^(\s*>\s*>\s*>\s)/i;
elem.classList.add('bq3');
elem.classList.add('bq');
} else if (normLine.match(/^>\s*>\s/i)) {
token = /^(>\s*>\s)/i;
} else if (line.match(/^\s*>\s*>\s/i)) {
token = /^(\s*>\s*>\s)/i;
elem.classList.add('bq2');
elem.classList.add('bq');
} else if (normLine.match(/^>\s/i)) {
token = /^(>\s)/i;
} else if (line.match(/^\s*>\s/i)) {
token = /^(\s*>\s)/i;
elem.classList.add('bq1');
elem.classList.add('bq');
} else {
elem.classList.add('body');
}
if (elem.classList.contains('bq') || elem.classList.contains('body')) {
if (normLine.match(/^((>\s*){0,3}\s)?([\*\-+]\s*){3}\s/i)) {
token = /^((>\s*){0,3}([\*\-+]\s*){2})/i;
if (line.match(/^\s*((>\s*){0,3}\s)?([\*\-+]\s*){3}\s/i)) {
token = /^(\s*(>\s*){0,3}([\*\-+]\s*){2})/i;
elem.classList.add('ul3');
elem.classList.remove('body');
} else if (normLine.match(/^((>\s*){0,3}\s)?([\*\-+]\s*){2}\s/i)) {
token = /^((>\s*){0,3}[\*\-+]\s*)/i;
} else if (line.match(/^\s*((>\s*){0,3}\s)?([\*\-+]\s*){2}\s/i)) {
token = /^(\s*(>\s*){0,3}[\*\-+])/i;
elem.classList.add('ul2');
elem.classList.remove('body');
} else if (normLine.match(/^((>\s*){0,3}\s)?[\*\-+]\s/i)) {
token = /^((>\s*){1,3})/;
if (token == '') {
token = null;
}
} else if (line.match(/^\s*((>\s*){0,3}\s)?[\*\-+]\s/i)) {
token = /^(\s*(>\s*){0,3}\s*)/;
elem.classList.add('ul1');
elem.classList.remove('body');
} else if (normLine.match(/^((>\s*){0,3}\s)?([0-9]+\.){3}\s/i)) {
token = /^((>\s*){1,3})/;
if (token == '') {
token = null;
}
} else if (line.match(/^\s*((>\s*){0,3}\s)?([0-9]+\.){3}\s/i)) {
token = /^(\s*(>\s*){0,3}\s*)/;
elem.classList.add('ol3');
elem.classList.remove('body');
} else if (normLine.match(/^((>\s*){0,3}\s)?([0-9]+\.){2}\s/i)) {
token = /^((>\s*){1,3})/;
if (token == '') {
token = null;
}
} else if (line.match(/^\s*((>\s*){0,3}\s)?([0-9]+\.){2}\s/i)) {
token = /^(\s*(>\s*){0,3}\s*)/;
elem.classList.add('ol2');
elem.classList.remove('body');
} else if (normLine.match(/^((>\s*){0,3}\s)?[0-9]+\.\s/i)) {
token = /^((>\s*){1,3})/;
if (token == '') {
token = null;
}
} else if (line.match(/^\s*((>\s*){0,3}\s)?[0-9]+\.\s/i)) {
token = /^(\s*(>\s*){0,3}\s*)/;
elem.classList.add('ol1');
elem.classList.remove('body');
}
}
elem.classList.add('mdnotes_line');
normLine = addLink(normLine);
normLine = addBold(normLine);
normLine = addMono(normLine);
line = addLink(line);
line = addBold(line);
line = addItalic(line);
line = addMono(line);
if (token != null) {
normLine = normLine.replace(token, '<span class="token">$1</span>');
line = line.replace(token, '<span class="token">$1</span>');
}
elem.innerHTML = normLine;
elem.innerHTML = line;
let links = elem.getElementsByClassName('link');
for (let i=0; i<links.length; i++) {
let link = links[i];
@ -152,4 +147,10 @@ function addBold(line) {
return line;
}
export { load, save, formatLine };
function addItalic(line) {
line = line.replace(/(^|[^\*])\*([^\*\s].*?[^\*\s]|[^\*\s])\*([^\*]|$)/ig, '$1<span class="italic"><span class="token">*</span>$2<span class="token">*</span></span>$3');
line = line.replace(/(^|[^_])_([^_\s].*?[^_\s]|[^_\s])_([^_]|$)/ig, '$1<span class="italic"><span class="token">_</span>$2<span class="token">_</span></span>$3');
return line;
}
export { load, save, formatLine };

25
static/modules/mdnotes.js
Unescape View File

@ -33,6 +33,30 @@ function onedit(e) {
setStartPositionInLine(newline, position);
}
function onkeydown(e) {
if (e.key != 'Tab') {
return true;
}
e.preventDefault();
let key = '&emsp;';
let ret = getStartPositionInLine();
let line = ret[0];
let position = ret[1];
let txt = line.innerText;
if (position == 0) {
line.innerHTML = key + txt; // 4 espaces => &emsp;
} else {
line.innerHTML = txt.substring(0, position) + key + txt.substring(position, txt.length);
}
/*if (line.innerText.match(RegExp(emsp()))) {
alert('emsp');
}*/
setStartPositionInLine(line, position + 1);
onedit(e);
return false;
}
function onkeyup(e) {
if (e.key == 'Escape') {
e.preventDefault();
@ -45,6 +69,7 @@ function init() {
let mdnotesdiv = document.getElementById('mdnotes');
mdnotesdiv.addEventListener('input', onedit);
mdnotesdiv.addEventListener('keyup', onkeyup);
mdnotesdiv.addEventListener('keydown', onkeydown);
let saveButton = document.getElementById('saveButton');
saveButton.addEventListener('click', onsave);
loadButton.addEventListener('click', onload);

6
templates/index.html
Unescape View File

@ -21,9 +21,9 @@ Encore un joli texte
### Titre 3-2
T'en as marre ???
#### Titre 4
- coucou
- pas vrai
- tant pis
- coucou
- pas vrai
- tant pis
Moi oui !!!</textarea>
<div id="mdnotes" class="mdnotes" contenteditable="true"></div>
<script type="module" src="static/modules/mdnotes.js"></script>

Write Preview
Loading…
Cancel
Save