PonyMirrors/philomena
1
0
Fork 0
mirror of https://github.com/philomena-dev/philomena.git synced 2024-11-27 13:47:58 +01:00
Code Issues Projects Releases Packages Wiki Activity

allow removing existing tag with -tag, ctrl+enter for form submission, disable autocomplete on tag editor

Browse source
This commit is contained in:
byte[] 2020-09-14 22:00:44 -04:00
parent d03b5a2c82
commit 074453ddf1
3 changed files with 28 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
assets/js/tagsinput.js
View file

@ -2,7 +2,7 @@
* Fancy tag editor. * 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) { function setupTagsInput(tagBlock) {
const [ textarea, container ] = $$('.js-taginput', tagBlock); const [ textarea, container ] = $$('.js-taginput', tagBlock);
@ -29,6 +29,9 @@ function setupTagsInput(tagBlock) {
// Respond to autocomplete form clicks // Respond to autocomplete form clicks
inputField.addEventListener('autocomplete', handleAutocomplete); inputField.addEventListener('autocomplete', handleAutocomplete);
// Respond to Ctrl+Enter shortcut
tagBlock.addEventListener('keydown', handleCtrlEnter);
// TODO: Cleanup this bug fix // TODO: Cleanup this bug fix
// Switch to fancy tagging if user settings want it // Switch to fancy tagging if user settings want it
if (fancyEditorRequested(tagBlock)) { 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) { function insertTag(name) {
name = name.trim(); // eslint-disable-line no-param-reassign name = name.trim(); // eslint-disable-line no-param-reassign
// Add if not degenerate or already present // Add if not degenerate or already present
if (name.length === 0 || tags.indexOf(name) !== -1) return; 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); tags.push(name);
textarea.value = tags.join(', '); textarea.value = tags.join(', ');

7
assets/js/utils/dom.js
View file

@ -62,8 +62,13 @@ function escapeHtml(html) {
.replace(/"/g, '"'); .replace(/"/g, '"');
} }
function escapeCss(css) {
return css.replace(/\\/g, '\\\\')
.replace(/"/g, '\\"');
}
function findFirstTextNode(of) { function findFirstTextNode(of) {
return Array.prototype.filter.call(of.childNodes, el => el.nodeType === Node.TEXT_NODE)[0]; 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 };

3
lib/philomena_web/templates/tag/_tag_editor.html.slime
View file

@ -1,7 +1,8 @@
elixir: elixir:
textarea_options = [ textarea_options = [
class: "input input--wide tagsinput js-image-input js-taginput js-taginput-plain js-taginput-#{@name}", 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] || []) html_options = Keyword.merge(textarea_options, assigns[:extra] || [])