apps/BareRTC
1
0
Fork 0
Code Issues 14 Pull Requests Packages Projects Releases Wiki Activity

Various fixes and improvements

Browse Source 
* Re-set user's status if they disconnect and reconnect
* Remove "(offline)" text next to ChatServer/ChatClient messages
* Make names and pictures in presence messages clickable to open profile
  cards
This commit is contained in:
Noah 2023-10-14 11:01:58 -07:00
parent 30c5538ce6
commit bdb5e6359b
3 changed files with 63 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pkg/message_filters.go
View File

@ -134,8 +134,6 @@ func pushMessageContext(sub *Subscriber, channel string, msg messages.Message) {
strings.TrimSpace(msg.Message),
))
fmt.Printf("Context %s:\n%+v\n", channel, messageContexts[channel])
// Trim the context to recent messages only.
if len(messageContexts[channel]) > messageContextSize {
messageContexts[channel] = messageContexts[channel][len(messageContexts[channel])-messageContextSize:]

50
src/App.vue
View File

@ -967,6 +967,7 @@ export default {
// WhoList updates.
onWho(msg) {
let sendMe = false; // re-send our 'me' at the end
this.whoList = msg.whoList;
this.whoOnline = {};
@ -974,15 +975,21 @@ export default {
this.whoList = [];
}
// If we had a camera open with any of these and they have gone
// off camera, close our side of the connection.
for (let row of this.whoList) {
this.whoMap[row.username] = row;
this.whoOnline[row.username] = true;
// If we had a camera open with any of these and they have gone
// off camera, close our side of the connection.
if (this.WebRTC.streams[row.username] != undefined &&
!(row.video & this.VideoFlag.Active)) {
this.closeVideo(row.username, "offerer");
}
// If the server disagrees with our current status, send our status back.
if (row.username === this.username && row.status !== this.status) {
sendMe = true;
}
}
// Hang up on mutual cameras, if they changed their setting while we
@ -992,6 +999,11 @@ export default {
// Has the back-end server forgotten we are on video? This can
// happen if we disconnect/reconnect while we were streaming.
if (this.webcam.active && !(this.whoMap[this.username]?.video & this.VideoFlag.Active)) {
sendMe = true;
}
// Do we need to set our me status again?
if (sendMe) {
this.sendMe();
}
},
@ -1670,7 +1682,7 @@ export default {
},
isUserOffline(username) {
// Return if the username is not presently online in the chat.
return this.whoOnline[username] !== true;
return this.whoOnline[username] !== true && username !== 'ChatServer' && username !== 'ChatClient';
},
avatarForUsername(username) {
if (this.whoMap[username] != undefined && this.whoMap[username].avatar) {
@ -1703,9 +1715,6 @@ export default {
if (nick) {
return nick;
}
} else if (this.whoMap[username] == undefined && username !== 'ChatServer' && username !== 'ChatClient') {
// User is not even logged in! Add this note to their name
username += " (offline)";
}
return username;
},
@ -3751,37 +3760,10 @@ export default {
</div>
<div v-for="(msg, i) in chatHistory" v-bind:key="i">
<!-- Enter chat presence messages draw as a short banner -->
<div v-if="msg.action === 'presence'" class="notification is-success is-light py-1 px-3 mb-2">
<!-- Tiny avatar next to name and action buttons -->
<div class="columns is-mobile">
<div class="column is-narrow pr-0 pt-4">
<figure class="image is-16x16">
<img v-if="avatarForUsername(msg.username)"
:src="avatarForUsername(msg.username)">
<img v-else src="/static/img/shy.png">
</figure>
</div>
<div class="column">
<!-- Timestamp on the right -->
<span class="float-right is-size-7" :title="msg.at">
{{ prettyDate(msg.at) }}
</span>
<strong>{{ nicknameForUsername(msg.username) }}</strong>
<span v-if="isUserOffline(msg.username)" class="ml-1">(offline)</span>
<small v-else class="ml-1">(@{{ msg.username }})</small>
{{ msg.message }}
</div>
</div>
</div>
<!-- Normal chat message: full size card w/ avatar -->
<MessageBox
v-else
:message="msg"
:is-presence="msg.action === 'presence'"
:appearance="messageStyle"
:position="i"
:user="getUser(msg.username)"

35
src/components/MessageBox.vue
View File

@ -5,6 +5,7 @@ import 'vue3-emoji-picker/css';
export default {
props: {
message: Object, // chat Message object
isPresence: Boolean, // presence message (joined/left room, kicked, etc.)
appearance: String, // message style appearance (cards, compact, etc.)
user: Object, // User object of the Message author
isOffline: Boolean, // user is not currently online
@ -172,8 +173,40 @@ export default {
</script>
<template>
<!-- Presence message banners -->
<div v-if="isPresence" class="notification is-success is-light py-1 px-3 mb-2">
<!-- Tiny avatar next to name and action buttons -->
<div class="columns is-mobile">
<div class="column is-narrow pr-0 pt-4">
<a :href="profileURL"
@click.prevent="openProfile()"
:class="{ 'cursor-default': !profileURL }">
<figure class="image is-16x16">
<img v-if="avatarURL" :src="avatarURL">
<img v-else src="/static/img/shy.png">
</figure>
</a>
</div>
<div class="column">
<!-- Timestamp on the right -->
<span class="float-right is-size-7" :title="message.at">
{{ prettyDate(message.at) }}
</span>
<span @click="openProfile()" class="cursor-pointer">
<strong>{{ nickname }}</strong>
<span v-if="isOffline" class="ml-1">(offline)</span>
<small v-else class="ml-1">(@{{ message.username }})</small>
</span>
{{ message.message }}
</div>
</div>
</div>
<!-- Card Style (default) -->
<div v-if="appearance === 'cards' || !appearance" class="box mb-2 px-4 pt-3 pb-1 position-relative">
<div v-else-if="appearance === 'cards' || !appearance" class="box mb-2 px-4 pt-3 pb-1 position-relative">
<div class="media mb-0">
<div class="media-left">
<a :href="profileURL"