Fixed formatting and added error messages.

diff --git a/resources/assets/js/vues/components/comments/comment-reply.js b/resources/assets/js/vues/components/comments/comment-reply.js
index 83cbdf46739fd836e7693a91b964bea19d32fb42..0f65fc2377e3d77d885e5dba9bafec11bacbd6af 100644 (file)
--- a/resources/assets/js/vues/components/comments/comment-reply.js
+++ b/resources/assets/js/vues/components/comments/comment-reply.js
@@ -1,5 +1,5 @@
 const MarkdownIt = require("markdown-it");
 const MarkdownIt = require("markdown-it");

-const md = new MarkdownIt({html: true});
+const md = new MarkdownIt({ html: true });

 
 var template = `
 <div class="comment-editor" v-cloak>
 
 var template = `
 <div class="comment-editor" v-cloak>


@@ -13,113 +13,101 @@ var template = `
 `;
 
 const props = {
 `;
 
 const props = {

-  pageId: {},
-  commentObj: {},
-  isReply: {
-    default: false,
-    type: Boolean
-  }, isEdit: {
-    default: false,
-    type: Boolean
-  }};
+    pageId: {},
+    commentObj: {},
+    isReply: {
+        default: false,
+        type: Boolean
+    }, isEdit: {
+        default: false,
+        type: Boolean
+    }
+};

 
 

-function data () {
-  var comment = null;
-  // initialize comment if not passed.
-  if (!this.commentObj || this.isReply) {
-    comment = {
-      text: ''
+function data() {
+    let comment = {
+        text: ''

     };
 
     if (this.isReply) {
     };
 
     if (this.isReply) {

-      comment.page_id = this.commentObj.page_id;
-      comment.id = this.commentObj.id;
+        comment.page_id = this.commentObj.page_id;
+        comment.id = this.commentObj.id;
+    } else if (this.isEdit) {
+        comment = this.commentObj;

     }
     }

-  } else {
-    comment = this.commentObj;
-  }

 
 

-  return {
-    trans: trans,
-    parentId: null,
-    comment: comment
-  };
+    return {
+        comment: comment,
+        trans: trans
+    };

 }
 
 const methods = {
 }
 
 const methods = {

-  saveComment: function (event) {
-    let pageId = this.comment.page_id || this.pageId;
-    let commentText = this.comment.text;
-    if (!commentText) {
-        return this.$emit('evt.empty-comment');
-    }
-    let commentHTML = md.render(commentText);
-    let serviceUrl = `/ajax/page/${pageId}/comment/`;
-    let httpMethod = 'post';
-    let reqObj = {
-        text: commentText,
-        html: commentHTML
-    };
-
-    if (this.isEdit === true) {
-        // this will be set when editing the comment.
-        serviceUrl = `/ajax/page/${pageId}/comment/${this.comment.id}`;
-        httpMethod = 'put';
-    } else if (this.isReply === true) {
-        // if its reply, get the parent comment id
-        reqObj.parent_id = this.comment.id;
-    }
+    saveComment: function (event) {
+        let pageId = this.comment.page_id || this.pageId;
+        let commentText = this.comment.text;
+        if (!commentText) {
+            return this.$events.emit('error', trans('errors.empty_comment'))
+        }
+        let commentHTML = md.render(commentText);
+        let serviceUrl = `/ajax/page/${pageId}/comment/`;
+        let httpMethod = 'post';
+        let reqObj = {
+            text: commentText,
+            html: commentHTML
+        };

 
 

-    $http[httpMethod](window.baseUrl(serviceUrl), reqObj).then(resp => {
-        if (!isCommentOpSuccess(resp)) {
-             return;
+        if (this.isEdit === true) {
+            // this will be set when editing the comment.
+            serviceUrl = `/ajax/page/${pageId}/comment/${this.comment.id}`;
+            httpMethod = 'put';
+        } else if (this.isReply === true) {
+            // if its reply, get the parent comment id
+            reqObj.parent_id = this.comment.id;

         }
         }

-        // hide the comments first, and then retrigger the refresh
-        if (this.isEdit) {
-            this.$emit('comment-edited', event, resp.data.comment);
-        } else {
-            this.comment.text = '';
-            this.$emit('comment-added', event);
-            if (this.isReply === true) {
-              this.$emit('comment-replied', event, resp.data.comment);
+        $http[httpMethod](window.baseUrl(serviceUrl), reqObj).then(resp => {
+            if (!isCommentOpSuccess(resp)) {
+                this.$events.emit('error', getErrorMsg(resp));
+                return;
+            }
+            // hide the comments first, and then retrigger the refresh
+            if (this.isEdit) {
+                this.$emit('comment-edited', event, resp.data.comment);

             } else {
             } else {

-              this.$parent.$emit('new-comment', event, resp.data.comment);
+                this.comment.text = '';
+                this.$emit('comment-added', event);
+                if (this.isReply === true) {
+                    this.$emit('comment-replied', event, resp.data.comment);
+                } else {
+                    this.$parent.$emit('new-comment', event, resp.data.comment);
+                }

             }
             }

-            this.$emit('evt.comment-success', null, true);
-        }
-
-    }, checkError);
-  },
-  closeBox: function (event) {
-    this.$emit('editor-removed', event);
-  }
+            this.$events.emit('success', resp.data.message);
+        }).catch(err => {
+            this.$events.emit('error', trans('errors.comment_add'))
+        });
+    },
+    closeBox: function (event) {
+        this.$emit('editor-removed', event);
+    }

 };
 
 const computed = {};
 
 function isCommentOpSuccess(resp) {
 };
 
 const computed = {};
 
 function isCommentOpSuccess(resp) {

-  if (resp && resp.data && resp.data.status === 'success') {
-      return true;
-  }
-  return false;
+    if (resp && resp.data && resp.data.status === 'success') {
+        return true;
+    }
+    return false;

 }
 
 }
 

-function checkError(msgKey) {
-  return function(response) {
-    let msg = null;
-    if (isCommentOpSuccess(response)) {
-        // all good
-        return;
-    } else if (response.data) {
-        msg = response.data.message;
+function getErrorMsg(response) {
+    if (response.data) {
+        return response.data.message;

     } else {
     } else {

-        msg = trans(msgKey);
-    }
-    if (msg) {
-        events.emit('success', msg);
+        return trans('errors.comment_add');

     }
     }

-  }

 }
 
 }
 

-module.exports = {name: 'comment-reply', template, data, props, methods, computed};
+module.exports = { name: 'comment-reply', template, data, props, methods, computed };

 
 

diff --git a/resources/assets/js/vues/components/comments/comment.js b/resources/assets/js/vues/components/comments/comment.js
index 4b0c0a50bdf6b84437041444cfa78c0e0a64b00b..ada638526b95433be535da84ab5fdade3bc1ae68 100644 (file)
--- a/resources/assets/js/vues/components/comments/comment.js
+++ b/resources/assets/js/vues/components/comments/comment.js
@@ -37,7 +37,7 @@ const template = `
               </li>
           </ul>
       </div>
               </li>
           </ul>
       </div>

-      <div v-if="showEditor && level <= 3">
+      <div v-if="showEditor">

         <comment-reply :page-id="comment.page_id" :comment-obj="comment"
           v-on:editor-removed.stop.prevent="hideComment"
           v-on:comment-replied.stop="commentReplied(...arguments)"
         <comment-reply :page-id="comment.page_id" :comment-obj="comment"
           v-on:editor-removed.stop.prevent="hideComment"
           v-on:comment-replied.stop="commentReplied(...arguments)"


@@ -57,134 +57,121 @@ const template = `
 
 const props = ['initialComment', 'index', 'level', 'permissions', 'currentUserId'];
 
 
 const props = ['initialComment', 'index', 'level', 'permissions', 'currentUserId'];
 

-function data () {
-  return {
-    trans: trans,
-    commentHref: null,
-    comments: [],
-    showEditor: false,
-    comment: this.initialComment,
-    nextLevel: this.level + 1
-  };
+function data() {
+    return {
+        commentHref: null,
+        trans: trans,
+        comments: [],
+        showEditor: false,
+        comment: this.initialComment,
+        nextLevel: this.level + 1
+    };

 }
 
 const methods = {
 }
 
 const methods = {

-  deleteComment: function () {
-    var resp = window.confirm(trans('entities.comment_delete_confirm'));
-    if (!resp) {
-        return;
-    }
-    this.$http.delete(window.baseUrl(`/ajax/comment/${this.comment.id}`)).then(resp => {
-      if (!isCommentOpSuccess(resp)) {
-          return;
-      }
-      updateComment(this.comment, resp.data, true);
-    }, function (resp) {
-      if (isCommentOpSuccess(resp)) {
-          this.$events.emit('success', trans('entities.comment_deleted'));
-      } else {
-          this.$events.emit('error', trans('error.comment_delete'));
-      }
-    });
-  },
-  replyComment: function () {
-    this.toggleEditor(false);
-  },
-  editComment: function () {
-    this.toggleEditor(true);
-  },
-  hideComment: function () {
-    this.showEditor = false;
-  },
-  toggleEditor: function (isEdit) {
-    this.showEditor = false;
-    this.isEdit = isEdit;
-    this.isReply = !isEdit;
-    this.showEditor = true;
-  },
-  commentReplied: function (event, comment) {
-    this.comments.push(comment);
-    this.showEditor = false;
-  },
-  commentEdited: function (event, comment) {
-    this.comment = comment;
-    this.showEditor = false;
-  },
-  commentAdded: function (event, comment) {
-    // this is to handle non-parent child relationship
-    // we want to make it go up.
-    this.$emit('comment-added', event);
-  },
-  canEditOrDelete: function (prop) {
-    if (!this.comment.active) {
-      return false;
-    }
+    deleteComment: function () {
+        var resp = window.confirm(trans('entities.comment_delete_confirm'));
+        if (!resp) {
+            return;
+        }
+        this.$http.delete(window.baseUrl(`/ajax/comment/${this.comment.id}`)).then(resp => {
+            if (!isCommentOpSuccess(resp)) {
+                this.$events.emit('error', trans('error.comment_delete'));
+                return;
+            }
+            this.$events.emit('success', trans('entities.comment_deleted'));
+            this.comment = resp.data.comment;
+        }).catch(err => {
+            this.$events.emit('error', trans('error.comment_delete'));
+        });
+    },
+    replyComment: function () {
+        this.toggleEditor(false);
+    },
+    editComment: function () {
+        this.toggleEditor(true);
+    },
+    hideComment: function () {
+        this.showEditor = false;
+    },
+    toggleEditor: function (isEdit) {
+        this.showEditor = false;
+        this.isEdit = isEdit;
+        this.isReply = !isEdit;
+        this.showEditor = true;
+    },
+    commentReplied: function (event, comment) {
+        this.comments.push(comment);
+        this.showEditor = false;
+    },
+    commentEdited: function (event, comment) {
+        this.comment = comment;
+        this.showEditor = false;
+    },
+    commentAdded: function (event, comment) {
+        // this is to handle non-parent child relationship
+        // we want to make it go up.
+        this.$emit('comment-added', event);
+    },
+    canEditOrDelete: function (prop) {
+        if (!this.comment.active) {
+            return false;
+        }

 
 

-    if (!this.permissions) {
-      return false;
-    }
+        if (!this.permissions) {
+            return false;
+        }

 
 

-    let propAll = 'comment_' + prop + '_all';
-    let propOwn = 'comment_' + prop + '_own';
+        let propAll = 'comment_' + prop + '_all';
+        let propOwn = 'comment_' + prop + '_own';

 
 

-    if (this.permissions[propAll]) {
-        return true;
-    }
+        if (this.permissions[propAll]) {
+            return true;
+        }

 
 

-    if (this.permissions[propOwn] && this.comment.created_by.id === this.currentUserId) {
-        return true;
-    }
+        if (this.permissions[propOwn] && this.comment.created_by.id === this.currentUserId) {
+            return true;
+        }

 
 

-    return false;
-  },
-  canComment: function () {
-    if (!this.permissions) {
-      return false;
+        return false;
+    },
+    canComment: function () {
+        if (!this.permissions) {
+            return false;
+        }
+        return this.permissions.comment_create === true;

     }
     }

-    return this.permissions.comment_create === true;
-  }

 };
 
 const computed = {
 };
 
 const computed = {

-  commentId: {
-    get: function () {
-      return `comment-${this.comment.page_id}-${this.comment.id}`;
-    },
-    set: function () {
-      this.commentHref = `#?cm=${this.commentId}`
+    commentId: {
+        get: function () {
+            return `comment-${this.comment.page_id}-${this.comment.id}`;
+        },
+        set: function () {
+            this.commentHref = `#?cm=${this.commentId}`
+        }

     }
     }

-  }

 };
 
 };
 

-function mounted () {
-  if (this.comment.sub_comments && this.comment.sub_comments.length) {
-    // set this so that we can render the next set of sub comments.
-    this.comments = this.comment.sub_comments;
-  }
+function mounted() {
+    if (this.comment.sub_comments && this.comment.sub_comments.length) {
+        // set this so that we can render the next set of sub comments.
+        this.comments = this.comment.sub_comments;
+    }

 }
 
 function isCommentOpSuccess(resp) {
 }
 
 function isCommentOpSuccess(resp) {

-  if (resp && resp.data && resp.data.status === 'success') {
-      return true;
-  }
-  return false;
-}
-
-function updateComment(comment, resp, isDelete) {
-  comment.text = resp.comment.text;
-  comment.updated = resp.comment.updated;
-  comment.updated_by = resp.comment.updated_by;
-  comment.active = resp.comment.active;
-  if (isDelete && !resp.comment.active) {
-      comment.html = trans('entities.comment_deleted');
-  } else {
-      comment.html = resp.comment.html;
-  }
+    if (resp && resp.data && resp.data.status === 'success') {
+        return true;
+    }
+    return false;

 }
 
 module.exports = {
 }
 
 module.exports = {

-  name: 'comment',
-  template, data, props, methods, computed, mounted, components: {
-  commentReply
-}};
+    name: 'comment',
+    template, data, props, methods, computed, mounted, components: {
+        commentReply
+    }
+};

 
 

diff --git a/resources/assets/js/vues/page-comments.js b/resources/assets/js/vues/page-comments.js
index d3ce3006d8e43dd41899a6d287018a10dea42d40..76d11ac6c4a6d520bff13cfb443b18cb28d434d8 100644 (file)
--- a/resources/assets/js/vues/page-comments.js
+++ b/resources/assets/js/vues/page-comments.js
@@ -2,107 +2,98 @@ const comment = require('./components/comments/comment');
 const commentReply = require('./components/comments/comment-reply');
 
 let data = {
 const commentReply = require('./components/comments/comment-reply');
 
 let data = {

-  totalCommentsStr: trans('entities.comments_loading'),
-  comments: [],
-  permissions: null,
-  currentUserId: null,
-  trans: trans,
-  commentCount: 0
+    totalCommentsStr: trans('entities.comments_loading'),
+    comments: [],
+    permissions: null,
+    currentUserId: null,
+    trans: trans,
+    commentCount: 0

 };
 
 let methods = {
 };
 
 let methods = {

-  commentAdded: function () {
-    ++this.totalComments;
-  }
+    commentAdded: function () {
+        ++this.totalComments;
+    }

 }
 
 let computed = {
 }
 
 let computed = {

-  totalComments: {
-    get: function () {
-      return this.commentCount;
+    totalComments: {
+        get: function () {
+            return this.commentCount;
+        },
+        set: function (value) {
+            this.commentCount = value;
+            if (value === 0) {
+                this.totalCommentsStr = trans('entities.no_comments');
+            } else if (value === 1) {
+                this.totalCommentsStr = trans('entities.one_comment');
+            } else {
+                this.totalCommentsStr = trans('entities.x_comments', {
+                    numComments: value
+                });
+            }
+        }

     },
     },

-    set: function (value) {
-      this.commentCount = value;
-      if (value === 0) {
-        this.totalCommentsStr = trans('entities.no_comments');
-      } else if (value === 1) {
-        this.totalCommentsStr = trans('entities.one_comment');
-      } else {
-        this.totalCommentsStr = trans('entities.x_comments', {
-            numComments: value
-        });
-      }
-    }
-  },
-  canComment: function () {
-    if (!this.permissions) {
-      return false;
+    canComment: function () {
+        if (!this.permissions) {
+            return false;
+        }
+        return this.permissions.comment_create === true;

     }
     }

-    return this.permissions.comment_create === true;
-  }

 }
 
 function mounted() {
 }
 
 function mounted() {

-  this.pageId = Number(this.$el.getAttribute('page-id'));
-  // let linkedCommentId = this.$route.query.cm;
-  let linkedCommentId = null;
-  this.$http.get(window.baseUrl(`/ajax/page/${this.pageId}/comments/`)).then(resp => {
-    if (!isCommentOpSuccess(resp)) {
-        // just show that no comments are available.
-        vm.totalComments = 0;
-        return;
-    }
-    this.comments = resp.data.comments;
-    this.totalComments = +resp.data.total;
-    this.permissions = resp.data.permissions;
-    this.currentUserId = resp.data.user_id;
-    if (!linkedCommentId) {
-        return;
-    }
-    $timeout(function() {
-        // wait for the UI to render.
+    this.pageId = Number(this.$el.getAttribute('page-id'));
+    // let linkedCommentId = this.$route.query.cm;
+    let linkedCommentId = null;
+    this.$http.get(window.baseUrl(`/ajax/page/${this.pageId}/comments/`)).then(resp => {
+        if (!isCommentOpSuccess(resp)) {
+            // just show that no comments are available.
+            vm.totalComments = 0;
+            this.$events.emit('error', getErrorMsg(resp));
+            return;
+        }
+        this.comments = resp.data.comments;
+        this.totalComments = +resp.data.total;
+        this.permissions = resp.data.permissions;
+        this.currentUserId = resp.data.user_id;
+        if (!linkedCommentId) {
+            return;
+        }

         focusLinkedComment(linkedCommentId);
         focusLinkedComment(linkedCommentId);

+    }).catch(err => {
+        this.$events.emit('error', 'errors.comment_list');

     });
     });

-  }, checkError('errors.comment_list'));

 }
 
 function isCommentOpSuccess(resp) {
 }
 
 function isCommentOpSuccess(resp) {

-  if (resp && resp.data && resp.data.status === 'success') {
-      return true;
-  }
-  return false;
+    if (resp && resp.data && resp.data.status === 'success') {
+        return true;
+    }
+    return false;

 }
 
 }
 

-function checkError(msgKey) {
-  return function(response) {
-    let msg = null;
-    if (isCommentOpSuccess(response)) {
-        // all good
-        return;
-    } else if (response.data) {
-        msg = response.data.message;
+function getErrorMsg(response) {
+    if (response.data) {
+        return response.data.message;

     } else {
     } else {

-        msg = trans(msgKey);
-    }
-    if (msg) {
-        events.emit('success', msg);
+        return trans('errors.comment_add');

     }
     }

-  }

 }
 
 }
 

-function created () {
-  this.$on('new-comment', function (event, comment) {
-    this.comments.push(comment);
-  })
+function created() {
+    this.$on('new-comment', function (event, comment) {
+        this.comments.push(comment);
+    })

 }
 
 function beforeDestroy() {
 }
 
 function beforeDestroy() {

-  this.$off('new-comment');
+    this.$off('new-comment');

 }
 
 module.exports = {
 }
 
 module.exports = {

-  data, methods, mounted, computed, components : {
-    comment, commentReply
-  },
-  created, beforeDestroy
+    data, methods, mounted, computed, components: {
+        comment, commentReply
+    },
+    created, beforeDestroy

 };
\ No newline at end of file
 };
\ No newline at end of file

diff --git a/resources/lang/en/errors.php b/resources/lang/en/errors.php
index 71bcd1f9aafbeb4186795ed444fd15dc5d137cec..09158caac04d696965d12e199c752a7409f42607 100644 (file)
--- a/resources/lang/en/errors.php
+++ b/resources/lang/en/errors.php
@@ -63,7 +63,7 @@ return [
     // Comments
     'comment_list' => 'An error occurred while fetching the comments.',
     'cannot_add_comment_to_draft' => 'You cannot add comments to a draft.',
     // Comments
     'comment_list' => 'An error occurred while fetching the comments.',
     'cannot_add_comment_to_draft' => 'You cannot add comments to a draft.',

-    'comment_add' => 'An error occurred while adding the comment.',
+    'comment_add' => 'An error occurred while adding / updating the comment.',

     'comment_delete' => 'An error occurred while deleting the comment.',
     'empty_comment' => 'Cannot add an empty comment.',
 
     'comment_delete' => 'An error occurred while deleting the comment.',
     'empty_comment' => 'Cannot add an empty comment.',