From 987805c927e6f1921a6c700bde83aa96bc10a94e Mon Sep 17 00:00:00 2001 From: Timo Stollenwerk Date: Sat, 15 Aug 2009 16:36:49 +0000 Subject: [PATCH] fix inline validation for reply-to-comment form. svn path=/plone.app.discussion/trunk/; revision=28923 --- .../browser/javascripts/comments.js | 135 +++++++++++------- 1 file changed, 82 insertions(+), 53 deletions(-) diff --git a/plone/app/discussion/browser/javascripts/comments.js b/plone/app/discussion/browser/javascripts/comments.js index c9a3ef9..a3b68da 100644 --- a/plone/app/discussion/browser/javascripts/comments.js +++ b/plone/app/discussion/browser/javascripts/comments.js @@ -1,11 +1,87 @@ jq(document).ready(function() { - /* Hide the reply and the cancel button for the regular add comment - * form. - */ + /***************************************************************** + * Hide the reply and the cancel button for the regular add + * comment form. + *****************************************************************/ jq(".reply").find("input[name='form.buttons.reply']").css("display", "none"); jq(".reply").find("input[name='form.buttons.cancel']").css("display", "none"); + + /***************************************************************** + * If a reply-to-comment form was submitted (in_reply_to field was + * set in the request), create a reply-to-comment form right under + * the comment. + *****************************************************************/ + var post_comment_div = jq("#commenting"); + var in_reply_to_field = post_comment_div.find("input[name='form.widgets.in_reply_to']"); + if (in_reply_to_field.val() != "") { + var current_reply_id = "#" + in_reply_to_field.val(); + var current_reply_to_div = jq(".discussion").find(current_reply_id); + createReplyForm(current_reply_to_div); + clearForm(post_comment_div); + } + + /***************************************************************** + * Remove the z3c.form error messages and all input values from a + * form. + *****************************************************************/ + function clearForm(form_div) { + form_div.find(".error").removeClass("error"); + form_div.find(".fieldErrorBox").remove(); + form_div.find("input[type='text']").attr("value", "") + form_div.find("textarea").attr("value", "") + } + + /***************************************************************** + * Create a reply-to-comment form right under the comment_div. + *****************************************************************/ + function createReplyForm(comment_div){ + + var comment_id = comment_div.attr("id"); + + var reply_button = comment_div.find(".reply-to-comment-button"); + + /* Clone the reply div at the end of the page template that contains + * the regular comment form and insert it after the reply button of the + * current comment. + */ + var reply_div = jq("#commenting").clone(true); + reply_div.appendTo(comment_div).css("display", "none"); + + /* Remove id="reply" attribute, since we use it to uniquely + the main reply form. */ + reply_div.removeAttr("id") + + /* Hide the reply button (only hide, because we may want to show it + * again if the user hits the cancel button). + */ + jq(reply_button).css("display", "none"); + + /* Fetch the reply form inside the reply div */ + var reply_form = reply_div.find("form"); + + /* Populate the hidden 'in_reply_to' field with the correct comment id */ + reply_form.find("input[name='form.widgets.in_reply_to']").val(comment_id); + + /* Add a remove-reply-to-comment Javascript function to remove the form */ + var cancel_reply_button = reply_div.find(".cancelreplytocomment"); + cancel_reply_button.attr("id", comment_id); + + /* Hide the comment button */ + reply_form.find("input[name='form.buttons.comment']").css("display", "none"); + + /* Show the reply and cancel buttons. */ + reply_form.find("input[name='form.buttons.reply']").css("display", "inline"); + reply_form.find("input[name='form.buttons.cancel']").css("display", "inline"); + + /* Show the reply layer with a slide down effect */ + reply_div.slideDown("slow"); + + /* Show the cancel button in the reply-to-comment form */ + cancel_reply_button.css("display", "inline"); + } + /***************************************************************** * Show the reply button only when Javascript is enabled. * Otherwise hide it, since the reply functions relies on jQuery. @@ -17,58 +93,11 @@ jq(document).ready(function() { * Create reply to comment form. *****************************************************************/ jq(".reply-to-comment-button").bind("click", function(e){ - - var comment_div = jq(this).parents().filter(".comment"); - var comment_id = comment_div.attr("id"); - - var reply_button = comment_div.find(".reply-to-comment-button"); - - /* Clone the reply div at the end of the page template that contains - * the regular comment form and insert it after the reply button of the - * current comment. - */ - var reply_div = jq("#commenting").clone(true); - reply_div.appendTo(comment_div).css("display", "none"); - - /* Remove id="reply" attribute, since we use it to uniquely - the main reply form. */ - reply_div.removeAttr("id") - - /* Hide the reply button (only hide, because we may want to show it - * again if the user hits the cancel button). - */ - jq(reply_button).css("display", "none"); - - /* Fetch the reply form inside the reply div */ - var reply_form = reply_div.find("form"); - - /* Remove already typed in text from the reply form. */ - reply_form.find(".field").find("input").attr("value", "") - reply_form.find(".field").find("textarea").attr("value", "") - - /* Populate the hidden 'in_reply_to' field with the correct comment id */ - reply_form.find("input[name='form.widgets.in_reply_to']").val(comment_id); - - /* Add a remove-reply-to-comment Javascript function to remove the form */ - var cancel_reply_button = reply_div.find(".cancelreplytocomment"); - cancel_reply_button.attr("id", comment_id); - - /* Hide the comment button */ - reply_form.find("input[name='form.buttons.comment']").css("display", "none"); - - /* Show the reply and cancel buttons. */ - reply_form.find("input[name='form.buttons.reply']").css("display", "inline"); - reply_form.find("input[name='form.buttons.cancel']").css("display", "inline"); - - /* Show the reply layer with a slide down effect */ - reply_div.slideDown("slow"); - - /* Show the cancel button in the reply-to-comment form */ - cancel_reply_button.css("display", "inline"); - + var comment_div = jq(this).parents().filter(".comment"); + createReplyForm(comment_div); + clearForm(comment_div); }); - /***************************************************************** * Remove reply to comment form. *****************************************************************/