github-mirror/BookStack
2
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-06-03 08:13:14 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

#47 Implements the reply and edit functionality for comments.

Browse Source
This commit is contained in:
Abijeet
2017-05-16 00:40:14 +05:30
parent 4f231d1bf0
commit 03e5d61798
10 changed files with 149 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
resources/assets/js/controllers.js
View File

@ -683,29 +683,49 @@ module.exports = function (ngApp, events) {
}]);
// CommentCrudController
ngApp.controller('CommentAddController', ['$scope', '$http', function ($scope, $http) {
ngApp.controller('CommentReplyController', ['$scope', '$http', function ($scope, $http) {
const MarkdownIt = require("markdown-it");
const md = new MarkdownIt({html: true});
let vm = this;
$scope.errors = {};
vm.saveComment = function () {
let pageId = $scope.comment.pageId;
let comment = $scope.comment.newComment;
let commentHTML = md.render($scope.comment.newComment);
$http.post(window.baseUrl(`/ajax/page/${pageId}/comment/`), {
let pageId = $scope.comment.pageId || $scope.pageId;
let comment = $scope.comment.text;
let commentHTML = md.render($scope.comment.text);
let serviceUrl = `/ajax/page/${pageId}/comment/`;
let httpMethod = 'post';
let errorOp = 'add';
let reqObj = {
text: comment,
html: commentHTML
}).then(resp => {
$scope.comment.newComment = '';
};
if ($scope.isEdit === true) {
// this will be set when editing the comment.
serviceUrl = `/ajax/page/${pageId}/comment/${$scope.comment.id}`;
httpMethod = 'put';
errorOp = 'update';
} else if ($scope.isReply === true) {
// if its reply, get the parent comment id
reqObj.parent_id = $scope.parentId;
}
$http[httpMethod](window.baseUrl(serviceUrl), reqObj).then(resp => {
if (!resp.data || resp.data.status !== 'success') {
return events.emit('error', trans('error'));
}
if ($scope.isEdit) {
$scope.comment.html = commentHTML;
$scope.$emit('evt.comment-success', $scope.comment.id);
} else {
$scope.comment.text = '';
$scope.$emit('evt.comment-success', null, true);
}
events.emit('success', trans(resp.data.message));
}, checkError('add'));
};
}, checkError(errorOp));
};
function checkError(errorGroupName) {
$scope.errors[errorGroupName] = {};
return function(response) {
@ -725,19 +745,19 @@ module.exports = function (ngApp, events) {
ngApp.controller('CommentListController', ['$scope', '$http', '$timeout', function ($scope, $http, $timeout) {
let vm = this;
$scope.errors = {};
$scope.defaultAvatar = defaultAvatar;
$scope.defaultAvatar = defaultAvatar;
vm.totalCommentsStr = 'Loading...';
$scope.editorChange = function (content) {
console.log(content);
}
$timeout(function() {
$http.get(window.baseUrl(`/ajax/page/${$scope.pageId}/comments/`)).then(resp => {
if (!resp.data || resp.data.success !== true) {
// TODO : Handle error
return;
}
vm.comments = resp.data.comments.data;
vm.comments = resp.data.comments.data;
vm.totalComments = resp.data.total;
// TODO : Fetch message from translate.
if (vm.totalComments === 0) {
@ -748,20 +768,19 @@ module.exports = function (ngApp, events) {
vm.totalCommentsStr = vm.totalComments + ' Comments'
}
}, checkError('app'));
});
});
vm.loadSubComments = function(event, comment) {
event.preventDefault();
$http.get(window.baseUrl(`/ajax/page/${$scope.pageId}/comments/${comment.id}/sub-comments`)).then(resp => {
console.log(resp);
if (!resp.data || resp.data.success !== true) {
return;
}
comment.is_loaded = true;
comment.comments = resp.data.comments.data;
comment.is_loaded = true;
comment.comments = resp.data.comments.data;
}, checkError('app'));
};
function checkError(errorGroupName) {
$scope.errors[errorGroupName] = {};
return function(response) {

77
resources/assets/js/directives.js
View File

@ -818,29 +818,62 @@ module.exports = function (ngApp, events) {
}
};
}]);
ngApp.directive('commentReply', ['$timeout', function ($timeout) {
ngApp.directive('commentReply', [function () {
return {
restrict: 'E',
templateUrl: 'comment-reply.html',
scope: {
pageId: '=',
parentId: '='
},
link: function (scope, element, attr) {
link: function (scope, element) {
scope.isReply = true;
scope.$on('evt.comment-success', function (event) {
// no need for the event to do anything more.
event.stopPropagation();
event.preventDefault();
element.remove();
scope.$destroy();
});
}
}
}]);
ngApp.directive('commentReplyLink', ['$document', '$compile', function ($document, $compile) {
return {
ngApp.directive('commentEdit', [function () {
return {
restrict: 'E',
templateUrl: 'comment-reply.html',
scope: {
comment: '=',
},
link: function (scope, element) {
scope.isEdit = true;
scope.$on('evt.comment-success', function (event, commentId) {
// no need for the event to do anything more.
event.stopPropagation();
event.preventDefault();
if (commentId === scope.comment.id && !scope.isNew) {
element.remove();
scope.$destroy();
}
});
}
}
}]);
ngApp.directive('commentReplyLink', ['$document', '$compile', '$http', function ($document, $compile, $http) {
return {
scope: {
comment: '='
},
link: function (scope, element, attr) {
element.on('$destroy', function () {
element.off('click');
scope.$destroy();
scope.$destroy();
});
element.on('click', function () {
var $container = element.parents('.comment-box').first();
if (!$container.length) {
@ -848,21 +881,31 @@ module.exports = function (ngApp, events) {
return;
}
if (attr.noCommentReplyDupe) {
removeDupe();
removeDupe();
}
var compiledHTML = $compile('<comment-reply></comment-reply>')(scope);
$container.append(compiledHTML);
compileHtml($container, scope, attr.isReply === 'true');
});
}
};
function compileHtml($container, scope, isReply) {
let lnkFunc = null;
if (isReply) {
lnkFunc = $compile('<comment-reply page-id="comment.pageId" parent-id="comment.id"></comment-reply>');
} else {
lnkFunc = $compile('<comment-edit comment="comment"></comment-add>');
}
var compiledHTML = lnkFunc(scope);
$container.append(compiledHTML);
}
function removeDupe() {
let $existingElement = $document.find('comment-reply');
let $existingElement = $document.find('.comments-list comment-reply');
if (!$existingElement.length) {
return;
}
$existingElement.remove();
}
}]);