techwire/bang
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chat improvements

Browse Source
This commit is contained in:
Alberto Xamin 2020-12-13 12:29:28 +01:00
parent b6b8dd7dbf
commit 08287b4818
No known key found for this signature in database
GPG Key ID: 4F026F48309500A2
3 changed files with 34 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
backend/__init__.py
View File

@ -173,13 +173,14 @@ def chat_message(sid, msg):
elif '/cancelgame' in msg and ses.game.started:
ses.game.reset()
elif '/gameinfo' in msg:
sio.emit('chat_message', room=sid, data=f'info: {ses.game.__dict__}')
sio.emit('chat_message', room=sid, data={'color': f'#black','text':f'info: {ses.game.__dict__}'})
elif '/meinfo' in msg:
sio.emit('chat_message', room=sid, data=f'info: {ses.__dict__}')
sio.emit('chat_message', room=sid, data={'color': f'#black','text':f'info: {ses.__dict__}'})
else:
sio.emit('chat_message', room=sid, data=f'{msg} COMMAND NOT FOUND')
sio.emit('chat_message', room=sid, data={'color': f'#black','text':f'{msg} COMMAND NOT FOUND'})
else:
sio.emit('chat_message', room=ses.game.name, data=f'[{ses.name}]: {msg}')
color = sid.encode('utf-8').hex()[-3:]
sio.emit('chat_message', room=ses.game.name, data={'color': f'#{color}','text':f'[{ses.name}]: {msg}'})
@sio.event
def start_game(sid):

22
frontend/src/components/Chat.vue
View File

@ -2,7 +2,7 @@
<div class="chat">
<h3>{{$t("chat.chat")}}</h3>
<div id="chatbox">
<p style="margin:1pt;" class="chat-message" v-for="msg in messages" v-bind:key="msg">{{msg}}</p>
<p style="margin:1pt;" class="chat-message" v-for="msg in messages" v-bind:key="msg" :style="`color:${msg.color}`">{{msg.text}}</p>
<p class="end">.</p>
</div>
<form @submit="sendChatMessage" id="msg-form">
@ -21,10 +21,11 @@ export default {
}),
sockets: {
chat_message(msg) {
if (msg.indexOf('_') === 0) {
console.log(msg)
if ((typeof msg === "string") && msg.indexOf('_') === 0) {
let params = msg.split('|')
let type = params.shift().substring(1)
this.messages.push(this.$t(`chat.${type}`, params))
this.messages.push({text:this.$t(`chat.${type}`, params)})
}else {
this.messages.push(msg)
}
@ -45,8 +46,8 @@ export default {
</script>
<style scoped>
#chatbox {
flex: 1;
width:100%;
max-height:150px;
overflow-y: auto;
overflow-x: hidden;
overflow-wrap: break-word;
@ -61,14 +62,27 @@ input {
height: 0pt;
margin-top: -1.5pt;
}
.chat {
display: flex;
flex-direction: column;
}
#msg-form {
width:100%;
padding:0;
display:flex;
}
@media only screen and (min-width:1000px) {
.chat {
height: 90vh;
margin-left: 10pt;
}
}
@media only screen and (max-width:1000px) {
#msg-form {
flex-direction: column;
}
#chatbox {
max-height:150px;
}
}
</style>

15
frontend/src/components/Player.vue
View File

@ -20,8 +20,8 @@
<transition name="list">
<p v-if="desc"><i>{{desc}}</i></p>
</transition>
<div v-if="lives > 0">
<span>{{$t('hand')}}</span>
<div v-if="lives > 0" style="position:relative">
<span id="hand_text">{{$t('hand')}}</span>
<transition-group name="list" tag="div" class="hand">
<Card v-for="card in hand" v-bind:key="card.name+card.number" :card="card"
@click.native="play_card(card, false)"
@ -328,10 +328,9 @@ export default {
opacity: 0.5;
}
.hand {
margin-top: -16pt;
position: relative;
display:flex;
border: 1px solid #ccc;
border: 2px dashed #ccc;
padding: 10pt 40pt 0pt 40pt;
overflow:auto;
border-radius: 4pt;
@ -344,6 +343,14 @@ export default {
margin-right:35pt;
transform: translateY(-15px);
}
#hand_text{
color: #ccc;
position: absolute;
font-size: xxx-large;
font-weight: 300;
bottom: 0;
right: 10pt;
}
.equipment-slot {
display:flex;
margin: 10pt 0pt;