Noah
93c13882aa
Finish implementing the basic forum features: * Pinned threads (admin or board owner only) * Edit Thread settings when you edit the top-most comment. * NoReply threads remove all the reply buttons. * Explicit forums and threads are filtered out unless opted-in (admins always see them). * Count the unique members who participated in each forum. * Get the most recently updated thread to show on forum list page. * Contact/Report page: handle receiving a comment ID to report on. Implement Likes & Notifications * Like buttons added to Photos and Profile Pages. Implemented via simple vanilla JS (likes.js) to make ajax requests to back-end to like/unlike. * Notifications: for your photo or profile being liked. If you unlike, the existing notifications about the like are revoked. * The notifications appear as an alert number in the nav bar and are read on the User Dashboard. Click to mark a notification as "read" or click the "mark all as read" button. Update DeleteUser to scrub likes, notifications, threads, and comments.
56 lines
1.8 KiB
JavaScript
56 lines
1.8 KiB
JavaScript
// Like button handler.
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const red = "has-text-danger";
|
|
let busy = false;
|
|
|
|
// Bind to the like buttons.
|
|
(document.querySelectorAll(".nonshy-like-button") || []).forEach(node => {
|
|
node.addEventListener("click", (e) => {
|
|
if (busy) return;
|
|
|
|
let $icon = node.querySelector(".icon"),
|
|
$label = node.querySelector(".nonshy-likes"),
|
|
tableName = node.dataset.tableName,
|
|
tableID = node.dataset.tableId,
|
|
liking = false;
|
|
|
|
// Toggle the color of the heart.
|
|
if ($icon.classList.contains(red)) {
|
|
$icon.classList.remove(red);
|
|
} else {
|
|
liking = true;
|
|
$icon.classList.add(red);
|
|
}
|
|
|
|
// Ajax request to backend.
|
|
busy = true;
|
|
return fetch("/v1/likes", {
|
|
method: "POST",
|
|
mode: "same-origin",
|
|
cache: "no-cache",
|
|
credentials: "same-origin",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
body: JSON.stringify({
|
|
"name": tableName, // TODO
|
|
"id": parseInt(tableID),
|
|
"unlike": !liking,
|
|
}),
|
|
})
|
|
.then((response) => response.json())
|
|
.then((data) => {
|
|
let likes = data.data.likes;
|
|
if (likes === 0) {
|
|
$label.innerHTML = "Like";
|
|
} else {
|
|
$label.innerHTML = `Like (${likes})`;
|
|
}
|
|
}).catch(resp => {
|
|
window.alert(resp);
|
|
}).finally(() => {
|
|
busy = false;
|
|
})
|
|
});
|
|
});
|
|
}); |