mirror of
https://github.com/HabitRPG/habitica.git
synced 2025-12-14 21:27:23 +01:00
16b244d5c6
* Added initial challenge pages * Added challenge item and find guilds page * Added challenge detail * Added challenge modals * Ported over challenge service code * Ported over challenge ctrl code * Added styles and column * Minor modal updates * Removed duplicate keys * Fixed casing * Added initial chat component * Added copy as todo modal * Added sync * Added chat to groups * Fixed lint * Added notification service * Added tag services * Added notifications * Added hall * Added analytics * Added http interceptor * Added initial autocomplete * Added initial footer component * Began coding and designing footer * Added inital hall * Ported over inital group plan ctrl code * Added initial invite modal * Added initial member detail modal * Added initial notification menu * Ported over inital notification code * Fixed import line * Fixed autocomplete import casing
67 lines
1.8 KiB
Vue
67 lines
1.8 KiB
Vue
<template lang="pug">
|
|
div.autocomplete-selection
|
|
div(v-for='result in searchResults', @click='select(result)') {{ result }}
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|
|
|
|
<script>
|
|
export default {
|
|
props: ['selections', 'text'],
|
|
data () {
|
|
return {
|
|
currentSearch: '',
|
|
searchActive: false,
|
|
currentSearchPosition: 0,
|
|
// @TODO: HAve this passed
|
|
tmpSelections: [
|
|
'TheHollidayInn',
|
|
'Paglias',
|
|
],
|
|
};
|
|
},
|
|
computed: {
|
|
searchResults () {
|
|
if (!this.searchActive) return [];
|
|
let currentSearch = this.text.substring(this.currentSearchPosition + 1, this.text.length);
|
|
return this.tmpSelections.filter((option) => {
|
|
return option.toLowerCase().indexOf(currentSearch.toLowerCase()) !== -1;
|
|
});
|
|
},
|
|
},
|
|
watch: {
|
|
text (newText) {
|
|
if (newText[newText.length - 1] !== '@') return;
|
|
this.searchActive = true;
|
|
this.currentSearchPosition = newText.length - 1;
|
|
},
|
|
// @TODO: implement position
|
|
// caretChanged = function(newCaretPos) {
|
|
// var relativeelement = $('.chat-form div:first');
|
|
// var textarea = $('.chat-form textarea');
|
|
// var userlist = $('.list-at-user');
|
|
// var offset = {
|
|
// x: textarea.offset().left - relativeelement.offset().left,
|
|
// y: textarea.offset().top - relativeelement.offset().top,
|
|
// };
|
|
// if(relativeelement) {
|
|
// var caretOffset = InputCaret.getPosition(textarea);
|
|
// userlist.css({
|
|
// left: caretOffset.left + offset.x,
|
|
// top: caretOffset.top + offset.y + 16
|
|
// });
|
|
// }
|
|
// }
|
|
},
|
|
methods: {
|
|
select (result) {
|
|
let newText = this.text.slice(0, this.currentSearchPosition + 1) + result;
|
|
this.searchActive = false;
|
|
this.$emit('select', newText);
|
|
},
|
|
},
|
|
};
|
|
</script>
|