mirror of
https://github.com/philomena-dev/philomena.git
synced 2024-12-03 16:17:59 +01:00
allow removing existing tag with -tag, ctrl+enter for form submission, disable autocomplete on tag editor
This commit is contained in:
parent
d03b5a2c82
commit
074453ddf1
3 changed files with 28 additions and 3 deletions
|
@ -2,7 +2,7 @@
|
|||
* Fancy tag editor.
|
||||
*/
|
||||
|
||||
import { $, $$, clearEl, removeEl, showEl, hideEl, escapeHtml } from './utils/dom';
|
||||
import { $, $$, clearEl, removeEl, showEl, hideEl, escapeCss, escapeHtml } from './utils/dom';
|
||||
|
||||
function setupTagsInput(tagBlock) {
|
||||
const [ textarea, container ] = $$('.js-taginput', tagBlock);
|
||||
|
@ -29,6 +29,9 @@ function setupTagsInput(tagBlock) {
|
|||
// Respond to autocomplete form clicks
|
||||
inputField.addEventListener('autocomplete', handleAutocomplete);
|
||||
|
||||
// Respond to Ctrl+Enter shortcut
|
||||
tagBlock.addEventListener('keydown', handleCtrlEnter);
|
||||
|
||||
// TODO: Cleanup this bug fix
|
||||
// Switch to fancy tagging if user settings want it
|
||||
if (fancyEditorRequested(tagBlock)) {
|
||||
|
@ -85,11 +88,27 @@ function setupTagsInput(tagBlock) {
|
|||
|
||||
}
|
||||
|
||||
function handleCtrlEnter(event) {
|
||||
const { keyCode, ctrlKey } = event;
|
||||
if (keyCode !== 13 || !ctrlKey) return;
|
||||
|
||||
$('[type="submit"]', tagBlock.closest('form')).click();
|
||||
}
|
||||
|
||||
function insertTag(name) {
|
||||
name = name.trim(); // eslint-disable-line no-param-reassign
|
||||
|
||||
// Add if not degenerate or already present
|
||||
if (name.length === 0 || tags.indexOf(name) !== -1) return;
|
||||
|
||||
// Remove instead if the tag name starts with a minus
|
||||
if (name[0] === "-") {
|
||||
name = name.slice(1); // eslint-disable-line no-param-reassign
|
||||
tagLink = $(`[data-tag-name="${escapeCss(name)}"]`, container);
|
||||
|
||||
return removeTag(name, tagLink.parentNode);
|
||||
}
|
||||
|
||||
tags.push(name);
|
||||
textarea.value = tags.join(', ');
|
||||
|
||||
|
|
|
@ -62,8 +62,13 @@ function escapeHtml(html) {
|
|||
.replace(/"/g, '"');
|
||||
}
|
||||
|
||||
function escapeCss(css) {
|
||||
return css.replace(/\\/g, '\\\\')
|
||||
.replace(/"/g, '\\"');
|
||||
}
|
||||
|
||||
function findFirstTextNode(of) {
|
||||
return Array.prototype.filter.call(of.childNodes, el => el.nodeType === Node.TEXT_NODE)[0];
|
||||
}
|
||||
|
||||
export { $, $$, showEl, hideEl, toggleEl, clearEl, removeEl, makeEl, insertBefore, onLeftClick, whenReady, escapeHtml, findFirstTextNode };
|
||||
export { $, $$, showEl, hideEl, toggleEl, clearEl, removeEl, makeEl, insertBefore, onLeftClick, whenReady, escapeHtml, escapeCss, findFirstTextNode };
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
elixir:
|
||||
textarea_options = [
|
||||
class: "input input--wide tagsinput js-image-input js-taginput js-taginput-plain js-taginput-#{@name}",
|
||||
placeholder: "Add tags separated with commas"
|
||||
placeholder: "Add tags separated with commas",
|
||||
autocomplete: "off"
|
||||
]
|
||||
html_options = Keyword.merge(textarea_options, assigns[:extra] || [])
|
||||
|
||||
|
|
Loading…
Reference in a new issue