main/view/vue/container/inbox.vue

66 lines
1.5 KiB
Vue

<template>
<div id='CONTAINER' class='message'>
<div v-for='msg in gstore.notif[1].data' :class="msg[0] == gstore.server.session.name ? 'me' : ''">
<span class='author' v-text='msg[0]'></span>
<span class='content' v-html='bbcode(msg[1])'></span>
</div>
<div class='end-pad'></div> <!-- End Spacing -->
<form class='msg-input' @submit.prevent='new_message'>
<input type='text' placeholder='Nouveau message..' id='msg-new-content' v-model='gstore.new_msg'>
<button></button>
</form>
</div>
</template>
<script>
export default {
name: 'CONTAINER_INBOX',
data(){ return { gstore: gstore.data }; },
methods: {
new_message(msg){
// {1} Send message //
this.gstore.func.sendMessage(this.gstore.new_msg);
// {2} Empty input //
this.gstore.new_msg = '';
},
bbcode: function(msg){
/* (1) Escape HTML
---------------------------------------------------------*/
msg = msg.replace(/&/g, '&amp;');
msg = msg.replace(/</g, '&lt;');
msg = msg.replace(/>/g, '&gt;');
/* (2) Manage text format
---------------------------------------------------------*/
/* (1) Manage bold */
msg = msg.replace(/\*([^\*]+)\*/g, "<b>$1</b>");
/* (2) italic */
msg = msg.replace(/_([^_]+)_/g, "<i>$1</i>");
/* (3) underline */
msg = msg.replace(/\[([^\]]+)\]/g, "<ins>$1</ins>");
/* (4) Code */
msg = msg.replace(/`([^`]+)`/g, "<span>$1</span>");
/* (3) Manage emojis
---------------------------------------------------------*/
return msg;
}
}
}
</script>