prise en compte de la vraie largeur du ":"

pull/1/head
Nicolas Sanchez 3 years ago
parent 02d0a4a107
commit 94caed69c4

@ -31,6 +31,11 @@ div#mdnotes {
min-height: 90%; min-height: 90%;
} }
div#mdnotes span.tokenfictif {
font-weight: 1;
color: #1353b3;
}
div#mdnotes:focus { div#mdnotes:focus {
outline: none; outline: none;
} }

@ -45,7 +45,7 @@ function onedit(e) {
let newline = formatLine(line.innerText); let newline = formatLine(line.innerText);
line.parentNode.replaceChild(newline, line); line.parentNode.replaceChild(newline, line);
formatTable(newline, 5.5); formatTable(newline, dpwidth());
setStartPositionInLine(newline, position); setStartPositionInLine(newline, position);
} }
@ -104,11 +104,28 @@ function oncopy(e) {
alert(e.clipboardData.getData('text/plain')); alert(e.clipboardData.getData('text/plain'));
} }
var _dpwidth = null;
function dpwidth(div) {
if (_dpwidth != null) {
return _dpwidth;
}
let dp = document.createElement('span');
dp.classList.add('tokenfictif');
div.append(dp);
dp.innerText = ':';
_dpwidth = dp.getBoundingClientRect().width;
div.removeChild(dp);
return _dpwidth;
}
function init(pagename = null) { function init(pagename = null) {
/*if (pagename != null) { /*if (pagename != null) {
window.history.replaceState(null, '', '/page/' + pagename); window.history.replaceState(null, '', '/page/' + pagename);
}*/ }*/
let mdnotesdiv = document.getElementById('mdnotes'); let mdnotesdiv = document.getElementById('mdnotes');
dpwidth(mdnotesdiv);
mdnotesdiv.addEventListener('input', onedit); mdnotesdiv.addEventListener('input', onedit);
mdnotesdiv.addEventListener('keyup', onkeyup); mdnotesdiv.addEventListener('keyup', onkeyup);
mdnotesdiv.addEventListener('keypress', onkeypress); mdnotesdiv.addEventListener('keypress', onkeypress);
@ -116,10 +133,9 @@ function init(pagename = null) {
mdnotesdiv.addEventListener('paste', onpaste); mdnotesdiv.addEventListener('paste', onpaste);
mdnotesdiv.addEventListener('copy', oncopy); mdnotesdiv.addEventListener('copy', oncopy);
mdnotesdiv.addEventListener('blur', () => {redrawTables(mdnotesdiv);}); mdnotesdiv.addEventListener('blur', () => {redrawTables(mdnotesdiv);});
mdnotesdiv.addEventListener('focus', () => {redrawTables(mdnotesdiv, 5.5);}); mdnotesdiv.addEventListener('focus', () => {redrawTables(mdnotesdiv, dpwidth());});
let saveButton = document.getElementById('saveButton'); let saveButton = document.getElementById('saveButton');
saveButton.addEventListener('click', onsave); saveButton.addEventListener('click', onsave);
loadButton.addEventListener('click', onload);
taButton.addEventListener('click', ontextarea); taButton.addEventListener('click', ontextarea);
onload(); onload();

@ -12,7 +12,7 @@
<script type="module" src="/static/modules/mdnotes.js"></script> <script type="module" src="/static/modules/mdnotes.js"></script>
</head> </head>
<body> <body>
<div><button id="saveButton">💾</button> <button id="loadButton">Load</button> <button id="taButton">📋</button></div> <div><button id="saveButton">💾</button> <button id="taButton">📋</button></div>
<textarea id="ta" class="mdnotes" style="display: none;">{{md}}</textarea> <textarea id="ta" class="mdnotes" style="display: none;">{{md}}</textarea>
<div id="mdnotes" class="mdnotes" contenteditable="true" spellcheck="false"></div> <div id="mdnotes" class="mdnotes" contenteditable="true" spellcheck="false"></div>

Loading…
Cancel
Save