Made datetime/reply visible when date range is long, also fixes opacity to 1 for the last message's time display #39

Merged
retoor merged 4 commits from :bugfix/opacity-for-last-message into main 2025-05-24 01:48:07 +02:00
Conversation 0 Commits 4 Files Changed 2 +17 -1
2 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/snek/static/base.css
View File

@ -306,9 +306,10 @@ input[type="text"], .chat-input textarea {
}
}
.message:has(+ .message.switch-user), .message:last-child {
.message:has(+ .message.switch-user), .message:has(+ .message.long-time), .message:last-child {
.time {
display: block;
opacity: 1;
}
}

15
src/snek/templates/web.html
View File

@ -189,12 +189,27 @@
const messagesContainer = document.querySelector(".chat-messages");
updateTimes();
let previousUser = null;
let previousDate = null;
document.querySelectorAll(".message").forEach((message) => {
if (previousUser !== message.dataset.user_uid) {
message.classList.add("switch-user");
previousUser = message.dataset.user_uid;
previousDate = new Date(message.dataset.created_at);
} else {
message.classList.remove("switch-user");
if (!previousDate) {
previousDate = new Date(message.dataset.created_at);
} else {
const currentDate = new Date(message.dataset.created_at);
if (currentDate.getTime() - previousDate.getTime() > 1000 * 60 * 20) {
message.classList.add("long-time");
} else {
message.classList.remove("long-time");
}
previousDate = currentDate;
}
}
});
lastMessage = messagesContainer.querySelector(".message:last-child");