forked from olcxjas-softworks/LarpixClient
add message reading
This commit is contained in:
parent
be26703908
commit
f957a081f3
4 changed files with 176 additions and 0 deletions
|
|
@ -109,6 +109,7 @@
|
||||||
//if fails continue loading encryption may be broken
|
//if fails continue loading encryption may be broken
|
||||||
console.error(e);
|
console.error(e);
|
||||||
}
|
}
|
||||||
|
await delay(600); //because we need to wair for animations
|
||||||
await refreshDms();
|
await refreshDms();
|
||||||
} else {
|
} else {
|
||||||
showBlahNotification("error:auth.failed.redirect.to.login");
|
showBlahNotification("error:auth.failed.redirect.to.login");
|
||||||
|
|
|
||||||
|
|
@ -1770,6 +1770,8 @@ async function openDm(dmId, username, targetId) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
await loadDmMessages(dmId);
|
||||||
|
|
||||||
setActiveRoombarItem(`dm-btn-${dmId}`);
|
setActiveRoombarItem(`dm-btn-${dmId}`);
|
||||||
clearAction("dmopen");
|
clearAction("dmopen");
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
|
@ -1778,3 +1780,88 @@ async function openDm(dmId, username, targetId) {
|
||||||
showBlahNotification("error:dm.open.failed");
|
showBlahNotification("error:dm.open.failed");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadDmMessages(dmId) {
|
||||||
|
try {
|
||||||
|
let payload = JSON.stringify({ string1: dmId, string2: "50", string3: "" });
|
||||||
|
let res = await fetchEncrypted("dm/messages/get", payload);
|
||||||
|
|
||||||
|
if (res && res.startsWith("error:")) {
|
||||||
|
showBlahNotification(res);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let messages = JSON.parse(res);
|
||||||
|
await renderMessages(messages);
|
||||||
|
} catch (e) {
|
||||||
|
console.error(e);
|
||||||
|
showBlahNotification("error:dm.messages.fetch.failed");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function renderMessages(messages) {
|
||||||
|
let container = document.getElementById("chat-messages");
|
||||||
|
if (!container) return;
|
||||||
|
|
||||||
|
let entries = Object.entries(messages).sort((a,b) => parseInt(a[0]) - parseInt(b[0]));
|
||||||
|
|
||||||
|
let html = "";
|
||||||
|
let lastAuthor = null;
|
||||||
|
|
||||||
|
for (let [msgId, msg] of entries) {
|
||||||
|
let content = msg.content;
|
||||||
|
|
||||||
|
if (msg.key && msg.key !== "") {
|
||||||
|
try {
|
||||||
|
content = await decryptAesGcmFromBase64(content, currentDmKey);
|
||||||
|
} catch(e) {
|
||||||
|
content = `<span style="color:var(--error-color)"><blah>error:messages.decrypt.failed</blah></span>`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
content = content.replace(/\{blah\((.*?)\)\}/g, (match, p1) => {
|
||||||
|
return processBlah(p1);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Also still process the whole thing in case it's just "dm.begin.notice" without {blah()}
|
||||||
|
content = processBlah(content);
|
||||||
|
|
||||||
|
if (msg.type === "larp.info") {
|
||||||
|
html += `<div style="text-align: center; opacity: 0.5; padding: 1rem; font-size: 0.9rem;">${content}</div>`;
|
||||||
|
lastAuthor = null;
|
||||||
|
} else {
|
||||||
|
let showAvatar = lastAuthor !== msg.author;
|
||||||
|
lastAuthor = msg.author;
|
||||||
|
|
||||||
|
let authorName = "Unknown";
|
||||||
|
let pfp = "assets/default_avatar.png";
|
||||||
|
if (msg.author !== "0") {
|
||||||
|
let fullUsername = await fetchAsync(`${url}/idtoname?id=${msg.author}`);
|
||||||
|
if (fullUsername && !fullUsername.startsWith("error:")) {
|
||||||
|
authorName = fullUsername.split(':')[0];
|
||||||
|
pfp = await getAvatarUrl(msg.author, fullUsername);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let date = new Date(parseInt(msg.timestamp));
|
||||||
|
let timeStr = date.toLocaleString();
|
||||||
|
|
||||||
|
let extraClass = showAvatar ? "with-avatar" : "";
|
||||||
|
|
||||||
|
html += `
|
||||||
|
<div class="chat-message ${extraClass}">
|
||||||
|
<img src="${showAvatar ? pfp : 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='}" class="chat-message-pfp">
|
||||||
|
<div class="chat-message-content">
|
||||||
|
${showAvatar ? `<div class="chat-message-header">
|
||||||
|
<span class="chat-message-author">${authorName}</span>
|
||||||
|
<span class="chat-message-timestamp">${timeStr}</span>
|
||||||
|
</div>` : ""}
|
||||||
|
<div class="chat-message-text">${content}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
container.innerHTML = html;
|
||||||
|
container.scrollTop = container.scrollHeight;
|
||||||
|
}
|
||||||
|
|
@ -109,6 +109,7 @@
|
||||||
//if fails continue loading encryption may be broken
|
//if fails continue loading encryption may be broken
|
||||||
console.error(e);
|
console.error(e);
|
||||||
}
|
}
|
||||||
|
await delay(600); //because we need to wair for animations
|
||||||
await refreshDms();
|
await refreshDms();
|
||||||
} else {
|
} else {
|
||||||
showBlahNotification("error:auth.failed.redirect.to.login");
|
showBlahNotification("error:auth.failed.redirect.to.login");
|
||||||
|
|
|
||||||
|
|
@ -1770,6 +1770,8 @@ async function openDm(dmId, username, targetId) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
await loadDmMessages(dmId);
|
||||||
|
|
||||||
setActiveRoombarItem(`dm-btn-${dmId}`);
|
setActiveRoombarItem(`dm-btn-${dmId}`);
|
||||||
clearAction("dmopen");
|
clearAction("dmopen");
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
|
|
@ -1778,3 +1780,88 @@ async function openDm(dmId, username, targetId) {
|
||||||
showBlahNotification("error:dm.open.failed");
|
showBlahNotification("error:dm.open.failed");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function loadDmMessages(dmId) {
|
||||||
|
try {
|
||||||
|
let payload = JSON.stringify({ string1: dmId, string2: "50", string3: "" });
|
||||||
|
let res = await fetchEncrypted("dm/messages/get", payload);
|
||||||
|
|
||||||
|
if (res && res.startsWith("error:")) {
|
||||||
|
showBlahNotification(res);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let messages = JSON.parse(res);
|
||||||
|
await renderMessages(messages);
|
||||||
|
} catch (e) {
|
||||||
|
console.error(e);
|
||||||
|
showBlahNotification("error:dm.messages.fetch.failed");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function renderMessages(messages) {
|
||||||
|
let container = document.getElementById("chat-messages");
|
||||||
|
if (!container) return;
|
||||||
|
|
||||||
|
let entries = Object.entries(messages).sort((a,b) => parseInt(a[0]) - parseInt(b[0]));
|
||||||
|
|
||||||
|
let html = "";
|
||||||
|
let lastAuthor = null;
|
||||||
|
|
||||||
|
for (let [msgId, msg] of entries) {
|
||||||
|
let content = msg.content;
|
||||||
|
|
||||||
|
if (msg.key && msg.key !== "") {
|
||||||
|
try {
|
||||||
|
content = await decryptAesGcmFromBase64(content, currentDmKey);
|
||||||
|
} catch(e) {
|
||||||
|
content = `<span style="color:var(--error-color)"><blah>error:messages.decrypt.failed</blah></span>`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
content = content.replace(/\{blah\((.*?)\)\}/g, (match, p1) => {
|
||||||
|
return processBlah(p1);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Also still process the whole thing in case it's just "dm.begin.notice" without {blah()}
|
||||||
|
content = processBlah(content);
|
||||||
|
|
||||||
|
if (msg.type === "larp.info") {
|
||||||
|
html += `<div style="text-align: center; opacity: 0.5; padding: 1rem; font-size: 0.9rem;">${content}</div>`;
|
||||||
|
lastAuthor = null;
|
||||||
|
} else {
|
||||||
|
let showAvatar = lastAuthor !== msg.author;
|
||||||
|
lastAuthor = msg.author;
|
||||||
|
|
||||||
|
let authorName = "Unknown";
|
||||||
|
let pfp = "assets/default_avatar.png";
|
||||||
|
if (msg.author !== "0") {
|
||||||
|
let fullUsername = await fetchAsync(`${url}/idtoname?id=${msg.author}`);
|
||||||
|
if (fullUsername && !fullUsername.startsWith("error:")) {
|
||||||
|
authorName = fullUsername.split(':')[0];
|
||||||
|
pfp = await getAvatarUrl(msg.author, fullUsername);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let date = new Date(parseInt(msg.timestamp));
|
||||||
|
let timeStr = date.toLocaleString();
|
||||||
|
|
||||||
|
let extraClass = showAvatar ? "with-avatar" : "";
|
||||||
|
|
||||||
|
html += `
|
||||||
|
<div class="chat-message ${extraClass}">
|
||||||
|
<img src="${showAvatar ? pfp : 'data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='}" class="chat-message-pfp">
|
||||||
|
<div class="chat-message-content">
|
||||||
|
${showAvatar ? `<div class="chat-message-header">
|
||||||
|
<span class="chat-message-author">${authorName}</span>
|
||||||
|
<span class="chat-message-timestamp">${timeStr}</span>
|
||||||
|
</div>` : ""}
|
||||||
|
<div class="chat-message-text">${content}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
container.innerHTML = html;
|
||||||
|
container.scrollTop = container.scrollHeight;
|
||||||
|
}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue