Option for AJAX comments. A bit of JSDoc.
This commit is contained in:
Alexey Skobkin
parent
56bd3117ec
commit
6d6a9fa3d6
|
|
@ -113,8 +113,11 @@
|
||||||
"option_nsfw_blur_comments_entire": {
|
"option_nsfw_blur_comments_entire": {
|
||||||
"message": "Blur entire comments in nsfw posts"
|
"message": "Blur entire comments in nsfw posts"
|
||||||
},
|
},
|
||||||
"option_ctrl_enter": {
|
"option_ajax": {
|
||||||
"message": "Send post and comments by CTRL+Enter (deprecated)"
|
"message": "AJAX"
|
||||||
|
},
|
||||||
|
"option_ajax_comments": {
|
||||||
|
"message": "Send comments via AJAX (CTRL+Enter)"
|
||||||
},
|
},
|
||||||
"option_fluid_layout": {
|
"option_fluid_layout": {
|
||||||
"message": "Fluid layout"
|
"message": "Fluid layout"
|
||||||
|
|
|
||||||
|
|
@ -113,8 +113,11 @@
|
||||||
"option_nsfw_blur_comments_entire": {
|
"option_nsfw_blur_comments_entire": {
|
||||||
"message": "Размытие комментариев целиком"
|
"message": "Размытие комментариев целиком"
|
||||||
},
|
},
|
||||||
"option_ctrl_enter": {
|
"option_ajax": {
|
||||||
"message": "Отправлять текст по CTRL+Enter (устарело)"
|
"message": "AJAX"
|
||||||
|
},
|
||||||
|
"option_ajax_comments": {
|
||||||
|
"message": "Отправка комментариев через AJAX (CTRL+Enter)"
|
||||||
},
|
},
|
||||||
"option_fluid_layout": {
|
"option_fluid_layout": {
|
||||||
"message": ""Резиновая" вёрстка (растянуть сайт по горизонтали)"
|
"message": ""Резиновая" вёрстка (растянуть сайт по горизонтали)"
|
||||||
|
|
|
||||||
|
|
@ -544,88 +544,91 @@ $(document).ready(function() {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// @todo implement option
|
if (options.is('option_ajax')) {
|
||||||
if (true || options.is('option_ajax_comments')) {
|
// Comments
|
||||||
// Removing old bindings
|
if (options.is('option_ajax_comments')) {
|
||||||
// Dirty hack for page context
|
// Removing old bindings
|
||||||
$('#comments').replaceWith($('#comments').clone());
|
// Dirty hack for page context
|
||||||
|
$('#comments').replaceWith($('#comments').clone());
|
||||||
|
|
||||||
// Binding new
|
// Binding new
|
||||||
$('#comments').on('keypress.pp', '.reply-form textarea', function (evt) {
|
$('#comments').on('keypress.pp', '.reply-form textarea', function (evt) {
|
||||||
if ((evt.keyCode === 10 || evt.keyCode === 13) && (evt.ctrlKey || evt.metaKey)) {
|
if ((evt.keyCode === 10 || evt.keyCode === 13) && (evt.ctrlKey || evt.metaKey)) {
|
||||||
evt.stopPropagation();
|
evt.stopPropagation();
|
||||||
evt.preventDefault();
|
evt.preventDefault();
|
||||||
|
|
||||||
var $post = $(this).parents('.post:first');
|
var $post = $(this).parents('.post:first');
|
||||||
var csRf = $(this).siblings('input[name="csrf_token"]').val();
|
var csRf = $(this).siblings('input[name="csrf_token"]').val();
|
||||||
console.log(csRf);
|
console.log(csRf);
|
||||||
|
|
||||||
$.ajax({
|
$.ajax({
|
||||||
type: 'POST',
|
type: 'POST',
|
||||||
url: '/api/post/' + $post.data('id'),
|
url: '/api/post/' + $post.data('id'),
|
||||||
data: {
|
data: {
|
||||||
text: $(this).val(),
|
text: $(this).val(),
|
||||||
comment_id: $post.data('comment-id')
|
comment_id: $post.data('comment-id')
|
||||||
},
|
},
|
||||||
error: function(req, status, error) {
|
error: function(req, status, error) {
|
||||||
console.error('AJAX request error while sending the comment: %s', error);
|
console.error('AJAX request error while sending the comment: %s', error);
|
||||||
console.log('Status: %s', status);
|
console.log('Status: %s', status);
|
||||||
|
|
||||||
alert(chrome.i18n.getMessage('msg_comment_send_failed') + '\n' + error);
|
alert(chrome.i18n.getMessage('msg_comment_send_failed') + '\n' + error);
|
||||||
},
|
},
|
||||||
success: function(data, textStatus) {
|
/**
|
||||||
console.log('data %O', data);
|
* @param {object} data Response data
|
||||||
console.log('status %O', textStatus);
|
* @param {number} data.comment_id ID of the created comment
|
||||||
/*{
|
* @param {string} data.id ID of the post
|
||||||
comment_id: 34,
|
* @param {string} textStatus Text of request status
|
||||||
id: 'ovrwcv'
|
*/
|
||||||
};*/
|
success: function(data, textStatus) {
|
||||||
|
console.log('data %O', data);
|
||||||
if (textStatus === 'success') {
|
console.log('status %O', textStatus);
|
||||||
// Hiding form
|
|
||||||
$('#reply-' + $post.data('id') + '_' + $post.data('comment-id')).prop('checked', false);
|
if (textStatus === 'success') {
|
||||||
|
// Hiding form
|
||||||
// Creating the comment HTML
|
$('#reply-' + $post.data('id') + '_' + $post.data('comment-id')).prop('checked', false);
|
||||||
create_comment_elements({
|
|
||||||
id: data.comment_id,
|
// Creating the comment HTML
|
||||||
toId: $post.data('comment-id') || null,
|
create_comment_elements({
|
||||||
postId: $post.data('id'),
|
id: data.comment_id,
|
||||||
author: $('#name h1').text(),
|
toId: $post.data('comment-id') || null,
|
||||||
text: $(this).val(),
|
postId: $post.data('id'),
|
||||||
fadeOut: false
|
author: $('#name h1').text(),
|
||||||
}, function($comment) {
|
text: $(this).val(),
|
||||||
// If list mode or not addressed to other comment
|
fadeOut: false
|
||||||
if ($('#comments #tree-switch a').eq(0).hasClass('active') || ($post.data('comment-id') === undefined)) {
|
}, function($comment) {
|
||||||
// Adding to the end of the list
|
// If list mode or not addressed to other comment
|
||||||
$('.content-wrap #comments #post-reply').before($comment);
|
if ($('#comments #tree-switch a').eq(0).hasClass('active') || ($post.data('comment-id') === undefined)) {
|
||||||
} else {
|
// Adding to the end of the list
|
||||||
// Check for children
|
$('.content-wrap #comments #post-reply').before($comment);
|
||||||
$parentCommentChildren = $post.next('.comments');
|
|
||||||
|
|
||||||
// @fixme Find a bug with lost indentation of new comment
|
|
||||||
// If child comment already exist
|
|
||||||
if ($parentCommentChildren.length) {
|
|
||||||
console.log('Child comments found. Appending...');
|
|
||||||
$parentCommentChildren.append($comment);
|
|
||||||
} else {
|
} else {
|
||||||
console.log('No child comments found. Creating...');
|
// Check for children
|
||||||
$post.after($('<div>').addClass('comments').append($comment).css('margin-left', '0px'));
|
$parentCommentChildren = $post.next('.comments');
|
||||||
|
|
||||||
|
// @fixme Find a bug with lost indentation of new comment
|
||||||
|
// If child comment already exist
|
||||||
|
if ($parentCommentChildren.length) {
|
||||||
|
console.log('Child comments found. Appending...');
|
||||||
|
$parentCommentChildren.append($comment);
|
||||||
|
} else {
|
||||||
|
console.log('No child comments found. Creating...');
|
||||||
|
$post.after($('<div>').addClass('comments').append($comment).css('margin-left', '0px'));
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
});
|
|
||||||
|
// Cleaning textarea
|
||||||
// Cleaning textarea
|
$(this).val('');
|
||||||
$(this).val('');
|
|
||||||
|
}
|
||||||
|
}.bind(this),
|
||||||
|
beforeSend: function (xhr) {
|
||||||
|
xhr.setRequestHeader('X-CSRF', csRf);
|
||||||
}
|
}
|
||||||
}.bind(this),
|
});
|
||||||
beforeSend: function (xhr) {
|
}
|
||||||
xhr.setRequestHeader('X-CSRF', csRf);
|
});
|
||||||
}
|
}
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Hightlight post with new comments
|
// Hightlight post with new comments
|
||||||
|
|
|
||||||
|
|
@ -165,10 +165,15 @@
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="tabs-content-item" id="other">
|
<section class="tabs-content-item" id="other">
|
||||||
<label class="option-node">
|
<div class="option-node">
|
||||||
<input type="checkbox" name="option-ctrl-enter" disabled="disabled">
|
<input type="checkbox" name="option-ajax" id="option-ajax">
|
||||||
<span data-i18n="option_ctrl_enter"></span>
|
<label for="option-ajax" data-i18n="option_ajax"></label>
|
||||||
</label>
|
|
||||||
|
<label class="option-node">
|
||||||
|
<input type="checkbox" name="option-ajax-comments">
|
||||||
|
<span data-i18n="option_ajax_comments"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
<label class="option-node">
|
<label class="option-node">
|
||||||
<input type="checkbox" name="option-fluid-layout">
|
<input type="checkbox" name="option-fluid-layout">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue