Merged in iss87 (pull request #47) Улучшить аяксовые рекоммендации

chrome_point_plus/_locales/en/messages.json

@@ -188,5 +188,8 @@
     },
     "msg_saving_post_draft":{
         "message": "Saving the post..."
+    },
+    "msg_success_recommendation": {
+        "message": "is recommended"
     }
 }

chrome_point_plus/_locales/ru/messages.json

@@ -189,5 +189,8 @@
     },
     "msg_saving_post_draft":{
         "message": "Сохранение поста..."
+    },
+    "msg_success_recommendation": {
+        "message": "рекомендовано"
     }
 }

chrome_point_plus/js/point-plus.js

@@ -503,6 +503,9 @@ function PointPlus(ppVersion) {
         if (options.is('option_ajax')) {
             // Comments
             if (options.is('option_ajax_comments')) {
+                messenger.css({
+                    file: 'modules/ajax-comments.css'
+                });
                 messenger.js({
                     file: 'modules/ajax-comments.js'
                 }, function() {

chrome_point_plus/modules/ajax-comments.css

@@ -0,0 +1,27 @@
+.pp-notification {
+    display: block;
+    position: fixed;
+    top: 40px;
+    right: 40px;
+    padding: 20px;
+    border-radius: 2px;
+    font-size: 15px;
+    line-height: 20px;
+    transition: all 10s ease-in;
+    color: #fff;
+}
+
+.pp-notification a,
+.pp-notification a:visited, {
+    color: #fff;
+    text-decoration: none;
+    font-weight: bold;
+}
+
+.pp-notification-success {
+    background: #4CAF50;
+}
+
+.pp-notification.pp-fade {
+    opacity: 0;
+}

chrome_point_plus/modules/ajax-comments.js

@@ -48,7 +48,7 @@ AjaxComments.prototype.onSubmit = function(event) {
 };
 
 /**
- * Проверяет, выбран ли файл. Если да — отправляет форму с перезагрузкой, иначе — аяксом 
+ * Проверяет, выбран ли файл. Если да — отправляет форму с перезагрузкой, иначе — аяксом
  * @param  {jQuery} $form Элемент формы
  */
 AjaxComments.prototype.submit = function($form) {
@@ -67,7 +67,6 @@ AjaxComments.prototype.submit = function($form) {
  */
 AjaxComments.prototype.onKeypress = function(event) {
     var $form;
-    var proc;
     
     if (this.isProperKeys(event)) {
         event.preventDefault();
@@ -116,12 +115,19 @@ function AjaxCommentProcessor($form) {
     this._text = this._$textarea.val();
     this._CSRF = $form.get(0).elements.csrf_token.value;
 
+    this._actionUrl = this._$form.attr('action');
     this._postId = this._$post.data('id');
     this._commentId = this._$post.data('comment-id');
 
     this.sendComment();
 }
 
+/**
+ * Регулярка для урла, проверяюшая, не рекомендация ли это
+ * @type {RegExp}
+ */
+AjaxCommentProcessor.recommendationReg = /^\/[^/]*\/r$/;
+
 /**
  * Отправляет комментарий
  */
@@ -130,7 +136,7 @@ AjaxCommentProcessor.prototype.sendComment = function() {
 
     $.ajax({
         type: 'POST',
-        url: '/api/post' + this._$form.attr('action'),
+        url: this.getUrl(),
         data: {
             text: this._text,
             comment_id: this._commentId
@@ -141,6 +147,25 @@ AjaxCommentProcessor.prototype.sendComment = function() {
     });
 };
 
+/**
+ * @return {Boolean} true — это коммент-рекомендация, fasle — обычный коммент
+ */
+AjaxCommentProcessor.prototype.isRecommendation = function() {
+    return this._isRec || (this._isRec = this.constructor.recommendationReg.test(this._actionUrl));
+};
+
+/**
+ * @return {String} Адрес, на который слать запрос
+ */
+AjaxCommentProcessor.prototype.getUrl = function() {
+    // Если это рекомендация комментария
+    if (this.isRecommendation() && this._commentId) {
+        return '/api/post/' + this._postId + '/' + this._commentId + '/r';
+    } else {
+        return '/api/post' + this._actionUrl;
+    }
+};
+
 /**
  * Подкладывает CSRF-токен в заголовки запроса
  * @param  {XMLHttpRequest} xhr Объект запроса
@@ -168,9 +193,12 @@ AjaxCommentProcessor.prototype.onSuccess = function(data, textStatus) {
     if (textStatus === 'success') {
         if (data.error) {
             this.onError(null, null, data.error);
+        } else {
+            if (this.isRecommendation() && this._text.trim().length === 0) {
+                this.showSuccessRecommendation();
             } else {
                 this.createComment(data);
-
+            }
             this.hideForm();
 
             // Cleaning textarea
@@ -181,13 +209,15 @@ AjaxCommentProcessor.prototype.onSuccess = function(data, textStatus) {
 };
 
 AjaxCommentProcessor.prototype.createComment = function(data) {
+    /* global create_comment_elements */
     create_comment_elements({
         id: data.comment_id,
         toId: this._commentId || null,
         postId: this._postId,
         author: $('#name h1').text(),
         text: this._text,
-        fadeOut: true
+        fadeOut: true,
+        isRec: this.isRecommendation()
     }, this.insertComment.bind(this));
 };
 
@@ -236,6 +266,7 @@ AjaxCommentProcessor.prototype.showComment = function($comment) {
  * @param  {String} error
  */
 AjaxCommentProcessor.prototype.onError = function(req, status, error) {
+    /* global alert */
     alert(chrome.i18n.getMessage('msg_comment_send_failed') + '\n' + error);
 
     this.setProgress(false);
@@ -243,9 +274,38 @@ AjaxCommentProcessor.prototype.onError = function(req, status, error) {
 
 /**
  * Устанавливает прогресс
- * @param {Boolean} isProgress true — включить прогресс, false — отключить
+ * @param {Boolean} isProgress true — включить прогресс, false — отключить
  */
 AjaxCommentProcessor.prototype.setProgress = function(isProgress) {
     this._$textarea.prop('disabled', isProgress);
     this._$form.toggleClass('pp-progress', isProgress);
 };
+
+AjaxCommentProcessor.prototype.getRecommendationLink = function() {
+    var url = '//point.im/' + this._postId;
+    var text = '#' + this._postId;
+
+    if (this._commentId) {
+        url += '#' + this._commentId;
+        text += '/' + this._commentId;
+    }
+
+    return '<a href="' + url + '">' + text + '</a>';
+};
+
+AjaxCommentProcessor.prototype.showSuccessRecommendation = function() {
+    var $notification = $('<div>')
+        .addClass('pp-notification pp-notification-success');
+
+    $notification.html(this.getRecommendationLink() + ' ' + chrome.i18n.getMessage('msg_success_recommendation'));
+
+    $notification.on('transitionend', function() {
+        $notification.remove();
+    });
+
+    $('body').append($notification);
+
+    window.requestAnimationFrame(function() {
+        $notification.addClass('pp-fade');
+    });
+};