NEW Comment previews

This commit is contained in:
Ingo Schommer 2013-03-04 11:37:18 +01:00
parent e450807b1c
commit 0cf5f66783
4 changed files with 76 additions and 7 deletions

View File

@ -33,7 +33,8 @@ class Commenting {
'comment_permalink_prefix' => "comment-", // id prefix for each comment. If needed make this different
'require_moderation' => false,
'html_allowed' => false, // allow for sanitized HTML in comments
'html_allowed_elements' => array('p', 'br', 'a', 'img', 'i', 'b')
'html_allowed_elements' => array('p', 'br', 'a', 'img', 'i', 'b'),
'use_preview' => false, // preview formatted comment (when allowing HTML)
);
/**

View File

@ -13,7 +13,8 @@ class CommentingController extends Controller {
'approve',
'rss',
'CommentsForm',
'doPostComment'
'doPostComment',
'doPreviewComment'
);
private $baseClass = "";
@ -239,7 +240,7 @@ class CommentingController extends Controller {
* @return Form
*/
public function CommentsForm() {
$usePreview = Commenting::get_config_value($this->getBaseClass(), 'use_preview');
$member = Member::currentUser();
$fields = new FieldList(
TextField::create("Name", _t('CommentInterface.YOURNAME', 'Your name'))
@ -263,10 +264,28 @@ class CommentingController extends Controller {
HiddenField::create("BaseClass")
);
// Preview formatted comment. Makes most sense when shortcodes or
// limited HTML is allowed. Populated by JS/Ajax.
if($usePreview) {
$fields->insertAfter(
ReadonlyField::create('PreviewComment', _t('CommentInterface.PREVIEWLABEL', 'Preview'))
->setAttribute('style', 'display: none'), // enable through JS
'Comment'
);
}
// save actions
$actions = new FieldList(
new FormAction("doPostComment", _t('CommentInterface.POST', 'Post'))
);
if($usePreview) {
$actions->push(
FormAction::create('doPreviewComment', _t('CommentInterface.PREVIEW', 'Preview'))
->addExtraClass('action-minor')
->setAttribute('style', 'display: none') // enable through JS
);
}
// required fields for server side
$required = new RequiredFields(array(
@ -340,6 +359,8 @@ class CommentingController extends Controller {
*/
public function doPostComment($data, $form) {
$class = (isset($data['BaseClass'])) ? $data['BaseClass'] : $this->getBaseClass();
$usePreview = Commenting::get_config_value($class, 'use_preview');
$isPreview = ($usePreview && isset($data['preview']) && $data['preview']);
// if no class then we cannot work out what controller or model they
// are on so throw an error
@ -378,7 +399,13 @@ class CommentingController extends Controller {
$form->saveInto($comment);
$comment->Moderated = ($moderated) ? false : true;
// Save into DB, or call pre-save hooks to give accurate preview
if($isPreview) {
$comment->onBeforeWrite();
} else {
$comment->write();
}
// extend hook to allow extensions. Also see onBeforePostComment
$this->extend('onAfterPostComment', $comment);
@ -401,4 +428,9 @@ class CommentingController extends Controller {
return ($url) ? $this->redirect($url .'#'. $hash) : $this->redirectBack();
}
public function doPreviewComment($data, $form) {
$data['IsPreview'] = 1;
return $this->doPostComment($data, $form);
}
}

View File

@ -17,7 +17,8 @@ The module provides a number of built in configuration settings below are the de
'comment_permalink_prefix' => "comment-",
'require_moderation' => false,
'html_allowed' => false, // allow for sanitized HTML in comments
'html_allowed_elements' => array('p', 'br', 'a', 'img', 'i', 'b')
'html_allowed_elements' => array('p', 'br', 'a', 'img', 'i', 'b'),
'use_preview' => false, // preview formatted comment (when allowing HTML)
);
If you want to customize any of the configuration options after you have added the extension (or

View File

@ -9,8 +9,14 @@
commentsList = $('.comments-list', commentsHolder),
pagination = $('.comments-pagination'),
noCommentsYet = $('.no-comments-yet', commentsHolder),
form = $('form', container);
form = $('form', container),
previewEl = form.find('#PreviewComment');
/**
* Init
*/
previewEl.hide();
$(':submit[name=action_doPreviewComment]').show();
/**
* Validate
@ -70,7 +76,6 @@
* this inclues the spam and approve links
*/
form.submit(function (e) {
// trigger validation
if(!form.validate().valid()){
return false;
@ -103,6 +108,36 @@
return false;
});
/**
* Preview comment by fetching it from the server via ajax.
*/
$(':submit[name=action_doPreviewComment]', form).click(function(e) {
e.preventDefault();
if(!form.validate().valid()) return false;
previewEl.show().addClass('loading').find('.middleColumn').html(' ');
form.ajaxSubmit({
success: function(response) {
var responseEl = $(response);
if(responseEl.is('form')) {
// Validation failed, renders form instead of single comment
form.replaceWith(responseEl);
} else {
// Default behaviour
previewEl.removeClass('loading').find('.middleColumn').html(responseEl);
}
},
data: {'action_doPreviewComment': 1}
});
});
/**
* Hide outdated preview on form changes
*/
$(':input', form).on('change keydown', function() {
previewEl.hide();
});
/**
* Clicking one of the metalinks performs the operation via ajax