Lucas/Pooru
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

site: refactor search component a bit

Browse source 
Move external functions into the object and improve naming.
This commit is contained in:
Lucas Gabriel Vuotto 2025-04-28 19:26:59 +00:00
parent f4f059578d
commit 3ea1283af8
1 changed files with 21 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

37
public/js/app.js
View file

@ -1,11 +1,3 @@
function getCurrentWordFromCursor(s, cursor) {
return s.substring(s.lastIndexOf(' ', cursor - 1) + 1, cursor);
}
function mySplice(s, idx, del, n) {
return s.substring(0, idx) + n + s.substring(idx + del);
}
document.addEventListener('alpine:init', () => {
Alpine.data('tagsSuggestions', (initialSearch = '') => ({
items: [],
@ -19,9 +11,14 @@ document.addEventListener('alpine:init', () => {
return this.items.toSorted((a, b) => b.count - a.count);
},
getCurrentWordFromCursor() {
let s = this.$refs.search.value;
return s.substring(s.lastIndexOf(' ', this.cursor - 1) + 1, this.cursor);
},
async fetchSuggestions() {
const currentWord = getCurrentWordFromCursor(this.$refs.search.value,
this.cursor);
const currentWord = this.getCurrentWordFromCursor();
if (!currentWord)
return;
if (currentWord === this.currentWord) {
@ -50,23 +47,31 @@ document.addEventListener('alpine:init', () => {
await this.fetchSuggestions();
},
insertSuggestionAtCursor() {
const position = Math.max(this.cursor - this.currentWord.length, 0);
const suggestion = this.items[this.activeItem ?? 0].display;
const oldValue = this.$refs.search.value;
this.$refs.search.value = oldValue.substring(0, position) +
suggestion + ' ' +
oldValue.substring(position + this.currentWord.length);
this.cursor = position + suggestion.length + 1;
},
autocompleteSuggestion() {
if (this.items.length === 0)
return;
const pos = Math.max(this.cursor - this.currentWord.length, 0);
const tag = this.items[this.activeItem ?? 0].display;
this.insertSuggestionAtCursor();
this.items = [];
this.activeItem = null;
this.$refs.search.value = mySplice(this.$refs.search.value, pos,
this.currentWord.length, tag + ' ');
this.cursor = pos + tag.length + 1;
this.currentWord = '';
this.open = false;
this.$refs.search.selectionStart = this.$refs.search.selectionEnd =
this.cursor;
this.$refs.search.focus();
this.$refs.search.setSelectionRange(this.cursor, this.cursor);
},
autocompleteItem(evt) {