From 639b72620b35ea26b11c672b33b67eaf8fdd7bae Mon Sep 17 00:00:00 2001 From: isqua Date: Sat, 31 Jan 2015 22:20:22 +0300 Subject: [PATCH] AJAX comment sending indictaion --- chrome_point_plus/css/point-plus.css | 24 ++++++++++++++++++++++++ chrome_point_plus/js/point-plus.js | 27 +++++++++++++++++++++------ 2 files changed, 45 insertions(+), 6 deletions(-) diff --git a/chrome_point_plus/css/point-plus.css b/chrome_point_plus/css/point-plus.css index d08a7f3..96e370f 100644 --- a/chrome_point_plus/css/point-plus.css +++ b/chrome_point_plus/css/point-plus.css @@ -192,3 +192,27 @@ div#markItUpText-input { opacity: 1; } + +.pp-progress.reply-form { + margin-top: 8px; + padding-top: 4px; +} + +.pp-progress.reply-form::before { + content: ''; + display: block; + height: 4px; + background: linear-gradient(to right, #fff, #9aacbe, #fff); + -webkit-animation: loading 1s; + -webkit-animation-iteration-count: infinite; +} + +@-webkit-keyframes loading { + from { + background-position: -640px 0; + } + + to { + background-position: 0 0; + } +} diff --git a/chrome_point_plus/js/point-plus.js b/chrome_point_plus/js/point-plus.js index 424581c..44efbd5 100644 --- a/chrome_point_plus/js/point-plus.js +++ b/chrome_point_plus/js/point-plus.js @@ -509,18 +509,28 @@ function PointPlus(ppVersion) { // Binding new $('#comments').on('keypress.pp', '.reply-form textarea', function (evt) { + var $textarea = $(this); + var $post; + var $form; + var processClass = 'pp-progress' + var csRf; + if ((evt.keyCode === 10 || evt.keyCode === 13) && (evt.ctrlKey || evt.metaKey)) { evt.stopPropagation(); evt.preventDefault(); - var $post = $(this).parents('.post').first(); - var csRf = $(this).siblings('input[name="csrf_token"]').val(); + $post = $textarea.parents('.post').first(); + csRf = $textarea.siblings('input[name="csrf_token"]').val(); + + $textarea.prop('disabled', true); + $form = $textarea.parent(); + $form.addClass(processClass); $.ajax({ type: 'POST', url: '/api/post/' + $post.data('id'), data: { - text: $(this).val(), + text: $textarea.val(), comment_id: $post.data('comment-id') }, error: function(req, status, error) { @@ -528,6 +538,9 @@ function PointPlus(ppVersion) { console.log('Status: %s', status); alert(chrome.i18n.getMessage('msg_comment_send_failed') + '\n' + error); + + $textarea.prop('disabled', false); + $form.removeClass(processClass); }, /** * @param {object} data Response data @@ -549,7 +562,7 @@ function PointPlus(ppVersion) { toId: $post.data('comment-id') || null, postId: $post.data('id'), author: $('#name h1').text(), - text: $(this).val(), + text: $textarea.val(), fadeOut: true }, function($comment) { // If list mode or not addressed to other comment @@ -573,10 +586,12 @@ function PointPlus(ppVersion) { }); // Cleaning textarea - $(this).val(''); + $textarea.val(''); + $textarea.prop('disabled', false); + $form.removeClass(processClass); } - }.bind(this), + }, beforeSend: function (xhr) { xhr.setRequestHeader('X-CSRF', csRf); }