Rewrote the comments system. (#1)
old one basically bitrotted to death, may it rinse in prosciutto Reviewed-on: #1 Co-authored-by: flashwave <me@flash.moe> Co-committed-by: flashwave <me@flash.moe>
This commit is contained in:
parent
6b2bfb726f
commit
7353553de7
66 changed files with 3320 additions and 2088 deletions
templates
|
|
@ -1,215 +0,0 @@
|
|||
{% macro comments_input(category, user, perms, reply_to, return_url) %}
|
||||
{% set reply_mode = reply_to is not null %}
|
||||
|
||||
{% from 'macros.twig' import avatar %}
|
||||
{% from '_layout/input.twig' import input_hidden, input_csrf, input_checkbox %}
|
||||
|
||||
<form class="comment comment--input{% if reply_mode %} comment--reply{% endif %}"
|
||||
method="post" action="{{ url('comment-create', {'return': return_url}) }}"
|
||||
id="comment-{{ reply_mode ? 'reply-' ~ reply_to.id : 'create-' ~ category.id }}">
|
||||
{{ input_hidden('comment[category]', category.id) }}
|
||||
{{ input_csrf() }}
|
||||
|
||||
{% if reply_mode %}
|
||||
{{ input_hidden('comment[reply]', reply_to.id) }}
|
||||
{% endif %}
|
||||
|
||||
<div class="comment__container">
|
||||
<div class="avatar comment__avatar">
|
||||
{{ avatar(user.id, reply_mode ? 40 : 50, user.name) }}
|
||||
</div>
|
||||
<div class="comment__content">
|
||||
<textarea
|
||||
class="comment__text input__textarea comment__text--input"
|
||||
name="comment[text]" placeholder="Share your extensive insights..."></textarea>
|
||||
<div class="comment__actions">
|
||||
{% if not reply_mode %}
|
||||
{% if perms.can_pin|default(false) %}
|
||||
{{ input_checkbox('comment[pin]', 'Pin this comment', false, 'comment__action') }}
|
||||
{% endif %}
|
||||
{% if perms.can_lock|default(false) %}
|
||||
{{ input_checkbox('comment[lock]', 'Toggle locked status', false, 'comment__action') }}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
<button class="input__button comment__action comment__action--button comment__action--post">
|
||||
{{ reply_mode ? 'Reply' : 'Post' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{% endmacro %}
|
||||
|
||||
{% macro comments_entry(comment, indent, category, user, colour, perms, return_url) %}
|
||||
{% from 'macros.twig' import avatar %}
|
||||
{% from '_layout/input.twig' import input_checkbox_raw %}
|
||||
|
||||
{% set replies = comment.replies %}
|
||||
{% set poster = comment.user|default(null) %}
|
||||
{% if comment.post is defined %}
|
||||
{% set userVote = comment.vote.weight %}
|
||||
{% set commenterColour = comment.colour %}
|
||||
{% set comment = comment.post %}
|
||||
{% set body = comment.body %}
|
||||
{% set likes = comment.votesPositive %}
|
||||
{% set dislikes = comment.votesNegative %}
|
||||
{% set isReply = comment.isReply %}
|
||||
{% else %}
|
||||
{% set body = comment.text %}
|
||||
{% set commenterColour = null %}
|
||||
{% set userVote = comment.userVote %}
|
||||
{% set likes = comment.likes %}
|
||||
{% set dislikes = comment.dislikes %}
|
||||
{% set isReply = comment.hasParent %}
|
||||
{% endif %}
|
||||
|
||||
{% set hide_details = poster is null or comment.deleted and not perms.can_delete_any|default(false) %}
|
||||
|
||||
{% if perms.can_delete_any|default(false) or (not comment.deleted or replies|length > 0) %}
|
||||
<div class="comment{% if comment.deleted %} comment--deleted{% endif %}" id="comment-{{ comment.id }}">
|
||||
<div class="comment__container">
|
||||
{% if hide_details %}
|
||||
<div class="comment__avatar">
|
||||
{{ avatar(0, indent > 1 ? 40 : 50) }}
|
||||
</div>
|
||||
{% else %}
|
||||
<a class="comment__avatar" href="{{ url('user-profile', {'user': poster.id}) }}">
|
||||
{{ avatar(poster.id, indent > 1 ? 40 : 50, poster.name) }}
|
||||
</a>
|
||||
{% endif %}
|
||||
<div class="comment__content">
|
||||
<div class="comment__info">
|
||||
{% if not hide_details %}
|
||||
<a class="comment__user comment__user--link"
|
||||
href="{{ url('user-profile', {'user': poster.id}) }}"
|
||||
style="--user-colour: {{ commenterColour }}">{{ poster.name }}</a>
|
||||
{% endif %}
|
||||
<a class="comment__link" href="#comment-{{ comment.id }}">
|
||||
<time class="comment__date"
|
||||
title="{{ comment.createdTime|date('r') }}"
|
||||
datetime="{{ comment.createdTime|date('c') }}">
|
||||
{{ comment.createdTime|time_format }}
|
||||
</time>
|
||||
</a>
|
||||
{% if comment.pinned %}
|
||||
<span class="comment__pin">{% apply spaceless %}
|
||||
Pinned
|
||||
{% if comment.pinnedTime != comment.createdTime %}
|
||||
<time title="{{ comment.pinnedTime|date('r') }}"
|
||||
datetime="{{ comment.pinnedTime|date('c') }}">
|
||||
{{ comment.pinnedTime|time_format }}
|
||||
</time>
|
||||
{% endif %}
|
||||
{% endapply %}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="comment__text">
|
||||
{{ hide_details ? '(deleted)' : body }}
|
||||
</div>
|
||||
<div class="comment__actions">
|
||||
{% if not comment.deleted and user is not null %}
|
||||
{% if perms.can_vote|default(false) %}
|
||||
{% set like_vote_state = (userVote > 0 ? 0 : 1) %}
|
||||
{% set dislike_vote_state = (userVote < 0 ? 0 : -1) %}
|
||||
|
||||
<a class="comment__action comment__action--link comment__action--vote comment__action--like{% if userVote > 0 %} comment__action--voted{% endif %}" data-comment-id="{{ comment.id }}" data-comment-vote="{{ like_vote_state }}"
|
||||
href="{{ url('comment-vote', { comment: comment.id, vote: like_vote_state, return: return_url, csrf: csrf_token() }) }}">
|
||||
Like
|
||||
{% if likes > 0 %}
|
||||
({{ likes|number_format }})
|
||||
{% endif %}
|
||||
</a>
|
||||
<a class="comment__action comment__action--link comment__action--vote comment__action--dislike{% if userVote < 0 %} comment__action--voted{% endif %}" data-comment-id="{{ comment.id }}" data-comment-vote="{{ dislike_vote_state }}"
|
||||
href="{{ url('comment-vote', { comment: comment.id, vote: dislike_vote_state, return: return_url, csrf: csrf_token() }) }}">
|
||||
Dislike
|
||||
{% if dislikes > 0 %}
|
||||
({{ dislikes|number_format }})
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if perms.can_post|default(false) %}
|
||||
<label class="comment__action comment__action--link" for="comment-reply-toggle-{{ comment.id }}">Reply</label>
|
||||
{% endif %}
|
||||
{% if perms.can_delete_any|default(false) or (poster.id|default(0) == user.id and perms.can_delete|default(false)) %}
|
||||
<a class="comment__action comment__action--link comment__action--hide comment__action--delete" data-comment-id="{{ comment.id }}" href="{{ url('comment-delete', { comment: comment.id, return: return_url, csrf: csrf_token() }) }}">Delete</a>
|
||||
{% endif %}
|
||||
{# if user is not null %}
|
||||
<a class="comment__action comment__action--link comment__action--hide" href="#">Report</a>
|
||||
{% endif #}
|
||||
{% if not isReply and perms.can_pin|default(false) %}
|
||||
<a class="comment__action comment__action--link comment__action--hide comment__action--pin" data-comment-id="{{ comment.id }}" data-comment-pinned="{{ comment.pinned ? '1' : '0' }}" href="{{ url((comment.pinned ? 'comment-unpin' : 'comment-pin'), { comment: comment.id, return: return_url, csrf: csrf_token() }) }}">{{ comment.pinned ? 'Unpin' : 'Pin' }}</a>
|
||||
{% endif %}
|
||||
{% elseif perms.can_delete_any|default(false) %}
|
||||
<a class="comment__action comment__action--link comment__action--restore" data-comment-id="{{ comment.id }}" href="{{ url('comment-restore', { comment: comment.id, return: return_url, csrf: csrf_token() }) }}">Restore</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="comment__replies comment__replies--indent-{{ indent }}" id="comment-{{ comment.id }}-replies">
|
||||
{% from _self import comments_entry, comments_input %}
|
||||
{% if user|default(null) is not null and category|default(null) is not null and perms.can_post|default(false) %}
|
||||
{{ input_checkbox_raw('', false, 'comment__reply-toggle', '', false, {'id':'comment-reply-toggle-' ~ comment.id}) }}
|
||||
{{ comments_input(category, user, perms, comment, return_url) }}
|
||||
{% endif %}
|
||||
{% if replies|length > 0 %}
|
||||
{% for reply in replies %}
|
||||
{{ comments_entry(reply, indent + 1, category, user, colour, perms, return_url) }}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro comments_section(category, return_url) %}
|
||||
{% set user = category.user %}
|
||||
{% set colour = category.colour %}
|
||||
{% set posts = category.posts %}
|
||||
{% set perms = category.perms %}
|
||||
{% set category = category.category %}
|
||||
|
||||
<div class="comments" id="comments">
|
||||
<div class="comments__input">
|
||||
{% if user|default(null) is null %}
|
||||
<div class="comments__notice">
|
||||
Please <a href="{{ url('auth-login') }}" class="comments__notice__link">login</a> to comment.
|
||||
</div>
|
||||
{% elseif category|default(null) is null %}
|
||||
<div class="comments__notice">
|
||||
Posting new comments here is disabled.
|
||||
</div>
|
||||
{% elseif not perms.can_lock|default(false) and category.locked %}
|
||||
<div class="comments__notice">
|
||||
This comment section was locked, <time datetime="{{ category.lockedTime|date('c') }}" title="{{ category.lockedTime|date('r') }}">{{ category.lockedTime|time_format }}</time>.
|
||||
</div>
|
||||
{% elseif not perms.can_post|default(false) %}
|
||||
<div class="comments__notice">
|
||||
You are not allowed to post comments.
|
||||
</div>
|
||||
{% else %}
|
||||
{% from _self import comments_input %}
|
||||
{{ comments_input(category, user, perms, null, return_url) }}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if perms.can_lock|default(false) and category.locked %}
|
||||
<div class="comments__notice comments__notice--staff">
|
||||
This comment section was locked, <time datetime="{{ category.lockedTime|date('c') }}" title="{{ category.lockedTime|date('r') }}">{{ category.lockedTime|time_format }}</time>.
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="comments__listing">
|
||||
{% if posts|length > 0 %}
|
||||
{% from _self import comments_entry %}
|
||||
{% for comment in posts %}
|
||||
{{ comments_entry(comment, 1, category, user, colour, perms, return_url) }}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="comments__none" id="_no_comments_notice_{{ category.id }}">
|
||||
There are no comments yet.
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
{% extends 'changelog/master.twig' %}
|
||||
{% from 'macros.twig' import container_title, avatar %}
|
||||
{% from '_layout/comments.twig' import comments_section %}
|
||||
|
||||
{% set title = 'Changelog » Change #' ~ change_info.id %}
|
||||
{% set canonical_url = url('changelog-change', {'change': change_info.id}) %}
|
||||
|
|
@ -69,6 +68,6 @@
|
|||
|
||||
<div class="container">
|
||||
{{ container_title('<i class="fas fa-comments fa-fw"></i> Comments for ' ~ change_info.date) }}
|
||||
{{ comments_section(comments_info, canonical_url) }}
|
||||
<div class="js-comments" data-category="{{ change_info.commentsCategoryName }}"></div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
{% extends 'changelog/master.twig' %}
|
||||
{% from 'macros.twig' import pagination, container_title %}
|
||||
{% from 'changelog/macros.twig' import changelog_listing %}
|
||||
{% from '_layout/comments.twig' import comments_section %}
|
||||
|
||||
{% set is_date = changelog_date > 0 %}
|
||||
{% set is_user = changelog_user is not null %}
|
||||
|
|
@ -50,10 +49,10 @@
|
|||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if is_date %}
|
||||
{% if comments_category_name is defined and comments_category_name is not null %}
|
||||
<div class="container">
|
||||
{{ container_title('<i class="fas fa-comments fa-fw"></i> Comments') }}
|
||||
{{ comments_section(comments_info, canonical_url) }}
|
||||
<div class="js-comments" data-category="{{ comments_category_name }}"></div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@
|
|||
{{ post.title }} |
|
||||
{{ post.featured ? 'Featured' : 'Normal' }} |
|
||||
User #{{ post.userId }} |
|
||||
{% if post.commentsSectionId is not null %}Comments category #{{ post.commentsSectionId }}{% else %}No comments category{% endif %} |
|
||||
Created {{ post.createdAt }} |
|
||||
{{ post.published ? 'published' : 'Published ' ~ post.scheduledAt }} |
|
||||
{{ post.edited ? 'Edited ' ~ post.updatedAt : 'not edited' }} |
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
{% extends 'news/master.twig' %}
|
||||
{% from 'macros.twig' import container_title %}
|
||||
{% from '_layout/comments.twig' import comments_section %}
|
||||
{% from 'news/macros.twig' import news_post %}
|
||||
|
||||
{% set title = post_info.title ~ ' :: News' %}
|
||||
|
|
@ -10,10 +9,8 @@
|
|||
{% block content %}
|
||||
{{ news_post(post_info, post_category_info, post_user_info, post_user_colour) }}
|
||||
|
||||
{% if comments_info is defined %}
|
||||
<div class="container">
|
||||
{{ container_title('<i class="fas fa-comments fa-fw"></i> Comments') }}
|
||||
{{ comments_section(comments_info, canonical_url) }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="container">
|
||||
{{ container_title('<i class="fas fa-comments fa-fw"></i> Comments') }}
|
||||
<div class="js-comments" data-category="{{ post_info.commentsCategoryName }}"></div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue