-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fixed Login Issue and Old Home Posts Appearing When Posting On Livechat
- Loading branch information
mpbusinesscash
committed
Aug 26, 2024
1 parent
8ef6f45
commit 7113036
Showing
6 changed files
with
276 additions
and
257 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,157 +1,171 @@ | ||
| import { getUserData, userData } from './userdata.js'; | ||
| import { convertMarkdownToHTML } from './markdown.js'; | ||
|
|
||
| let currentContext = 'home'; | ||
| let currentChatID = ''; | ||
| var currentContext = 'home'; | ||
| var currentChatID = ''; | ||
| var posts = []; | ||
| var ws = null; | ||
|
|
||
| export function displayPosts(context, chatID) { | ||
| if (typeof context === 'undefined') context = currentContext; | ||
| if (typeof chatID === 'undefined') chatID = currentChatID; | ||
| posts = []; | ||
|
|
||
|
|
||
| export function displayPosts(context = currentContext, chatID = currentChatID) { | ||
| currentContext = context; | ||
| currentChatID = chatID; | ||
|
|
||
| let posts = []; | ||
|
|
||
| const data = getUserData(); | ||
| const ws = new WebSocket(`wss://server.meower.org/?v=1&token=${data.token}`); | ||
| var data = getUserData(); | ||
| if (ws) { | ||
| ws.close(); | ||
| } | ||
| ws = new WebSocket('wss://server.meower.org/?v=1&token=' + data.token); | ||
|
|
||
| const headers = data.token ? { "Token": data.token } : {}; | ||
| const url = context === "groupchats" && chatID | ||
| ? `https://api.meower.org/posts/${chatID}?page=${1}` | ||
| : `https://api.meower.org/home | ||
| ?page=${1}`; | ||
| var url = context === 'groupchats' && chatID | ||
| ? 'https://api.meower.org/posts/' + chatID + '?page=1' | ||
| : 'https://api.meower.org/home?page=1'; | ||
|
|
||
| if (currentContext === "livechat") { | ||
| if (currentContext === 'livechat') { | ||
| posts = []; | ||
| updateTable(); | ||
|
|
||
| } else { | ||
| fetch(url, { headers }) | ||
| .then(response => { | ||
| if (!response.ok) { | ||
| throw new Error('Network response was not ok'); | ||
| } | ||
| return response.json(); | ||
| }) | ||
| .then(data => { | ||
| posts.push(...data.autoget); | ||
| var xhr = new XMLHttpRequest(); | ||
| xhr.open('GET', url, true); | ||
| if (data.token) { | ||
| xhr.setRequestHeader('Token', data.token); | ||
| } | ||
| xhr.onload = function() { | ||
| if (xhr.status >= 200 && xhr.status < 300) { | ||
| var responseData = JSON.parse(xhr.responseText); | ||
| posts.push.apply(posts, responseData.autoget); | ||
| updateTable(); | ||
| }) | ||
| .catch(error => console.error("Error fetching posts:", error)); | ||
| } else { | ||
| console.error('Network response was not ok'); | ||
| } | ||
| }; | ||
| xhr.onerror = function() { | ||
| console.error('Error fetching posts:', xhr.statusText); | ||
| }; | ||
| xhr.send(); | ||
| } | ||
|
|
||
| function decodeHTML(html) { | ||
| const txt = document.createElement("textarea"); | ||
| var txt = document.createElement('textarea'); | ||
| txt.innerHTML = html; | ||
| return txt.value; | ||
| } | ||
|
|
||
| ws.onmessage = event => { | ||
| const data = JSON.parse(event.data); | ||
| console.log("Received message:", data); | ||
| ws.onmessage = function(event) { | ||
| var data = JSON.parse(event.data); | ||
| console.log('Received message:', data); | ||
|
|
||
| if ((currentContext === "livechat" && data.val.post_origin === "livechat") || (data.val.post_origin === currentChatID && currentContext === "groupchats") || (currentContext === "home" && data.val.post_origin === currentContext)) { | ||
| if ((currentContext === 'livechat' && data.val.post_origin === 'livechat') || | ||
| (currentContext === 'groupchats' && data.val.post_origin === currentChatID) || | ||
| (currentContext === 'home' && data.val.post_origin === 'home')) { | ||
| switch (data.cmd) { | ||
| case 'post': | ||
| posts.unshift(data.val); | ||
| break; | ||
| case 'update_post': | ||
| const updateIndex = posts.findIndex(post => post._id === data.val._id); | ||
| var updateIndex = findIndex(posts, function(post) { return post._id === data.val._id; }); | ||
| if (updateIndex !== -1) posts[updateIndex] = data.val; | ||
| break; | ||
| case 'delete_post': | ||
| const deleteIndex = posts.findIndex(post => post._id === data.val._id); | ||
| var deleteIndex = findIndex(posts, function(post) { return post._id === data.val._id; }); | ||
| if (deleteIndex !== -1) posts.splice(deleteIndex, 1); | ||
| break; | ||
| default: | ||
| console.warn("Unknown command:", data.cmd); | ||
| console.warn('Unknown command:', data.cmd); | ||
| } | ||
| updateTable(); | ||
| } | ||
| }; | ||
|
|
||
| function findIndex(array, predicate) { | ||
| for (var i = 0; i < array.length; i++) { | ||
| if (predicate(array[i])) return i; | ||
| } | ||
| return -1; | ||
| } | ||
|
|
||
| function updateTable() { | ||
| const table = document.getElementById("post-table"); | ||
| var table = document.getElementById('post-table'); | ||
| if (!table) { | ||
| console.error("Table element not found"); | ||
| console.error('Table element not found'); | ||
| return; | ||
| } | ||
|
|
||
| table.innerHTML = ''; | ||
|
|
||
| posts.forEach(post => { | ||
| const row = table.insertRow(); | ||
| const userImageCell = row.insertCell(); | ||
| const contentCell = row.insertCell(); | ||
| posts.forEach(function(post) { | ||
| var row = table.insertRow(); | ||
| var userImageCell = row.insertCell(); | ||
| var contentCell = row.insertCell(); | ||
|
|
||
| Object.assign(userImageCell.style, { | ||
| width: '50px', | ||
| padding: '5px', | ||
| }); | ||
| userImageCell.style.width = '50px'; | ||
| userImageCell.style.padding = '5px'; | ||
|
|
||
| Object.assign(contentCell.style, { | ||
| width: 'calc(100% - 50px)', | ||
| wordWrap: 'break-word', | ||
| wordBreak: 'break-all', | ||
| whiteSpace: 'pre-wrap' | ||
| }); | ||
| contentCell.style.width = 'calc(100% - 50px)'; | ||
| contentCell.style.wordWrap = 'break-word'; | ||
| contentCell.style.wordBreak = 'break-all'; | ||
| contentCell.style.whiteSpace = 'pre-wrap'; | ||
|
|
||
| const avatarUrl = post.author.avatar ? `https://uploads.meower.org/icons/${post.author.avatar}` : '/public/img/defaultpfp.png'; | ||
| const userColor = post.author.avatar_color || '#000'; | ||
| userImageCell.innerHTML = ` | ||
| <img src="${avatarUrl}" style="width: 50px; height: 50px; object-fit: cover;" alt="Icon"> | ||
| <hr> | ||
| <b><span style="color: ${userColor};">${post.author._id}</span></b> | ||
| `; | ||
| var avatarUrl = post.author.avatar ? 'https://uploads.meower.org/icons/' + post.author.avatar : 'pawpal/public/img/defaultpfp.png'; | ||
| var userColor = post.author.avatar_color || '#000'; | ||
| userImageCell.innerHTML = '<img src="' + avatarUrl + '" style="width: 50px; height: 50px; object-fit: cover;" alt="Icon"><hr><b><span style="color: ' + userColor + ';">' + post.author._id + '</span></b>'; | ||
|
|
||
| const icon = userImageCell.querySelector('img'); | ||
| icon.addEventListener('mouseover', async () => { | ||
| var icon = userImageCell.querySelector('img'); | ||
| icon.addEventListener('mouseover', function() { | ||
| icon.style.cursor = 'help'; | ||
| if (!icon.title) { | ||
| try { | ||
| const userInfo = await userData(post.author._id); | ||
| icon.title = `User: ${userInfo._id}\nBio: ${userInfo.quote}\nDate Joined: ${new Date(userInfo.created * 1000)}`; | ||
| } catch (error) { | ||
| console.error("Error fetching user data:", error); | ||
| icon.title = "User info not available"; | ||
| } | ||
| userData(post.author._id) | ||
| .then(function(userInfo) { | ||
| icon.title = 'User: ' + userInfo._id + '\nBio: ' + userInfo.quote + '\nDate Joined: ' + new Date(userInfo.created * 1000); | ||
| }) | ||
| .catch(function(error) { | ||
| console.error('Error fetching user data:', error); | ||
| icon.title = 'User info not available'; | ||
| }); | ||
| } | ||
| }); | ||
| icon.addEventListener('mouseout', () => icon.style.cursor = 'pointer'); | ||
| icon.addEventListener('mouseout', function() { icon.style.cursor = 'pointer'; }); | ||
|
|
||
| let postReplies = post.reply_to.map(reply => { | ||
| const replyUserColor = reply?.author.avatar_color || '#000'; | ||
| return `<blockquote id="reply"><table border="1" cellpadding="0" cellspacing="0" width="100%"><tr><td><b><font color="${replyUserColor}">${reply?.author._id}</font> said:</b></td></tr><tr><td><div style="word-wrap: break-word; word-break: break-all; max-width: 100%; white-space: pre-wrap;">${reply?.p} | ||
| </div></td></tr></table></blockquote>`; | ||
| var reply_to_attachments = post.reply_to.map(function(reply) { | ||
| return reply.attachments.map(function(attachment) { | ||
| return '\n <img src="https://uploads.meower.org/attachments/' + attachment.id + '" alt="Attachment" style="max-width: 256px; max-height: auto; object-fit: scale-down; align-self: center;">'; | ||
| }).join('\n'); | ||
| }).join('\n'); | ||
|
|
||
| var postReplies = post.reply_to.map(function(reply) { | ||
| var replyUserColor = reply && reply.author.avatar_color || '#000'; | ||
| return '<blockquote id="reply"><table border="1" cellpadding="0" cellspacing="0" width="100%"><tr><td><b><font color="' + replyUserColor + '">' + (reply && reply.author._id || '') + ' said:</font></b></td></tr><tr><td><div style="word-wrap: break-word; word-break: break-all; max-width: 100%; white-space: pre-wrap;">' + (reply && reply.p || '') + (reply_to_attachments ? '\n' + reply_to_attachments : '') + '</div></td></tr></table></blockquote>'; | ||
| }).join(''); | ||
|
|
||
| let attachments = post.attachments.map(attachment => { | ||
| return `\n <img src='https://uploads.meower.org/attachments/${attachment.id}' width='${attachment.width}' height='${attachment.height}' alt='Attachment' style='max-width: 256px; max-height: auto; object-fit: contain; align-self: center;'>`; | ||
| }).join(`\n`) | ||
|
|
||
| var attachments = post.attachments.map(function(attachment) { | ||
| return '\n <img src="https://uploads.meower.org/attachments/' + attachment.id + '" alt="Attachment" style="max-width: 256px; max-height: auto; object-fit: scale-down; align-self: center;"></img>'; | ||
| }).join('\n'); | ||
|
|
||
| postReplies += '<br>'; | ||
| postReplies = convertMarkdownToHTML(decodeHTML(postReplies)); | ||
|
|
||
| let decodedContent = DOMPurify.sanitize(post.p, { | ||
| ALLOWED_TAGS: [], | ||
| ALLOWED_ATTR: [] | ||
| }); | ||
| var decodedContent = DOMPurify.sanitize(post.p, { ALLOWED_TAGS: [], ALLOWED_ATTR: [] }); | ||
| decodedContent = decodeHTML(decodedContent); | ||
|
|
||
| contentCell.innerHTML = `${postReplies} ${convertMarkdownToHTML(decodedContent)} ${attachments}<hr>${new Date(post.t.e * 1000)} | ||
| <div style="text-align: right;"><button>Reply</button></div>`; | ||
| contentCell.innerHTML = postReplies + convertMarkdownToHTML(decodedContent) + ' ' + attachments + '<hr>' + new Date(post.t.e * 1000) + '<div style="text-align: right;"><button>Reply</button></div>'; | ||
| }); | ||
| } | ||
| } | ||
|
|
||
| document.addEventListener('DOMContentLoaded', () => { | ||
| const channelSelect = document.getElementById('channel-select'); | ||
| const currentChat = channelSelect.value; | ||
| document.addEventListener('DOMContentLoaded', function() { | ||
| var channelSelect = document.getElementById('channel-select'); | ||
| var currentChat = channelSelect.value; | ||
|
|
||
| if (currentChat === 'home') { | ||
| sendPost("home", ''); | ||
| } else | ||
| if (currentChat === 'livechat') { | ||
| sendPost("livechat", 'livechat'); | ||
| } else { | ||
| sendPost("groupchats", currentChat); | ||
| } | ||
| sendPost('home', ''); | ||
| } else if (currentChat === 'livechat') { | ||
| sendPost('livechat', 'livechat'); | ||
| } else { | ||
| sendPost('groupchats', currentChat); | ||
| } | ||
| }); |
Oops, something went wrong.