mirror of
https://github.com/philomena-dev/philomena.git
synced 2024-11-30 14:57:59 +01:00
automatically bracket inline textile formatting when required (fixes derpibooru/philomena#225, furbooru/philomena#49)
This commit is contained in:
parent
3a5b95312f
commit
0036da2b5e
1 changed files with 14 additions and 9 deletions
|
@ -8,15 +8,15 @@ import { $, $$ } from './utils/dom';
|
||||||
const textileSyntax = {
|
const textileSyntax = {
|
||||||
bold: {
|
bold: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '*', suffix: '*', shortcutKey: 'b' }
|
options: { prefix: '*', suffix: '*', shortcutKey: 'b', type: 'inline' }
|
||||||
},
|
},
|
||||||
italics: {
|
italics: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '_', suffix: '_', shortcutKey: 'i' }
|
options: { prefix: '_', suffix: '_', shortcutKey: 'i', type: 'inline' }
|
||||||
},
|
},
|
||||||
under: {
|
under: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '+', suffix: '+', shortcutKey: 'u' }
|
options: { prefix: '+', suffix: '+', shortcutKey: 'u', type: 'inline' }
|
||||||
},
|
},
|
||||||
spoiler: {
|
spoiler: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
|
@ -24,19 +24,19 @@ const textileSyntax = {
|
||||||
},
|
},
|
||||||
code: {
|
code: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '@', suffix: '@', shortcutKey: 'e' }
|
options: { prefix: '@', suffix: '@', shortcutKey: 'e', type: 'inline' }
|
||||||
},
|
},
|
||||||
strike: {
|
strike: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '-', suffix: '-' }
|
options: { prefix: '-', suffix: '-', type: 'inline' }
|
||||||
},
|
},
|
||||||
superscript: {
|
superscript: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '^', suffix: '^' }
|
options: { prefix: '^', suffix: '^', type: 'inline' }
|
||||||
},
|
},
|
||||||
subscript: {
|
subscript: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
options: { prefix: '~', suffix: '~' }
|
options: { prefix: '~', suffix: '~', type: 'inline' }
|
||||||
},
|
},
|
||||||
quote: {
|
quote: {
|
||||||
action: wrapSelection,
|
action: wrapSelection,
|
||||||
|
@ -85,7 +85,7 @@ function getSelections(textarea) {
|
||||||
|
|
||||||
function wrapSelection(textarea, options) {
|
function wrapSelection(textarea, options) {
|
||||||
const { selectedText, beforeSelection, afterSelection } = getSelections(textarea),
|
const { selectedText, beforeSelection, afterSelection } = getSelections(textarea),
|
||||||
{ text = selectedText, prefix = '', suffix = '' } = options,
|
{ text = selectedText, prefix = '', suffix = '', type } = options,
|
||||||
// For long comments, record scrollbar position to restore it later
|
// For long comments, record scrollbar position to restore it later
|
||||||
scrollTop = textarea.scrollTop,
|
scrollTop = textarea.scrollTop,
|
||||||
emptyText = text === '';
|
emptyText = text === '';
|
||||||
|
@ -97,7 +97,12 @@ function wrapSelection(textarea, options) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea.value = beforeSelection + prefix + newText + suffix + afterSelection;
|
if (type === 'inline' && newText.includes('\n')) {
|
||||||
|
textarea.value = `${beforeSelection}[${prefix}${newText}${suffix}]${afterSelection}`;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
textarea.value = `${beforeSelection}${prefix}${newText}${suffix}${afterSelection}`;
|
||||||
|
}
|
||||||
|
|
||||||
// If no text were highlighted, place the caret inside
|
// If no text were highlighted, place the caret inside
|
||||||
// the formatted section, otherwise place it at the end
|
// the formatted section, otherwise place it at the end
|
||||||
|
|
Loading…
Reference in a new issue