ynerant/plateforme-tfjm2
1
0
Fork 0
mirror of https://gitlab.com/animath/si/plateforme.git synced 2025-06-21 08:38:25 +02:00
Code Issues Releases Wiki Activity

Properly sort messages and add fetch previous messages ability

Browse Source 
Signed-off-by: Emmy D'Anello <emmy.danello@animath.fr>
This commit is contained in:
Emmy D'Anello
2024-04-27 14:12:08 +02:00
parent d59bb75dce
commit d617dd77c1
4 changed files with 78 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
chat/static/chat.js
View File

@ -4,6 +4,8 @@
await Notification.requestPermission()
})()
const MAX_MESSAGES = 50
let channels = {}
let messages = {}
let selected_channel_id = null
@ -61,12 +63,9 @@ function setChannels(new_channels) {
for (let channel of new_channels) {
channels[channel['id']] = channel
if (!messages[channel['id']])
messages[channel['id']] = []
messages[channel['id']] = new Map()
socket.send(JSON.stringify({
'type': 'fetch_messages',
'channel_id': channel['id'],
}))
fetchMessages(channel['id'])
}
if (new_channels && (!selected_channel_id || !channels[selected_channel_id]))
@ -78,16 +77,35 @@ function receiveMessage(message) {
redrawMessages()
}
function fetchMessages(data) {
function fetchMessages(channel_id, offset = 0, limit = MAX_MESSAGES) {
socket.send(JSON.stringify({
'type': 'fetch_messages',
'channel_id': channel_id,
'offset': offset,
'limit': limit,
}))
}
function fetchPreviousMessages() {
let channel_id = selected_channel_id
let offset = messages[channel_id].size
fetchMessages(channel_id, offset, MAX_MESSAGES)
}
function receiveFetchedMessages(data) {
let channel_id = data['channel_id']
let new_messages = data['messages']
if (!messages[channel_id])
messages[channel_id] = []
messages[channel_id] = new Map()
for (let message of new_messages) {
messages[channel_id].push(message)
}
for (let message of new_messages)
messages[channel_id].set(message['id'], message)
// Sort messages by timestamp
messages[channel_id] = new Map([...messages[channel_id].values()]
.sort((a, b) => new Date(a['timestamp']) - new Date(b['timestamp']))
.map(message => [message['id'], message]))
redrawMessages()
}
@ -99,7 +117,7 @@ function redrawMessages() {
let lastMessage = null
let lastContentDiv = null
for (let message of messages[selected_channel_id]) {
for (let message of messages[selected_channel_id].values()) {
if (lastMessage && lastMessage['author'] === message['author']) {
let lastTimestamp = new Date(lastMessage['timestamp'])
let newTimestamp = new Date(message['timestamp'])
@ -138,6 +156,12 @@ function redrawMessages() {
lastMessage = message
lastContentDiv = contentDiv
}
let fetchMoreButton = document.getElementById('fetch-previous-messages')
if (!messages[selected_channel_id] || messages[selected_channel_id].size % MAX_MESSAGES !== 0)
fetchMoreButton.classList.add('d-none')
else
fetchMoreButton.classList.remove('d-none')
}
document.addEventListener('DOMContentLoaded', () => {
@ -154,7 +178,7 @@ document.addEventListener('DOMContentLoaded', () => {
receiveMessage(data)
break
case 'fetch_messages':
fetchMessages(data)
receiveFetchedMessages(data)
break
default:
console.log(data)