blob: c383e57eedc02cf0fcfda145209a4b41e1c28874 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
|
import { BaseController } from "./base_controller.js";
export class RepliesController extends BaseController {
constructor() {
super();
}
async init() {
this.comment_id = 0;
this.reply_form = await this.getReplyForm();
this.listenButtons("replies-button", this.renderReplies.bind(this));
this.listenButtons("new-reply-button", this.showReplyForm.bind(this));
}
async submit(event) {
await super.submit(event, `${this.comments_server_host}/api/comments/${this.comment_id}/replies`);
}
listenButtons(class_name, func) {
const buttons = document.getElementsByClassName(class_name);
if(buttons) {
for(let button of buttons)
button.addEventListener("click", func);
}
}
showReplyForm(event) {
const replies_section = event.target.parentElement.parentElement.childNodes[3];
const form = replies_section.querySelector(".reply-form");
if(form == null) {
replies_section.appendChild(this.reply_form);
this.setCommentId(replies_section);
this.reply_form.addEventListener("submit", this.submit.bind(this));
} else
form.remove();
}
renderReplies(event) {
/* The div to contain the comment's replies. From the element id
we can get the comment's id. */
const comment_replies_section = event.target.parentElement.parentElement.parentElement;
const present_replies = comment_replies_section.querySelector(".replies-section");
this.setCommentId(comment_replies_section);
if(present_replies != null) {
present_replies.remove();
return;
}
this.get(`/api/comments/${this.comment_id}/replies`).then((value) => {
const replies = value?.getElementById(`replies-section-${this.comment_id}`);
if(replies != null)
comment_replies_section.appendChild(replies);
});
}
setCommentId(replies_section) {
this.comment_id = /\d/.exec(replies_section.id)[0];
}
async getReplyForm() {
var form = await this.get("/api/replies/new");
return form.getElementsByClassName("reply-form")[0];
}
}
|
