diff --git a/code/controllers/CommentingController.php b/code/controllers/CommentingController.php index 5bb0278..98da299 100644 --- a/code/controllers/CommentingController.php +++ b/code/controllers/CommentingController.php @@ -151,7 +151,7 @@ class CommentingController extends Controller { $comment->Moderated = true; $comment->write(); - return ($this->request->isAjax()) ? true : $this->redirectBack(); + return ($this->request->isAjax()) ? $comment->renderWith('CommentsInterface_singlecomment') : $this->redirectBack(); } return $this->httpError(404); @@ -172,7 +172,7 @@ class CommentingController extends Controller { $comment->Moderated = true; $comment->write(); - return ($this->request->isAjax()) ? true : $this->redirectBack(); + return ($this->request->isAjax()) ? $comment->renderWith('CommentsInterface_singlecomment') : $this->redirectBack(); } return $this->httpError(404); @@ -193,7 +193,7 @@ class CommentingController extends Controller { $comment->Moderated = true; $comment->write(); - return ($this->request->isAjax()) ? true : $this->redirectBack(); + return ($this->request->isAjax()) ? $comment->renderWith('CommentsInterface_singlecomment') : $this->redirectBack(); } return $this->httpError(404); @@ -376,12 +376,10 @@ class CommentingController extends Controller { if(Director::is_ajax()) { if(!$comment->Moderated) { - echo $comment->renderWith('CommentInterface_pendingcomment'); + return $comment->renderWith('CommentsInterface_pendingcomment'); } else { - echo $comment->renderWith('CommentInterface_singlecomment'); + return $comment->renderWith('CommentsInterface_singlecomment'); } - - return true; } $holder = Commenting::get_config_value($comment->BaseClass, 'comments_holder_id'); diff --git a/code/extensions/CommentsExtension.php b/code/extensions/CommentsExtension.php index 45c2785..d553027 100644 --- a/code/extensions/CommentsExtension.php +++ b/code/extensions/CommentsExtension.php @@ -97,6 +97,10 @@ class CommentsExtension extends DataExtension { * @see docs/en/Extending */ public function CommentsForm() { + Requirements::javascript(THIRDPARTY_DIR . '/jquery-validate/lib/jquery.form.js'); + Requirements::javascript(THIRDPARTY_DIR . '/jquery-validate/jquery.validate.pack.js'); + Requirements::javascript('comments/javascript/CommentsInterface.js'); + $interface = new SSViewer('CommentsInterface'); // detect whether we comments are enabled. By default if $CommentsForm is included diff --git a/javascript/CommentsInterface.js b/javascript/CommentsInterface.js index a0dcdff..4716223 100755 --- a/javascript/CommentsInterface.js +++ b/javascript/CommentsInterface.js @@ -1,130 +1,148 @@ /** - * @package userforms + * @package comments */ - (function($) { $(document).ready(function () { - /** - * Please note this functionality has not been finished - * this file is not loaded on your site. It is simply here - * to provide a starting point for someone to take it over - * - * @todo finish - */ - - return false; - - - - - - - - $('.comments-holder-container form').submit(function (e) { + var commentsHolder = $('.comments-holder'), + commentsList = $('.comments-list', commentsHolder), + noCommentsYet = $('.no-comments-yet', commentsHolder), + form = $('#Form_CommentsForm'), + error = $('#Form_CommentsForm_error', form).hide() - if($('.comment-holder form [name=Name]').val() && $('.comment-holder form [name=Comment]').val()) { - // remove the no comments posted text - if($('.no-comments-yet').length > 0) { - $('.no-comments-yet').remove(); - - $(this).parents(".comments-holder-container") - .find(".comments-holder") - .append(""); + // create the not comments message if it doesn't exist yet, but hide it (incase we need it) + if(!noCommentsYet.length){ + noCommentsYet = $('

No one has commented on this page yet.

').appendTo(commentsHolder).hide(); + } + + + /** + * Validate + */ + form.validate({ + invalidHandler : function(form, validator){ + $('html, body').animate({ + scrollTop: $(validator.errorList[0].element).offset().top - 30 + }, 200); + }, + + errorElement: "span", + errorClass: "error", + + rules: { + Name : { + required : true + }, + Email : { + required : true, + email : true + }, + Comment: { + required : true + }, + URL: { + url : true + } + }, + messages: { + Name : { + required : 'Plaese enter your name' + }, + Email : { + required : 'Plaese enter your email address', + email : 'Plaese enter a valid email address' + }, + Comment: { + required : 'Plaese enter your comment' + }, + URL: { + url : 'Please enter a valid URL' } - - error.hide(); - $('#PageComments').prepend('

  • Loading...

    • '); - newComment = $('#PageComments').children()[0]; - newComment = $(newComment); - - $(this).ajaxSubmit(function(response) { - if($('#PageComments_holder [name=Math]').length > 0) { - $.ajax({ - url: jQuery('base').attr('href') + 'PageCommentInterface_Controller/newspamquestion', - cache: false, - success: function(html){ - // Load spam stuff goes in here - $('#PageComments_holder #Math label').text(html); - $('#PageComments_holder #Math input').val(''); - }, - failure: function(html) { - eval(html); - } - }); - } - if(response.match('validationError')) { - newComment.remove(); - eval(response); - } else if(response != "spamprotectionfailed") { - newComment.addClass('even'); - newComment.html(response); - newComment.effects('highlight', {}, 1000); - if(response.match('Spam detected!!')) { - newComment.addClass('spam'); - } - $(this).resetForm(); - } else { - error.text('You got the spam question wrong'); - error.show(); - newComment.remove(); - $('#PageComments_holder #Math input').focus(); - } - }); - } else { - // We're missing things, alert it here - - error.show(); } - - e.preventDefault(); }); + + + /** + * Clicking one of the metalinks performs the operation via ajax + * this inclues the spam and approve links + */ + form.submit(function (e) { + + // trigger validation, if there are errors add the error classes to the elements + if(!form.validate().valid()){ + form.find('span.error').addClass('message required'); + return false; + } + + // submit the form + $(this).ajaxSubmit(function(response) { + noCommentsYet.hide(); + + if(!commentsList.length){ + commentsHolder.append(""); + commentsList = $('.comments-list', commentsHolder); + } + + var newComment = $('
  • ') + .addClass('even first') + .html(response) + .hide(); + + if(response.match('Spam detected!!')) { + newComment.addClass('spam'); + } + + commentsList.prepend(newComment.fadeIn()); + + $(this).resetForm(); + + }); + + return false; + }); + /** * Clicking one of the metalinks performs the operation via ajax * this inclues the spam and approve links */ - $(".action-links a").live('click', function(e) { + $(".action-links a", commentsList).live('click', function(e) { var link = $(this); - var hide = $(this).parents("li.comments"); + var comment = link.parents('.comment:first'); + var commentsList = comment.parents('ul:first'); $.ajax({ - url: $(this).attr('href') + '?ajax=1', + url: $(this).attr('href'), cache: false, success: function(html){ if(link.hasClass('ham')) { // comment has been marked as not spam comment.html(html); - comment.removeClass('spam'); - comment.effect("highlight", {}, 1000); + comment.removeClass('spam').hide().fadeIn(); } else if(link.hasClass('approve')) { // comment has been approved comment.html(html); - comment.removeClass('unmoderated'); - comment.effect("highlight", {}, 1000); + comment.removeClass('unmoderated').hide().fadeIn(); } else if(link.hasClass('delete')) { - hide.fadeOut(1000, function() { - var comments = hide.parents("ul"); - hide.remove(); + comment.fadeOut(1000, function() { + comment.remove(); - if(comments.children().length == 0) { - comments.html("

    No one has commented on this page yet.

    "); + if(commentsList.children().length == 0) { + noCommentsYet.show(); } }); } else if(link.hasClass('spam')) { if(html) { - hide.html(html); - hide.effect("highlight", {}, 1000); + comment.html(html).addClass('spam').hide().fadeIn(); } else { - hide.fadeOut(1000, function() { // Fade out the comment - var comments = hide.parent(); // Grab the comments holder - hide.remove(); // remove the comment + comment.fadeOut(1000, function() { // Fade out the comment + comment.remove(); // remove the comment if(comments.children().length == 0) { - comments.html("

    No one has commented on this page yet.

    "); + noCommentsYet.show(); } }); }