colin
/
bookstack
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

#47 Implements the reply and edit functionality for comments.

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/Comment.php
View File

@ -5,7 +5,7 @@ use Illuminate\Support\Facades\DB;
class Comment extends Ownable
{
protected $fillable = ['text', 'html'];
protected $fillable = ['text', 'html', 'parent_id'];
/**
* Get the entity that this comment belongs to

11
app/Http/Controllers/CommentController.php
View File

@ -2,18 +2,19 @@
use BookStack\Repos\CommentRepo;
use BookStack\Repos\EntityRepo;
use BookStack\Comment;
use Illuminate\Http\Request;
use Views;
// delete -checkOwnablePermission \
class CommentController extends Controller
{
protected $entityRepo;
public function __construct(EntityRepo $entityRepo, CommentRepo $commentRepo)
public function __construct(EntityRepo $entityRepo, CommentRepo $commentRepo, Comment $comment)
{
$this->entityRepo = $entityRepo;
$this->commentRepo = $commentRepo;
$this->comment = $comment;
parent::__construct();
}
@ -67,7 +68,7 @@ class CommentController extends Controller
//
}
public function getComments($pageId, $commentId = null) {
public function getCommentThread($pageId, $commentId = null) {
try {
$page = $this->entityRepo->getById('page', $pageId, true);
} catch (ModelNotFoundException $e) {
@ -88,8 +89,8 @@ class CommentController extends Controller
if (empty($commentId)) {
// requesting for parent level comments, send the total count as well.
$totalComments = $this->commentRepo->getCommentCount($pageId);
return response()->json(array('success' => true, 'comments'=> $comments, 'total' => $totalComments));
return response()->json(['success' => true, 'comments'=> $comments, 'total' => $totalComments]);
}
return response()->json(array('success' => true, 'comments'=> $comments));
return response()->json(['success' => true, 'comments'=> $comments]);
}
}

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

@ -683,26 +683,46 @@ 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));
};
@ -753,7 +773,6 @@ module.exports = function (ngApp, events) {
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;
}

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

@ -819,22 +819,55 @@ 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) {
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');
@ -850,15 +883,25 @@ module.exports = function (ngApp, events) {
if (attr.noCommentReplyDupe) {
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;
}

13
resources/views/comments/add.blade.php
View File

@ -1,13 +0,0 @@
<div class="comment-editor" ng-controller="CommentAddController as vm" ng-cloak>
<form novalidate>
<textarea name="markdown" rows="3" ng-model="comment.newComment" placeholder="{{ trans('entities.comment_placeholder') }}"
@if($errors->has('markdown')) class="neg" @endif>@if(isset($model) ||
old('markdown')){{htmlspecialchars( old('markdown') ? old('markdown') : ($model->markdown === '' ? $model->html : $model->markdown))}}@endif</textarea>
<input type="hidden" ng-model="pageId" name="comment.pageId" value="{{$pageId}}" ng-init="comment.pageId = {{$pageId }}">
<button type="submit" class="button pos" ng-click="vm.saveComment()">Save</button>
</form>
</div>
@if($errors->has('markdown'))
<div class="text-neg text-small">{{ $errors->first('markdown') }}</div>
@endif

15
resources/views/comments/comment-reply.blade.php
View File

@ -1,10 +1,13 @@
<!-- TODO :: needs to be merged with add.blade.php -->
<div class="comment-editor" ng-controller="CommentReplyController as vm" ng-cloak>
<form novalidate>
<div simple-markdown-input smd-model="comment.newComment" smd-get-content="getCommentHTML" smd-clear="clearInput">
<textarea name="markdown" rows="3"
<textarea name="markdown" rows="3" ng-model="comment.text" placeholder="{{ trans('entities.comment_placeholder') }}"
@if($errors->has('markdown')) class="neg" @endif>@if(isset($model) ||
old('markdown')){{htmlspecialchars( old('markdown') ? old('markdown') : ($model->markdown === '' ? $model->html : $model->markdown))}}@endif</textarea>
</div>
<input type="hidden" ng-model="pageId" name="comment.pageId" value="{{$pageId}}" ng-init="comment.pageId = {{$pageId }}">
<button type="submit" class="button pos" ng-click="vm.saveComment()">Save</button>
<input type="hidden" ng-model="comment.pageId" name="comment.pageId" value="{{$pageId}}" ng-init="comment.pageId = {{$pageId }}">
<button type="submit" class="button pos" ng-click="vm.saveComment(isReply)">Save</button>
</form>
</div>
@if($errors->has('markdown'))
<div class="text-neg text-small">{{ $errors->first('markdown') }}</div>
@endif

4
resources/views/comments/comments.blade.php
View File

@ -2,7 +2,7 @@
@include('comments/list-item')
</script>
<script type="text/ng-template" id="comment-reply.html">
@include('comments/comment-reply')
@include('comments/comment-reply', ['pageId' => $pageId])
</script>
<div ng-controller="CommentListController as vm" ng-init="pageId = <?= $page->id ?>" class="comments-list" ng-cloak>
<h3>@{{vm.totalCommentsStr}}</h3>
@ -13,4 +13,4 @@
</div>
</div>
</div>
@include('comments/add', ['pageId' => $pageId])
@include('comments/comment-reply', ['pageId' => $pageId])

5
resources/views/comments/list-item.blade.php
View File

@ -6,12 +6,13 @@
<div class="comment-header">
@{{ ::comment.created_by_name }}
</div>
<div ng-bind-html="::comment.html" class="comment-body">
<div ng-bind-html="comment.html" class="comment-body">
</div>
<div class="comment-actions">
<ul>
<li><a href="#" comment-reply-link no-comment-reply-dupe="true">Reply</a></li>
<li><a href="#" comment-reply-link no-comment-reply-dupe="true" comment="comment" is-reply="true">Reply</a></li>
<li><a href="#" comment-reply-link no-comment-reply-dupe="true" comment="comment">Edit</a></li>
<li><a href="#">@{{::comment.created_at}}</a></li>
</ul>
</div>

4
routes/web.php
View File

@ -123,8 +123,8 @@ Route::group(['middleware' => 'auth'], function () {
Route::post('/ajax/page/{pageId}/comment/', 'CommentController@save');
Route::put('/ajax/page/{pageId}/comment/{commentId}', 'CommentController@save');
Route::delete('/ajax/comment/{id}', 'CommentController@destroy');
Route::get('/ajax/page/{pageId}/comments/{commentId}/sub-comments', 'CommentController@getComments');
Route::get('/ajax/page/{pageId}/comments/', 'CommentController@getComments');
Route::get('/ajax/page/{pageId}/comments/{commentId}/sub-comments', 'CommentController@getCommentThread');
Route::get('/ajax/page/{pageId}/comments/', 'CommentController@getCommentThread');
// Links
Route::get('/link/{id}', 'PageController@redirectFromLink');