diff --git a/kallithea/public/css/style.css b/kallithea/public/css/style.css --- a/kallithea/public/css/style.css +++ b/kallithea/public/css/style.css @@ -2796,6 +2796,40 @@ input.status_change_radio { border-radius: 4px !important; } +@keyframes animated-comment-background { + 0% { background-position: 0 0; } + 100% { background-position: 20px 0; } +} + +.comment-preview.failed .user, +.comment-preview.failed .panel-body { + color: #666; +} + +.comment-preview .comment-submission-status { + float: right; +} + +.comment-preview .comment-submission-status .btn-group { + margin-left: 10px; +} + +.comment-preview.submitting .panel-body { + background-image: linear-gradient( + -45deg, + #FAFAFA, + #FAFAFA 25%, + #FFF 25%, + #FFF 50%, + #FAFAFA 50%, + #FAFAFA 75%, + #FFF 75%, + #FFF 100% + ); + background-size: 20px 20px; + animation: animated-comment-background 0.4s linear infinite; +} + /**** PULL REQUESTS *****/ diff --git a/kallithea/public/js/base.js b/kallithea/public/js/base.js --- a/kallithea/public/js/base.js +++ b/kallithea/public/js/base.js @@ -647,6 +647,7 @@ function _comment_div_append_form($comme .clone() .addClass('comment-inline-form'); $comment_div.append($form_div); + var $preview = $comment_div.find("div.comment-preview"); var $form = $comment_div.find("form"); var $textarea = $form.find('textarea'); @@ -678,7 +679,18 @@ function _comment_div_append_form($comme } } - $form.find('.submitting-overlay').show(); + if (review_status) { + var $review_status = $preview.find('.automatic-comment'); + var review_status_lbl = $("#comment-inline-form-template input.status_change_radio[value='" + review_status + "']").parent().text().strip(); + $review_status.find('.comment-status-label').text(review_status_lbl); + $review_status.show(); + } + $preview.find('.comment-text div').text(text); + $preview.show(); + $textarea.val(''); + if (f_path && line_no) { + $form.hide(); + } var postData = { 'text': text, @@ -702,7 +714,33 @@ function _comment_div_append_form($comme } } }; - ajaxPOST(AJAX_COMMENT_URL, postData, success); + var failure = function(x, s, e) { + $preview.removeClass('submitting').addClass('failed'); + var $status = $preview.find('.comment-submission-status'); + $('', { + 'title': e, + text: _TM['Unable to post'] + }).replaceAll($status.contents()); + $('
', { + 'class': 'btn-group' + }).append( + $('