Files
nairobi/app/assets/javascripts/comments.js
Senén Rodero Rodríguez dcff7e8a33 Show parent comment responses when a new reply is added
When a user replies to a comment whose responses was hidden at the
moment of reply form submission and although the reply were correctly
added to the DOM it was hidden because was added to a collapsed list.

This solution is about showing all responses of parent comment after adding
the new comment to the DOM so the user can see new reply into the screen.
(This is not applicable to root comments which cannot be collapsed)
2020-05-26 13:20:26 +02:00

55 lines
1.8 KiB
JavaScript

(function() {
"use strict";
App.Comments = {
add_comment: function(parent_selector, response_html) {
$(parent_selector + " .comment-list:first").prepend($(response_html));
var hidden_responses = $(parent_selector + " .comment-list:first").is(":hidden");
if (parent_selector && hidden_responses) {
$(parent_selector).find(".comment-list:first").toggle("slow");
}
this.update_comments_count();
},
update_comments_count: function() {
$(".js-comments-count").each(function() {
var new_val;
new_val = $(this).text().trim().replace(/\d+/, function(match) {
return parseInt(match, 10) + 1;
});
$(this).text(new_val);
});
},
update_responses_count: function(comment_id, responses_count_html) {
$(comment_id + "_reply .responses-count").html(responses_count_html);
},
display_error: function(field_with_errors, error_html) {
$(error_html).insertAfter($("" + field_with_errors));
},
reset_form: function(parent_selector) {
var form_container;
form_container = $(parent_selector + " .comment-form:first");
form_container.find("textarea").val("");
if (parent_selector !== "") {
form_container.hide();
}
},
toggle_form: function(id) {
$("#js-comment-form-" + id).toggle();
},
initialize: function() {
$("body").on("click", ".js-add-comment-link", function() {
App.Comments.toggle_form($(this).data().id);
return false;
});
$("body").on("click", ".js-toggle-children", function() {
$(this).closest(".comment").find(".comment-list:first").toggle("slow");
$(this).children(".far").toggleClass("fa-minus-square fa-plus-square");
$(this).children(".js-child-toggle").toggle();
return false;
});
}
};
}).call(this);