diff --git a/assets/default/js/base.js b/assets/default/js/base.js
index e7bf4909..37069d69 100644
--- a/assets/default/js/base.js
+++ b/assets/default/js/base.js
@@ -217,7 +217,7 @@ function init(description) {
(() => {
const basePath = document.querySelector('input[name="js_base_path"]').value;
const tagsSeparatorElement = document.querySelector('input[name="tags_separator"]');
- const tagsSeparator = tagsSeparatorElement ? tagsSeparatorElement.value || '\s' : '\s';
+ const tagsSeparator = tagsSeparatorElement ? tagsSeparatorElement.value || ' ' : ' ';
/**
* Handle responsive menu.
diff --git a/assets/vintage/js/base.js b/assets/vintage/js/base.js
index 66830b59..15b664ce 100644
--- a/assets/vintage/js/base.js
+++ b/assets/vintage/js/base.js
@@ -2,29 +2,36 @@ import Awesomplete from 'awesomplete';
import 'awesomplete/awesomplete.css';
(() => {
- const awp = Awesomplete.$;
const autocompleteFields = document.querySelectorAll('input[data-multiple]');
- [...autocompleteFields].forEach((autocompleteField) => {
- const awesomplete = new Awesomplete(awp(autocompleteField));
- awesomplete.filter = (text, input) => Awesomplete.FILTER_CONTAINS(text, input.match(/[^ ]*$/)[0]);
- awesomplete.replace = (text) => {
- const before = awesomplete.input.value.match(/^.+ \s*|/)[0];
- awesomplete.input.value = `${before}${text} `;
- };
- awesomplete.minChars = 1;
+ const tagsSeparatorElement = document.querySelector('input[name="tags_separator"]');
+ const tagsSeparator = tagsSeparatorElement ? tagsSeparatorElement.value || " " : " ";
- autocompleteField.addEventListener('input', () => {
- const proposedTags = autocompleteField.getAttribute('data-list').replace(/,/g, '').split(' ');
- const reg = /(\w+) /g;
- let match;
- while ((match = reg.exec(autocompleteField.value)) !== null) {
- const id = proposedTags.indexOf(match[1]);
- if (id !== -1) {
- proposedTags.splice(id, 1);
+ [...autocompleteFields].forEach((autocompleteField) => {
+ const awesome = new Awesomplete(Awesomplete.$(autocompleteField));
+
+ // Tags are separated by separator
+ awesome.filter = (text, input) => Awesomplete.FILTER_CONTAINS(
+ text,
+ input.match(new RegExp(`[^${tagsSeparator}]*$`))[0])
+ ;
+ // Insert new selected tag in the input
+ awesome.replace = (text) => {
+ const before = awesome.input.value.match(new RegExp(`^.+${tagsSeparator}+|`))[0];
+ awesome.input.value = `${before}${text}${tagsSeparator}`;
+ };
+ // Highlight found items
+ awesome.item = (text, input) => Awesomplete.ITEM(text, input.match(new RegExp(`[^${tagsSeparator}]*$`))[0]);
+ // Don't display already selected items
+ const reg = new RegExp(`/(\w+)${tagsSeparator}/g`);
+ let match;
+ awesome.data = (item, input) => {
+ while ((match = reg.exec(input))) {
+ if (item === match[1]) {
+ return '';
}
}
-
- awesomplete.list = proposedTags;
- });
+ return item;
+ };
+ awesome.minChars = 1;
});
})();
diff --git a/tpl/vintage/includes.html b/tpl/vintage/includes.html
index eac05701..2ce9da42 100644
--- a/tpl/vintage/includes.html
+++ b/tpl/vintage/includes.html
@@ -5,13 +5,13 @@
-
+
{if="$formatter==='markdown'"}
{/if}
{loop="$plugins_includes.css_files"}
-
+
{/loop}
{if="is_file('data/user.css')"}{/if}
{$search_term}
{/if}
{if="!empty($search_tags)"}
- {$exploded_tags=explode(' ', $search_tags)}
+ {$exploded_tags=tags_str2array($search_tags, $tags_separator)}
tagged
{loop="$exploded_tags"}
diff --git a/tpl/vintage/page.footer.html b/tpl/vintage/page.footer.html
index 0fe4c736..be709aeb 100644
--- a/tpl/vintage/page.footer.html
+++ b/tpl/vintage/page.footer.html
@@ -23,8 +23,6 @@
{/if}
-
-
{if="$is_logged_in"}
{/if}
@@ -34,3 +32,7 @@
{/loop}
+
+
+
+