//
function forum_render_messages(msgs, prefix, scroll_to) {
for (i=0; i<msgs.length; ++i) {
- forum_render_one(prefix+msgs[i], msgs[i], scroll_to);
+ forum_render_one(prefix, msgs[i], scroll_to);
}
}
// We have to put each XHR for forum_render_messages() into its own stack frame, otherwise it jumbles them together. I don't know why.
-function forum_render_one(div, msgnum, scroll_to) {
+function forum_render_one(prefix, msgnum, scroll_to) {
fetch_message = async() => {
response = await fetch("/ctdl/r/" + escapeHTMLURI(current_room) + "/" + msgs[i] + "/json");
msg = await response.json();
+ "</span>" // end header info on left side
+ "<span class=\"ctdl-msg-header-buttons\">" // begin buttons on right side
- + "<span class=\"ctdl-msg-button\"><a href=\"#\">" // Reply button FIXME make this work
+ + "<span class=\"ctdl-msg-button\">" // Reply button FIXME make this work
+ + "<a href=\"javascript:open_reply_box('"+prefix+"',"+msgnum+",false);\">"
+ "<i class=\"fa fa-reply\"></i> "
+ _("Reply")
+ "</a></span>"
- + "<span class=\"ctdl-msg-button\"><a href=\"#\">" // ReplyQuoted , only show in forums FIXME
+ + "<span class=\"ctdl-msg-button\">" // ReplyQuoted , only show in forums FIXME
+ + "<a href=\"javascript:open_reply_box('"+prefix+"',"+msgnum+",true);\">"
+ "<i class=\"fa fa-comment\"></i> "
+ _("ReplyQuoted")
+ "</a></span>"
+ "</div>" // end content
+ "</div>" // end wrapper
;
- document.getElementById(div).innerHTML = outmsg;
+ document.getElementById(prefix+msgnum).innerHTML = outmsg;
}
else {
- document.getElementById(div).innerHTML = "ERROR";
+ document.getElementById(prefix+msgnum).innerHTML = "ERROR";
}
- document.getElementById(div).style.display = "inline";
+ document.getElementById(prefix+msgnum).style.display = "inline";
if (msgnum == scroll_to) {
- window.location.hash = div;
+ document.getElementById(prefix+msgnum).scrollIntoView({behavior: "smooth", block: "start", inline: "nearest"});
}
}
fetch_message();
}
+
+
+// Open a reply box directly below a specific message
+function open_reply_box(prefix, msgnum, is_quoted) {
+ target_div_name = prefix+msgnum;
+ new_div_name = prefix + "_reply_to_" + msgnum;
+ document.getElementById(target_div_name).outerHTML += "<div id=\"" + new_div_name + "\">reply box put here</div>";
+
+ replybox =
+ "<div class=\"ctdl-msg-wrapper\">" // begin message wrapper
+ + "<div class=\"ctdl-avatar\">" // begin avatar
+ + "<img src=\"/ctdl/u/" + "FIXME my name" + "/userpic\" width=\"32\" "
+ + "onerror=\"this.parentNode.innerHTML='<i class="fa fa-user-circle fa-2x"></i> '\">"
+ + "</div>" // end avatar
+ + "<div class=\"ctdl-msg-content\">" // begin content
+ + "<div class=\"ctdl-msg-header\">" // begin header
+ + "<span class=\"ctdl-msg-header-info\">" // begin header info on left side
+ + "<span class=\"ctdl-username\"><a href=\"#\">" // FIXME link to user profile
+ + "FIXME my name"
+ + "</a></span>" // end username
+ + "<span class=\"ctdl-msgdate\">"
+ + "FIXME now time"
+ + "</span>" // end msgdate
+ + "</span>" // end header info on left side
+ + "<span class=\"ctdl-msg-header-buttons\">" // begin buttons on right side
+ + "x"
+ + "</span>"; // end buttons on right side
+ if (msg.subj) {
+ replybox +=
+ "<br><span class=\"ctdl-msgsubject\">" + "FIXME subject" + "</span>";
+ }
+ replybox +=
+ "</div><br>" // end header
+
+
+ + "<div class=\"ctdl-msg-body\" id=\"ctdl-editor-body\" style=\"padding:5px;\" contenteditable=\"true\">" // begin body
+ + "\n" // empty initial content
+ + "</div>" // end body
+
+
+ + "<div class=\"ctdl-msg-header\">" // begin footer
+ + "<span class=\"ctdl-msg-header-info\">" // begin footer info on left side
+ + "x"
+ + "</span>" // end footer info on left side
+ + "<span class=\"ctdl-msg-header-buttons\">" // begin buttons on right side
+
+ + "<span class=\"ctdl-msg-button\"><a href=\"javascript:save_message('" + new_div_name + "', '" + msgnum + "');\">"
+ + "<i class=\"fa fa-check\" style=\"color:green\"></i> " // save button
+ + _("Post message")
+ + "</a></span>"
+
+ + "<span class=\"ctdl-msg-button\"><a href=\"javascript:cancel_post('" + new_div_name + "');\">"
+ + "<i class=\"fa fa-trash\" style=\"color:red\"></i> " // cancel button
+ + _("Cancel")
+ + "</a></span>"
+
+ + "</span>" // end buttons on right side
+ + "</div><br>" // end footer
+
+
+ + "</div>" // end content
+ + "</div>" // end wrapper
+ ;
+
+ document.getElementById(new_div_name).innerHTML = replybox;
+ document.getElementById(new_div_name).scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});
+
+ // These actions must happen *after* the initial render loop completes.
+ setTimeout(function() {
+ var tag = document.getElementById("ctdl-editor-body");
+ tag.focus(); // sets the focus
+ window.getSelection().collapse(tag.firstChild, 0); // positions the cursor
+ }, 0);
+}
+
+
+// Abort a message post (it simply destroys the div)
+function cancel_post(div_name) {
+ document.getElementById(div_name).outerHTML = ""; // make it cease to exist
+}
+
+
+// Save the posted message to the server
+function save_message(div_name, reply_to_msgnum) {
+ msg_text = "<html><body>" + document.getElementById("ctdl-editor-body").innerHTML + "</body></html>\n";
+ url = "/ctdl/r/" + escapeHTMLURI(current_room) + "/dummy_name_for_new_message";
+
+ var request = new XMLHttpRequest();
+ request.open("PUT", url, true);
+ request.setRequestHeader("Content-type", "text/html");
+ request.onreadystatechange = function() {
+ if (request.readyState == 4) {
+ if (Math.trunc(request.status / 100) == 2) {
+ alert("headers: " + request.getAllResponseHeaders());
+ document.getElementById(div_name).outerHTML = ""; // close the editor
+ }
+ else {
+ error_message = request.responseText;
+ if (error_message.length == 0) {
+ error_message = _("An error has occurred.");
+ }
+ alert(error_message); // FIXME make this pretty
+ }
+ }
+ };
+ request.send(msg_text);
+}
projects / citadel.git / blobdiff