Fix autocomplete handlers and keys and trigger it with tab

This commit is contained in:
Jiiks 2018-03-14 10:58:40 +02:00
parent 5f7ddcb8ce
commit 9e875f4039
1 changed files with 42 additions and 14 deletions

View File

@ -82,6 +82,40 @@
return uri.replace(':id', value);
},
searchEmotes(e) {
if (this.traverse(e)) return;
if (e.key === 'Tab' && this.open) {
const selected = this.emotes[this.selectedIndex];
if (!selected) return;
this.inject(selected);
this.reset();
return;
}
if (e.key === 'Tab' && !this.open) this.open = true;
if (!this.open) return;
const { selectionEnd, value } = e.target;
this.sterm = value.substr(0, selectionEnd).split(/\s+/g).pop();
if (this.sterm.length < 3) {
this.reset();
return;
}
this.title = this.sterm;
this.emotes = EmoteModule.filter(new RegExp(this.sterm, ''), 10);
this.open = this.emotes.length;
},
traverse(e) {
if (!this.open) return false;
if (e.key === 'ArrowUp') {
this.selectedIndex = (this.selectedIndex - 1) < 0 ? 9 : this.selectedIndex - 1;
return true;
}
if (e.key === 'ArrowDown') {
this.selectedIndex = (this.selectedIndex + 1) >= 10 ? 0 : this.selectedIndex + 1;
return true;
}
return false;
},
searchEmotesOLD(e) {
if (e.key === 'ArrowDown' && this.open && this.caret) {
this.selectedIndex = (this.selectedIndex + 1) >= 10 ? 0 : this.selectedIndex + 1;
return;
@ -99,7 +133,7 @@
if (e.key === 'Tab' && !this.open) this.open = true;
if (!this.open) return;
const se = e.target.selectionEnd;
this.sterm = e.target.value.substr(0, se).split(' ').slice(-1).pop();
this.sterm = e.target.value.substr(0, se).split(/\s+/g).pop();
if (this.sterm.length < 3) {
this.reset();
@ -121,19 +155,13 @@
inject(emote) {
const ta = document.querySelector('.chat textarea');
if (!ta) return;
const currentText = document.querySelector('.chat textarea').value;
const se = ta.selectionEnd;
const split = currentText.substr(0, se).split(' ');
split.pop();
split.push(`:${emote.id}:`);
const join = split.join(' ');
const rest = currentText.substr(se, currentText.length);
DOM.manip.setText(join + ' ' + rest, false);
this.emotes = [];
this.open = false;
this.selectedIndex = 0;
this.selected = '';
ta.selectionEnd = ta.selectionStart = se + `:${emote.id}:`.length - this.title.length;
const { selectionEnd, value } = ta;
const en = `:${emote.id}:`;
let substr = value.substr(0, selectionEnd);
substr = substr.replace(new RegExp(this.sterm + '$'), en);
DOM.manip.setText(substr + value.substr(selectionEnd, value.length), false);
ta.selectionEnd = ta.selectionStart = selectionEnd + en.length - this.sterm.length;
}
}
}