krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-18 07:07:35 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(chat): replace autocomplete at @

Browse Source
This commit is contained in:
Sabe Jones
2018-11-01 15:17:01 -05:00
parent eafa2f8cdd
commit b54f031acd
2 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
website/client/components/chat/autoComplete.vue
View File

@@ -65,7 +65,7 @@ import tier9 from 'assets/svg/tier-staff.svg';
import tierNPC from 'assets/svg/tier-npc.svg'; import tierNPC from 'assets/svg/tier-npc.svg';
export default { export default {
props: ['selections', 'text', 'coords', 'chat', 'textbox'], props: ['selections', 'text', 'caretPosition', 'coords', 'chat', 'textbox'],
data () { data () {
return { return {
atRegex: new RegExp(/@[\w-]+$/), atRegex: new RegExp(/@[\w-]+$/),
@@ -142,7 +142,7 @@ export default {
if (!this.atRegex.test(newText)) return; if (!this.atRegex.test(newText)) return;
this.searchActive = true; this.searchActive = true;
this.currentSearchPosition = newText.length - 2; this.currentSearchPosition = newText.lastIndexOf('@', this.caretPosition);
}, },
chat () { chat () {
this.resetDefaults(); this.resetDefaults();

8
website/client/components/groups/chat.vue
View File

@@ -19,6 +19,7 @@
v-on:select="selectedAutocomplete", v-on:select="selectedAutocomplete",
:textbox='textbox', :textbox='textbox',
:coords='coords', :coords='coords',
:caretPosition = 'caretPosition',
:chat='group.chat') :chat='group.chat')
.row.chat-actions .row.chat-actions
@@ -56,6 +57,7 @@
data () { data () {
return { return {
newMessage: '', newMessage: '',
caretPosition: 0,
chat: { chat: {
submitDisable: false, submitDisable: false,
submitTimeout: null, submitTimeout: null,
@@ -75,7 +77,7 @@
methods: { methods: {
// https://medium.com/@_jh3y/how-to-where-s-the-caret-getting-the-xy-position-of-the-caret-a24ba372990a // https://medium.com/@_jh3y/how-to-where-s-the-caret-getting-the-xy-position-of-the-caret-a24ba372990a
getCoord (e, text) { getCoord (e, text) {
let carPos = text.selectionEnd; this.caretPosition = text.selectionEnd;
let div = document.createElement('div'); let div = document.createElement('div');
let span = document.createElement('span'); let span = document.createElement('span');
let copyStyle = getComputedStyle(text); let copyStyle = getComputedStyle(text);
@@ -86,8 +88,8 @@
div.style.position = 'absolute'; div.style.position = 'absolute';
document.body.appendChild(div); document.body.appendChild(div);
div.textContent = text.value.substr(0, carPos); div.textContent = text.value.substr(0, this.caretPosition);
span.textContent = text.value.substr(carPos) || '.'; span.textContent = text.value.substr(this.caretPosition) || '.';
div.appendChild(span); div.appendChild(span);
this.coords = { this.coords = {
TOP: span.offsetTop, TOP: span.offsetTop,