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

New client tavern fixes (#8967)

Browse Source 
* Load chat on sent

* Removed report own message

* Fixed some minor styles

* Removed extra mods

* Hide class badge

* Fixed chat alignment

* Fixed taven autocomplete
This commit is contained in:
Keith Holliday
2017-08-18 12:30:39 -06:00
committed by GitHub
parent bc499bcfbf
commit cbee0542ad
4 changed files with 88 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
website/client/components/avatar.vue
View File

@@ -40,7 +40,7 @@
span(v-if="member.items.currentMount", :class="'Mount_Head_' + member.items.currentMount")
// Pet
span.current-pet(v-if="member.items.currentPet", :class="'Pet-' + member.items.currentPet")
.class-badge.d-flex.justify-content-center(v-if="hasClass")
.class-badge.d-flex.justify-content-center(v-if="hasClass && !hideClassBadge")
.align-self-center.svg-icon(v-html="icons[member.stats.class]")
</template>
@@ -105,6 +105,10 @@ export default {
type: Boolean,
default: false,
},
hideClassBadge: {
type: Boolean,
default: false,
},
withBackground: {
type: Boolean,
},

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

@@ -11,8 +11,10 @@ div.autocomplete-selection(v-if='searchResults.length > 0', :style='autocomplete
</style>
<script>
import groupBy from 'lodash/groupBy';
export default {
props: ['selections', 'text', 'coords', 'groupId'],
props: ['selections', 'text', 'coords', 'groupId', 'chat'],
data () {
return {
currentSearch: '',
@@ -47,6 +49,14 @@ export default {
this.searchActive = true;
this.currentSearchPosition = newText.length - 1;
},
chat () {
let usersThatMessage = groupBy(this.chat, 'user');
for (let userName in usersThatMessage) {
if (this.tmpSelections.indexOf(userName) === -1) {
this.tmpSelections.push(userName);
}
}
},
async groupId () {
if (!this.groupId) return;
let members = await this.$store.dispatch('members:getGroupMembers', {groupId: this.groupId});

45
website/client/components/chat/chatMessages.vue
View File

@@ -7,16 +7,18 @@
.row
.hr.col-12
.row(v-for="(msg, index) in chat", v-if='chat && Object.keys(cachedProfileData).length > 0')
div(v-for="(msg, index) in chat", v-if='chat && Object.keys(cachedProfileData).length > 0')
// @TODO: is there a different way to do these conditionals? This creates an infinite loop
//.hr(v-if='displayDivider(msg)')
.hr-middle(v-once) {{ msg.timestamp }}
.row(v-if='user._id !== msg.uuid')
.col-2
avatar(v-if='cachedProfileData[msg.uuid]', :member="cachedProfileData[msg.uuid]", :avatarOnly="true")
.card.col-10
avatar(v-if='cachedProfileData[msg.uuid]',
:member="cachedProfileData[msg.uuid]", :avatarOnly="true",
:hideClassBadge='true')
.card.col-8
.card-block
h3.leader {{msg.user}}
h3.leader(:class='userLevelStyle(cachedProfileData[msg.uuid])') {{msg.user}}
p {{msg.timestamp | timeAgo}}
.text(v-markdown='msg.text')
hr
@@ -27,7 +29,7 @@
span.action( @click='copyAsTodo(msg)')
.svg-icon(v-html="icons.copy")
| {{$t('copyAsTodo')}}
span.action(v-if='user.contributor.admin || (!msg.sent && user.flags.communityGuidelinesAccepted)', @click='report(msg)')
span.action(v-if='user.contributor.admin || (msg.uuid !== user._id && user.flags.communityGuidelinesAccepted)', @click='report(msg)')
.svg-icon(v-html="icons.report")
| {{$t('report')}}
span.action(v-if='msg.uuid === user._id', @click='remove(msg, index)')
@@ -36,6 +38,33 @@
span.action.float-right
.svg-icon(v-html="icons.liked")
| + {{ likeCount(msg) }}
.row(v-if='user._id === msg.uuid')
.card.col-8.offset-2
.card-block
h3.leader(:class='userLevelStyle(cachedProfileData[msg.uuid])') {{msg.user}}
p {{msg.timestamp | timeAgo}}
.text(v-markdown='msg.text')
hr
.action(@click='like(msg, index)', v-if='msg.likes', :class='{active: msg.likes[user._id]}')
.svg-icon(v-html="icons.like")
span(v-if='!msg.likes[user._id]') {{ $t('like') }}
span(v-if='msg.likes[user._id]') {{ $t('liked') }}
span.action( @click='copyAsTodo(msg)')
.svg-icon(v-html="icons.copy")
| {{$t('copyAsTodo')}}
span.action(v-if='user.contributor.admin || (msg.uuid !== user._id && user.flags.communityGuidelinesAccepted)', @click='report(msg)')
.svg-icon(v-html="icons.report")
| {{$t('report')}}
span.action(v-if='msg.uuid === user._id', @click='remove(msg, index)')
.svg-icon(v-html="icons.delete")
| {{$t('delete')}}
span.action.float-right
.svg-icon(v-html="icons.liked")
| + {{ likeCount(msg) }}
.col-2
avatar(v-if='cachedProfileData[msg.uuid]',
:member="cachedProfileData[msg.uuid]", :avatarOnly="true",
:hideClassBadge='true')
</template>
<style lang="scss" scoped>
@@ -64,7 +93,7 @@
}
.card {
margin-bottom: 1em;
margin-bottom: .5em;
}
.text {
@@ -102,6 +131,7 @@ import cloneDeep from 'lodash/cloneDeep';
import { mapState } from 'client/libs/store';
import markdownDirective from 'client/directives/markdown';
import Avatar from '../avatar';
import styleHelper from 'client/mixins/styleHelper';
import copyAsTodoModal from './copyAsTodoModal';
import reportFlagModal from './reportFlagModal';
@@ -114,6 +144,7 @@ import reportIcon from 'assets/svg/report.svg';
export default {
props: ['chat', 'groupId', 'groupName'],
mixins: [styleHelper],
components: {
copyAsTodoModal,
reportFlagModal,

23
website/client/components/groups/tavern.vue
View File

@@ -11,7 +11,7 @@
.row
textarea(placeholder="Friendly reminder: this is an all-ages chat, so please keep content and language appropriate! Consult the Community Guidelines in the sidebar if you have questions.", v-model='newMessage', @keydown='updateCarretPosition')
autocomplete(:text='newMessage', v-on:select="selectedAutocomplete", :coords='coords', :groupId='groupId')
autocomplete(:text='newMessage', v-on:select="selectedAutocomplete", :coords='coords', :groupId='groupId', :chat='group.chat')
button.btn.btn-secondary.send-chat.float-right(v-once, @click='sendMessage()') {{ $t('send') }}
button.btn.btn-secondary.float-left(v-once, @click='fetchRecentMessages()') {{ $t('fetchRecentMessages') }}
@@ -197,6 +197,7 @@
.grassy-meadow-backdrop {
background-image: url('~assets/images/tavern_backdrop_web.png');
background-size: cover;
width: 100%;
height: 246px;
}
@@ -349,10 +350,10 @@ export default {
name: 'beffymaroo',
type: 'Staff',
},
{
name: 'lefnire',
type: 'Staff',
},
// {
// name: 'lefnire',
// type: 'Staff',
// },
{
name: 'Lemoness',
type: 'Staff',
@@ -397,10 +398,10 @@ export default {
name: 'Cantras',
type: 'Moderator',
},
{
name: 'Daniel the Bard',
type: 'Moderator',
},
// {
// name: 'Daniel the Bard',
// type: 'Moderator',
// },
{
name: 'deilann 5.0.5b',
type: 'Moderator',
@@ -478,6 +479,10 @@ export default {
});
this.group.chat.unshift(response.message);
this.newMessage = '';
// @TODO: I would like to not reload everytime we send. Realtime/Firebase?
let chat = await this.$store.dispatch('chat:getChat', {groupId: this.group._id});
this.group.chat = chat;
},
async fetchRecentMessages () {
this.group = await this.$store.dispatch('guilds:getGroup', {groupId: TAVERN_ID});