engineering/opencompletion.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make logged-in username clickable to profile page

Browse source 
- Chat messages: logged-in user's name links to /profile
- User lists (sidebar): logged-in user's name is clickable link
- Previous messages: same profile link logic applied
- Other users still link to /profile/username (future feature)

Anywhere the logged-in user's name appears, it now links to their
profile settings page for quick access to logout and username change.
This commit is contained in:
Russell Ballestrini 2025-11-30 10:02:58 -05:00
parent 4d93819571
commit 2a85bbe53e
1 changed files with 60 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

70
templates/chat.html
View file

@ -381,30 +381,70 @@ function updateUserLists(activeUsers, inactiveUsers) {
inactiveUserListElementMobile.innerHTML = ''; // Clear the current list (mobile)
// Populate the list with active users (desktop)
activeUsers.forEach(username => {
activeUsers.forEach(user => {
const userItem = document.createElement("li");
userItem.textContent = username;
// If it's the logged-in user, make it clickable to profile
if (user === username) {
const userLink = document.createElement("a");
userLink.href = "/profile";
userLink.textContent = user;
userLink.style.color = "var(--text-primary)";
userLink.style.textDecoration = "none";
userItem.appendChild(userLink);
} else {
userItem.textContent = user;
}
activeUserListElement.appendChild(userItem);
});
// Populate the list with inactive users (desktop)
inactiveUsers.forEach(username => {
inactiveUsers.forEach(user => {
const userItem = document.createElement("li");
userItem.textContent = username;
// If it's the logged-in user, make it clickable to profile
if (user === username) {
const userLink = document.createElement("a");
userLink.href = "/profile";
userLink.textContent = user;
userLink.style.color = "var(--text-secondary)";
userLink.style.textDecoration = "none";
userItem.appendChild(userLink);
} else {
userItem.textContent = user;
}
inactiveUserListElement.appendChild(userItem);
});
// Populate the list with active users (mobile)
activeUsers.forEach(username => {
activeUsers.forEach(user => {
const userItemMobile = document.createElement("li");
userItemMobile.textContent = username;
// If it's the logged-in user, make it clickable to profile
if (user === username) {
const userLink = document.createElement("a");
userLink.href = "/profile";
userLink.textContent = user;
userLink.style.color = "var(--text-primary)";
userLink.style.textDecoration = "none";
userItemMobile.appendChild(userLink);
} else {
userItemMobile.textContent = user;
}
activeUserListElementMobile.appendChild(userItemMobile);
});
// Populate the list with inactive users (mobile)
inactiveUsers.forEach(username => {
inactiveUsers.forEach(user => {
const userItemMobile = document.createElement("li");
userItemMobile.textContent = username;
// If it's the logged-in user, make it clickable to profile
if (user === username) {
const userLink = document.createElement("a");
userLink.href = "/profile";
userLink.textContent = user;
userLink.style.color = "var(--text-secondary)";
userLink.style.textDecoration = "none";
userItemMobile.appendChild(userLink);
} else {
userItemMobile.textContent = user;
}
inactiveUserListElementMobile.appendChild(userItemMobile);
});
}
@ -814,7 +854,14 @@ socket.on("chat_message", (data) => {
newMessage.className = "message-content";
// Check if the username is present and prepend it to the message content
const messageContent = data.username ? `**[${data.username}](/profile/${data.username}):**\n\n${data.content}` : data.content;
// Link to /profile if it's the logged-in user, otherwise /profile/username
let messageContent;
if (data.username) {
const profileLink = data.username === username ? '/profile' : `/profile/${data.username}`;
messageContent = `**[${data.username}](${profileLink}):**\n\n${data.content}`;
} else {
messageContent = data.content;
}
// Check if the message starts with a base64 image tag
if (data.content.startsWith('<img src="data:image/jpeg;base64')) {
@ -922,8 +969,11 @@ socket.on("previous_messages", (data) => {
// Directly assign the message as innerHTML if it's a base64 image
newMessage.innerHTML = data.content;
} else {
// Link to /profile if it's the logged-in user, otherwise /profile/username
const profileLink = data.username === username ? '/profile' : `/profile/${data.username}`;
const usernameLink = `**[${data.username}](${profileLink}):**`;
// Otherwise, sanitize and process the message with marked
newMessage.innerHTML = DOMPurify.sanitize(marked.marked(`**${data.username}:**\n\n${data.content}`), dompurify_config);
newMessage.innerHTML = DOMPurify.sanitize(marked.marked(`${usernameLink}\n\n${data.content}`), dompurify_config);
}
newMessage.dataset.rawMarkdown = data.content;