Improve the backend to show comments
This commit is contained in:
Flavio Copes
parent
adc6d19022
commit
a178946aba
|
|
@ -16,7 +16,6 @@ Or clone from GitHub and put in the `user/plugins/comments` folder.
|
|||
|
||||
# TODO
|
||||
|
||||
- Validate comment, name and email on the frontend form
|
||||
- Add language file for the frontend
|
||||
- Allow to moderate comments from the admin
|
||||
- Email the comment to the site admins (default to all with admin.super, could be configured)
|
||||
|
|
|
|||
|
|
@ -26,61 +26,75 @@
|
|||
.pages-list .row p.page-route {
|
||||
margin: 0px 0 10px 0px;
|
||||
}
|
||||
|
||||
th { background: #d9d9d9; }
|
||||
|
||||
.comment { flex: 3 }
|
||||
.details { flex: 1.5 }
|
||||
|
||||
.center {
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.button:active { margin: 0 auto;}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
jQuery(document).on('click tap', '.js__comments-list-toggle', function(event) {
|
||||
$(this).find('.page-icon').toggleClass('children-open').toggleClass('children-closed');
|
||||
$(this).closest('.row').find('.js__comments-list').toggle();
|
||||
$(function() {
|
||||
var currentPage = 0;
|
||||
|
||||
$(document).on('click tap', '.js__load-more', function(event) {
|
||||
$.getJSON(window.location + '/page:' + (currentPage + 1))
|
||||
.success(function(response) {
|
||||
currentPage = parseInt(response.page);
|
||||
|
||||
response.comments.forEach(function(comment) {
|
||||
$('.js__comments-container').append('<tr>' +
|
||||
'<td class="e author">' + comment.author + '</td>' +
|
||||
'<td class="v comment">' + comment.text + '</td>' +
|
||||
'<td class="v details"><strong>Page</strong>: ' + comment.pageTitle + '<br>' +
|
||||
'<strong>Date</strong>: ' + comment.date + '</td>' +
|
||||
'</tr>');
|
||||
})
|
||||
|
||||
$('.totalRetrieved').html(response.totalRetrieved);
|
||||
$('.totalAvailable').html(response.totalAvailable);
|
||||
})
|
||||
.error(function() {
|
||||
alert('Unexpected error');
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<h1>Latest comments</h1>
|
||||
|
||||
<div class="admin-block default-box-shadow">
|
||||
|
||||
<!-- <form id="page-filtering">
|
||||
<div class="page-filters">
|
||||
<input type="text" data-template-types="{"blog":"Blog","default":"Default","error":"Error","form":"Form","formdata":"Formdata","item":"Item","modular":"Modular","shoppingcart":"Shoppingcart","shoppingcart_category":"Shoppingcart category","shoppingcart_checkout":"Shoppingcart checkout","shoppingcart_detail":"Shoppingcart detail","shoppingcart_order":"Shoppingcart order","shoppingcart_section":"Shoppingcart section","simplesearch_results":"Simplesearch results","snipcart":"Snipcart","modular\/features":"Features","modular\/showcase":"Showcase","modular\/text":"Text"}" placeholder="Add Filters" class="page-filter selectized" name="page-filter" tabindex="-1" value="" style="display: none;"><div class="selectize-control page-filter multi plugin-optgroup_columns"><div class="selectize-input items not-full has-options"><input type="text" autocomplete="off" tabindex="" placeholder="Add Filters" style="width: 81px;"></div><div class="selectize-dropdown multi page-filter plugin-optgroup_columns" style="display: none;"><div class="selectize-dropdown-content"></div></div></div>
|
||||
</div>
|
||||
<div class="page-search">
|
||||
<input type="text" placeholder="Search Pages" name="page-search">
|
||||
</div>
|
||||
<div class="page-shortcuts">
|
||||
<span class="button button-x-small" data-page-toggleall="expand"><i class="fa fa-fw fa-plus-circle"></i> Expand All</span>
|
||||
<span class="button button-x-small" data-page-toggleall="collapse"><i class="fa fa-fw fa-minus-circle"></i> Collapse All</span>
|
||||
</div>
|
||||
</form> -->
|
||||
<ul class="pages-list depth-0">
|
||||
<li class="page-item" data-nav-id="/blog">
|
||||
{% for file in grav.twig.files %}
|
||||
<div class="row">
|
||||
<span data-toggle="children" data-hint="Something" class="hint--bottom js__comments-list-toggle">
|
||||
<i class="page-icon fa fa-fw fa-circle-o children-closed"></i>
|
||||
</span>
|
||||
<a href="#" class="page-edit">{{ file.data.title ?: file.fileName }}</a> <span class="badge lang info">{{file.data.lang}}</span>
|
||||
<!-- <span class="page-home"><i class="fa fa-home"></i></span> -->
|
||||
<p class="page-route">{% if file.data.hasUnread %}<span class="gpm-version">Has {{file.data.unreadCount}} unread comments</span>{% else %}<span class="gpm-version">{{file.data.comments|length}} comments</span>{% endif %}</p>
|
||||
|
||||
<ul class="js__comments-list" style="display: none;">
|
||||
{% for comment in file.data.comments|array_reverse %}
|
||||
<li class="page-item" data-nav-id="/blog/classic-modern-architecture">
|
||||
<div class="row">
|
||||
<a href="#" class="page-edit comment-text">{{comment.text}}</a>
|
||||
|
||||
<span class="page-home"></span>
|
||||
<span class="page-tools">
|
||||
<a href="#delete" class="page-delete"><i class="fa fa-close"></i></a>
|
||||
</span>
|
||||
<p class="page-route">{{comment.author}} <span class="spacer"><i class="fa fa-long-arrow-right"></i></span> {{comment.date}}</p>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<table>
|
||||
<tbody class="js__comments-container">
|
||||
<tr class="h">
|
||||
<th class="author">Author</th>
|
||||
<th class="comment">Comment</th>
|
||||
<th class="details">Details</th>
|
||||
</tr>
|
||||
{% for comment in grav.twig.comments.comments %}
|
||||
<tr>
|
||||
<td class="e author">{{comment.author}}</td>
|
||||
<td class="v comment">{{comment.text}}</td>
|
||||
<td class="v details"><strong>Page</strong>: {{comment.pageTitle}}<br>
|
||||
<strong>Date</strong>: {{comment.date}}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</li>
|
||||
</ul>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<button type="button" class="button center js__load-more">
|
||||
Load more
|
||||
</button>
|
||||
|
||||
<p class="center">Showing <span class="totalRetrieved">{{grav.twig.comments.totalRetrieved}}</span> comments of <span class="totalAvailable">{{grav.twig.comments.totalAvailable}}</span></p>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
|
|
|||
52
comments.php
52
comments.php
|
|
@ -53,7 +53,15 @@ class CommentsPlugin extends Plugin
|
|||
'onDataTypeExcludeFromDataManagerPluginHook' => ['onDataTypeExcludeFromDataManagerPluginHook', 0],
|
||||
]);
|
||||
|
||||
$this->grav['twig']->files = $this->getFilesOrderedByModifiedDate();
|
||||
$page = $this->grav['uri']->param('page');
|
||||
$comments = $this->getLastComments($page);
|
||||
|
||||
if ($page > 0) {
|
||||
echo json_encode($comments);
|
||||
exit();
|
||||
}
|
||||
|
||||
$this->grav['twig']->comments = $comments;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -152,6 +160,48 @@ class CommentsPlugin extends Plugin
|
|||
return $files;
|
||||
}
|
||||
|
||||
private function getLastComments($page = 0) {
|
||||
$number = 10;
|
||||
|
||||
$files = [];
|
||||
$files = $this->getFilesOrderedByModifiedDate();
|
||||
|
||||
$comments = [];
|
||||
|
||||
foreach($files as $file) {
|
||||
$data = Yaml::parse(file_get_contents($file->filePath));
|
||||
for($i = 0; $i < count($data['comments']); $i++) {
|
||||
$data['comments'][$i]['pageTitle'] = $data['title'];
|
||||
$data['comments'][$i]['filePath'] = $file->filePath;
|
||||
|
||||
}
|
||||
$comments = array_merge($comments, $data['comments']);
|
||||
}
|
||||
|
||||
// Order comments by date
|
||||
usort($comments, function($a, $b) {
|
||||
return !($a['date'] > $b['date']);
|
||||
});
|
||||
|
||||
$totalAvailable = count($comments);
|
||||
|
||||
$comments = array_slice($comments, $page * $number, $number);
|
||||
|
||||
$totalRetrieved = ($page + 1) * $number;
|
||||
$hasMore = false;
|
||||
|
||||
if ($totalAvailable > $totalRetrieved) {
|
||||
$hasMore = true;
|
||||
}
|
||||
|
||||
return (object)array(
|
||||
"comments" => $comments,
|
||||
"page" => $page,
|
||||
"totalAvailable" => $totalAvailable,
|
||||
"totalRetrieved" => $totalRetrieved
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the comments associated to the current route
|
||||
*/
|
||||
|
|
|
|||
Loading…
Reference in New Issue