Refactor javascript controller classes

3 files changed, 30 insertions, 16 deletions

diff --git a/static/js/controllers/base_controller.js b/static/js/controllers/base_controller.js
index c5b562f..fc05e29 100644
--- a/static/js/controllers/base_controller.js
+++ b/static/js/controllers/base_controller.js
@@ -9,6 +9,19 @@ export class BaseController {
 	this.parser = new DOMParser();
     }
 
+    async submit(event, route) {
+	event.preventDefault();
+	const form = new FormData(event.target);
+
+	try {
+	    const response = await fetch(route, { method: "POST", body: form });
+
+	    response.text().then((response_document) => {
+		this.renderSubmitResponse(response_document);
+	    });
+	} catch(error) {}
+    }
+
     getDomain() {
 	return this.comments_server_url.split('/')[2];
     }
diff --git a/static/js/controllers/comments_controller.js b/static/js/controllers/comments_controller.js
index 08f9548..8989c5a 100644
--- a/static/js/controllers/comments_controller.js
+++ b/static/js/controllers/comments_controller.js
@@ -39,18 +39,7 @@ export class CommentsController extends BaseController {
     }
 
     async submit(event) {
-	event.preventDefault();
-	var form = new FormData(event.target);
-	form.append("domain", `${window.location.protocol}//${window.location.host}`);
-
-	try {
-	    const response = await fetch(`${this.comments_server_host}/api/comments?path=${this.post}`,
-					 { method: "POST", body: form });
-	    
-	    response.text().then((response_document) => {
-		this.renderSubmitResponse(response_document);
-	    });
-	} catch(error) {}
+	super.submit(event, `${this.comments_server_host}/api/comments?path=${this.post}`);
     }
  }
 
diff --git a/static/js/controllers/replies_controller.js b/static/js/controllers/replies_controller.js
index 5e67057..5d638a5 100644
--- a/static/js/controllers/replies_controller.js
+++ b/static/js/controllers/replies_controller.js
@@ -6,11 +6,16 @@ export class RepliesController extends BaseController {
     }
 
     async init() {
+	this.comment_id = 0;
 	this.reply_form = await this.getReplyForm();
 	this.listenButtons("replies-button", this.showReplies.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);
 
@@ -24,20 +29,27 @@ export class RepliesController extends BaseController {
 	const replies_section = event.target.parentElement.parentElement.childNodes[3];
 	const form = replies_section.querySelector(".reply-form");
 
-	if(form == null) 
+	if(form == null) {
 	    replies_section.appendChild(this.reply_form);
-	else
+	    this.setCommentId(replies_section);
+	    this.reply_form.addEventListener("submit", this.submit.bind(this));
+	} else
 	    form.remove();
     }
 
     showReplies(event) {
 	/* The div to contain the comment's replies. From the element id
 	   we can get the comment's id. */
-	const replies_section = event.target.parentElement.parentElement.childNodes[3];
-	const comment_id = /\d/.exec(replies_section.id)[0];
+	this.setCommentId(event.target);
 	console.log("You're in showReplies()");
     }
 
+    setCommentId(parent) {
+	const replies_section = parent.parentElement.parentElement.childNodes[3];
+
+	this.comment_id = /\d/.exec(replies_section.id)[0];
+    }
+
     async getReplyForm() {
 	var form = await this.get("/api/replies/new");