w0bm/f0bm
4
0
Fork 1
Code Pull Requests Activity

feat: Implement admin functionality to edit and delete comments.

Browse Source
This commit is contained in:
x
2026-01-25 04:31:23 +01:00
parent 322698cf74
commit 2c0f4f3397
4 changed files with 157 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
public/s/js/comments.js
View File

@@ -54,6 +54,7 @@ class CommentSystem {
const data = await res.json();
if (data.success) {
this.isAdmin = data.is_admin || false;
this.render(data.comments, data.user_id, data.is_subscribed);
// Priority: Explicit ID > Hash
@@ -171,6 +172,15 @@ class CommentSystem {
const content = isDeleted ? '<span class="deleted-msg">[deleted]</span>' : this.renderCommentContent(comment.content);
const date = new Date(comment.created_at).toLocaleString();
// Admin buttons
let adminButtons = '';
if (this.isAdmin && !isDeleted) {
adminButtons = `
<button class="admin-edit-btn" data-id="${comment.id}" data-content="${this.escapeHtml(comment.content)}">✏️</button>
<button class="admin-delete-btn" data-id="${comment.id}">🗑️</button>
`;
}
return `
<div class="comment ${isDeleted ? 'deleted' : ''}" id="c${comment.id}">
<div class="comment-avatar">
@@ -182,6 +192,7 @@ class CommentSystem {
<span class="comment-time">${date}</span>
<a href="#c${comment.id}" class="comment-permalink">#${comment.id}</a>
${!isDeleted && currentUserId ? `<button class="reply-btn" data-id="${comment.id}">Reply</button>` : ''}
${adminButtons}
</div>
<div class="comment-content">${content}</div>
${comment.children.length > 0 ? `<div class="comment-children">${comment.children.map(c => this.renderComment(c, currentUserId)).join('')}</div>` : ''}
@@ -238,6 +249,62 @@ class CommentSystem {
});
});
// Admin Delete
this.container.querySelectorAll('.admin-delete-btn').forEach(btn => {
btn.addEventListener('click', async (e) => {
if (!confirm('Admin: Delete this comment?')) return;
const id = e.target.dataset.id;
const res = await fetch(`/api/comments/${id}/delete`, { method: 'POST' });
const json = await res.json();
if (json.success) this.loadComments(id);
else alert('Failed to delete: ' + (json.message || 'Error'));
});
});
// Admin Edit
this.container.querySelectorAll('.admin-edit-btn').forEach(btn => {
btn.addEventListener('click', (e) => {
const id = e.target.dataset.id;
const currentContent = e.target.dataset.content;
const commentEl = document.getElementById('c' + id);
const contentEl = commentEl.querySelector('.comment-content');
// Replace content with textarea
const originalHtml = contentEl.innerHTML;
contentEl.innerHTML = `
<textarea class="edit-textarea">${currentContent}</textarea>
<div class="edit-actions">
<button class="save-edit-btn">Save</button>
<button class="cancel-edit-btn">Cancel</button>
</div>
`;
contentEl.querySelector('.cancel-edit-btn').addEventListener('click', () => {
contentEl.innerHTML = originalHtml;
});
contentEl.querySelector('.save-edit-btn').addEventListener('click', async () => {
const newContent = contentEl.querySelector('.edit-textarea').value;
if (!newContent.trim()) return alert('Cannot be empty');
const params = new URLSearchParams();
params.append('content', newContent);
const res = await fetch(`/api/comments/${id}/edit`, {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: params
});
const json = await res.json();
if (json.success) {
this.loadComments(id);
} else {
alert('Failed to edit: ' + (json.message || 'Error'));
}
});
});
});
// Reply
this.container.querySelectorAll('.reply-btn').forEach(btn => {
btn.addEventListener('click', (e) => {