main/view/vue/container/inbox.vue

<template>

	<div id='CONTAINER' class='message'>

		<div v-for='(msg, id) in gstore.notif.inbox.data' :class="msg[0] == gstore.server.session.name ? 'me' : ''" :data-noauthor='id == 0 || gstore.notif.inbox.data[id-1][0] != gstore.notif.inbox.data[id][0] ? "1" : "0"'>
			<span class='author' v-text='msg[0]' v-if='id == 0 || gstore.notif.inbox.data[id-1][0] != 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(gstore.new_msg.inbox)'>
			<input type='text' placeholder='Nouveau message..' id='msg-new-content' v-model='gstore.new_msg.inbox' :class='gstore.msg_pending.inbox ? "loading" : ""'>
			<button></button>
		</form>

	</div>


</template>


<script>
export default {
	name: 'CONTAINER_INBOX',
	data(){ return { gstore: gstore.data }; },
	methods: {
		new_message(msg){

			/* (1) If empty message -> abort */
			if( msg.trim().length == 0 )
				return;

			/* (2) Send message to WebSocket */
			wsc_chat.send(JSON.stringify({message: msg}));

			/* (3) Add loader */
			gstore.data.msg_pending.inbox = true;

			/* (4) Empty input */
			this.gstore.new_msg.inbox = '';

		},
		bbcode: function(msg){
			return this.gstore.func.bbcode(msg);
		}
	}
}
</script>