diff options
| -rw-r--r-- | xP/public/xP.css | 6 | ||||
| -rw-r--r-- | xP/public/xP.js | 30 |
2 files changed, 33 insertions, 3 deletions
diff --git a/xP/public/xP.css b/xP/public/xP.css index 1f4dae8..676a7ca 100644 --- a/xP/public/xP.css +++ b/xP/public/xP.css @@ -69,12 +69,16 @@ body { .toolbar { display: flex; align-items: baseline; - column-gap: .3em; + margin-right: -.3em; +} +.indicator { + margin: 0 .3em; } button { font: inherit; background: transparent; border: 1px solid transparent; + padding: 0 .3em; } button:focus { border: 1px dashed #000; diff --git a/xP/public/xP.js b/xP/public/xP.js index 7bbf530..155a8f5 100644 --- a/xP/public/xP.js +++ b/xP/public/xP.js @@ -631,7 +631,7 @@ let Buffer = { return m('.buffer', {onscroll: event => { const dom = event.target bufferAutoscroll = - dom.scrollTop + dom.clientHeight + 0.5 >= dom.scrollHeight + dom.scrollTop + dom.clientHeight + 1 >= dom.scrollHeight }}, lines) }, } @@ -687,9 +687,35 @@ let BufferContainer = { } let Toolbar = { + insert: formatting => { + let textarea = document.getElementById('input') + if (textarea === null) + return + + const [start, end] = [textarea.selectionStart, textarea.selectionEnd] + if (start === end) { + textarea.setRangeText(formatting) + textarea.setSelectionRange( + start + formatting.length, end + formatting.length) + } else { + textarea.setRangeText( + formatting + textarea.value.substr(start, end) + formatting) + } + textarea.focus() + }, + view: vnode => { + let indicator = undefined + if (bufferLog === undefined && !bufferAutoscroll) + indicator = m('.indicator', {}, '⇩') return m('.toolbar', {}, [ - bufferLog === undefined && !bufferAutoscroll ? '⇩' : undefined, + indicator, + m('button', {onclick: event => Toolbar.insert('\u0002')}, + m('b', {}, 'B')), + m('button', {onclick: event => Toolbar.insert('\u001D')}, + m('i', {}, 'I')), + m('button', {onclick: event => Toolbar.insert('\u001F')}, + m('u', {}, 'U')), m('button', {onclick: event => bufferToggleLog()}, bufferLog === undefined ? 'Log' : 'Hide log'), ]) |