From 172b1e7c8cee31d7d9dfd4ff4155129c27807a37 Mon Sep 17 00:00:00 2001 From: Jeff Becker Date: Mon, 16 Jan 2017 14:15:50 -0500 Subject: [PATCH] add reply box thing --- contrib/js/nntpchan/post-reply.js | 186 ++++++++++++++++++++++++++++++ 1 file changed, 186 insertions(+) create mode 100644 contrib/js/nntpchan/post-reply.js diff --git a/contrib/js/nntpchan/post-reply.js b/contrib/js/nntpchan/post-reply.js new file mode 100644 index 0000000..68e5e2e --- /dev/null +++ b/contrib/js/nntpchan/post-reply.js @@ -0,0 +1,186 @@ +/** + post reply box + */ + + +function table_insert_row(table, header, items) { + var tr = document.createElement("tr"); + // insert header element + var th = document.createElement("th"); + th.appendChild(header); + tr.appendChild(th); + // insert the rest of the elements + for (var idx = 0; idx < items.length; idx ++ ) { + var elem = document.createElement("td"); + elem.appendChild(items[idx]); + tr.appendChild(elem); + } + table.appendChild(tr); +} + +/** + reply box + */ +function ReplyBox() { + var elem = document.createElement("div"); + this.elem = elem; + // reference + elem = document.createElement("input"); + elem.name = "reference"; + elem.type = "hidden"; + this.elem.appendChild(elem); + + var table = document.createElement("table"); + table.setAttribute("class", "postform"); + var tbody = document.createElement("tbody"); + + var span = document.createElement("span"); + // name + elem = document.createElement("input"); + elem.setAttribute("name", "name"); + elem.setAttribute("value", "Anonymous"); + span.appendChild(elem); + // error message + var err_elem = document.createElement("span"); + span.appendChild(err_elem); + this._error = err_elem; + table_insert_row(tbody, document.createTextNode("Name"), [span]); + + // subject + elem = document.createElement("input"); + elem.setAttribute("value", ""); + this.subject = elem; + // submit + var submit = document.createElement("button"); + submit.setAttribute("value", "reply"); + submit.setAttribute("class", "button"); + table_insert_row(tbody, document.createTextNode("Subject"), [elem, submit]); + this.submit = submit; + + // Comment + elem = document.createElement("textarea"); + elem.setAttribute("cols", "40"); + elem.setAttribute("rows", "5"); + table_insert_row(tbody, document.createTextNode("Comment"), [elem]); + this.message = elem; + + // file + elem = document.createElement("input"); + elem.setAttribute("class", "postform_attachment"); + elem.setAttribute("type", "file"); + elem.setAttribute("multiple", "multiple"); + this.files = elem; + table_insert_row(tbody, document.createTextNode("Files"), [elem]); + + // captcha + elem = document.createElement("img"); + elem.alt = "captcha"; + table_insert_row(tbody, document.createTextNode("Captcha"), [elem]); + this.captcha_img = elem; + + // captcha solution + elem = document.createElement("input"); + elem.name = "captcha"; + elem.autocomplete = "off"; + table_insert_row(tbody, document.createTextNode("Solution"), [elem]); + this.captcha_solution = elem; + table.appendChild(tbody); + this.elem.appendChild(table); +} + +ReplyBox.prototype.result = function(msg, color) { + var self = this; + self._error.innerHTML = ""; + $(self._error).css("color", color); + self._error.appendChild(document.createTextNode(msg)); + setTimeout(function() { + $(self._error).fadeout(1000, function() { + self._error.innerHTML = ""; + }); + }, 1000); +} + + +ReplyBox.prototype.makePost = function(info) { + var self = this; + var data = new FormData(); + data.append("name", self.name.value); + data.append("subject", self.subject.value); + data.append("captcha", self.captcha_solution.value); + data.append("message", self.message.value); + $(self.files.files).each(function(_, f) { + data.append("attachment_uploaded", f); + }); + data.append("reference", info.reference); + return data; +} + +ReplyBox.prototype.clear = function() { + var self = this; + self.name.value = ""; + self.subject.value = ""; + self.message.value = ""; + self.captcha_solution.value = ""; +} + +ReplyBox.prototype.reload = function() { + self.captcha_img.src = "/captcha/img?" + new Date().getTime(); +} + +ReplyBox.prototype.show = function(info) { + var self = this; + $(self.elem).css("display", "inline-block"); + self.submit.onclick = function(ev) { + $.ajax({ + data: self.makePost(info), + url: info.url, + method: "POST", + dataType: "json" + }).success(function(data, status, xhr) { + if(xhr.statusCode == 201) { + self.result("posted as "+data.message_id, "green"); + self.clear(); + self.submit.onclick = function(ev) {}; + } else { + self.result("error: " + data.error, "red"); + } + }).fail(function() { + self.result("request failed", "red"); + }).done(function() { + self.reload(); + }); + }; +} + +ReplyBox.prototype.hide = function() { + var self = this; + $(self.elem).css("display", "none"); + self.submit.onclick = function(ev) {}; +} + +onready(function(){ + var replyBox = new ReplyBox(); + replyBox.hide(); + $(".post").each(function(_, elem) { + var replyInfo = { + url: (prefix || "/") + "post/" + elem.dataset.newsgroup + "/json", + reference: elem.dataset.rootmsgid, + board: elem.dataset.newsgroup, + elem: elem + }; + var elems = elem.getElementsByClassName("postreply"); + if(elems && elems[0]) { + var e = elems[0].children[1]; + e.onclick = function(ev) { + if(!replyInfo.show) { + // is hidden, show reply + replyBox.show(replyInfo); + } else { + // is open, hide reply + replyBox.hide(); + } + replyInfo.show = ! replyInfo.show; + } + } + }); +});