diff --git a/app/templates/common/macros.html b/app/templates/common/macros.html index 943d708..99aad5a 100644 --- a/app/templates/common/macros.html +++ b/app/templates/common/macros.html @@ -98,20 +98,21 @@ {%- if idx == 0 -%} - - - - - - - - - + + + + + + + + + + {# stub: char count #} - + {%- if banned_tags -%}
Forbidden tags: diff --git a/data/static/js/bits/ui.js b/data/static/js/bits/ui.js index 2484db1..3611853 100644 --- a/data/static/js/bits/ui.js +++ b/data/static/js/bits/ui.js @@ -23,3 +23,58 @@ export function setTab(_, sender, el) { } } } + +export function insertBabycode(_, sender, el) { + if (!el.parentNode.contains(sender)) { + return; + } + + const tagStart = sender.dataset.babycodeTag; + const breakLine = 'breakLine' in sender.dataset; + const prefill = 'prefill' in sender.dataset ? sender.dataset.prefill : ''; + + const hasAttr = tagStart[tagStart.length - 1] === '='; + + let tagEnd = tagStart; + let tagInsertStart = `[${tagStart}]${breakLine ? '\n' : ''}`; + if (hasAttr) { + tagEnd = tagEnd.slice(0, -1); + } + const tagInsertEnd = `${breakLine ? '\n' : ''}[/${tagEnd}]`; + const hasSelection = el.selectionStart !== el.selectionEnd; + const text = el.value; + + if (hasSelection) { + const realStart = Math.min(el.selectionStart, el.selectionEnd); + const realEnd = Math.max(el.selectionStart, el.selectionEnd); + const selectionLength = realEnd - realStart; + + const strStart = text.slice(0, realStart); + const strEnd = text.substring(realEnd); + const frag = `${tagInsertStart}${text.slice(realStart, realEnd)}${tagInsertEnd}`; + const reconst = `${strStart}${frag}${strEnd}`; + el.value = reconst; + if (!hasAttr) { + el.setSelectionRange(realStart + tagInsertStart.length, realStart + tagInsertEnd.length + selectionLength - 1); + } else { + const attrCursor = realStart + tagInsertEnd.length - (1 + (breakLine ? 1 : 0)) + el.setSelectionRange(attrCursor, attrCursor); // cursor on attr + } + } else { + if (hasAttr) { + tagInsertStart += prefill; + } + const cursor = el.selectionStart; + const strStart = text.slice(0, cursor); + const strEnd = text.substring(cursor); + + let newCursor = strStart.length + tagInsertStart.length; + if (hasAttr) { + newCursor = cursor + tagInsertStart.length - prefill.length - (1 + (breakLine ? 1 : 0)); //cursor on attr + } + const reconst = `${strStart}${tagInsertStart}${tagInsertEnd}${strEnd}`; + el.value = reconst; + el.setSelectionRange(newCursor, newCursor); + } + el.focus(); +}