|
<section class="comments-section">
|
|
<h3>Comments</h3>
|
|
|
|
{% macro render_comment(item, depth=0) %}
|
|
<div class="comment" style="margin-left: {{ depth * 1.5 }}rem;" data-depth="{{ depth }}">
|
|
<div class="comment-votes">
|
|
<form method="POST" action="/votes/comment/{{ item.comment['uid'] }}">
|
|
<input type="hidden" name="value" value="1">
|
|
<button type="submit" class="comment-vote-btn">+</button>
|
|
</form>
|
|
<span class="comment-vote-count" data-vote-count="{{ item.comment['uid'] }}">{{ item.votes.up - item.votes.down }}</span>
|
|
<form method="POST" action="/votes/comment/{{ item.comment['uid'] }}">
|
|
<input type="hidden" name="value" value="-1">
|
|
<button type="submit" class="comment-vote-btn">-</button>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="comment-body" id="comment-{{ item.comment['uid'] }}" data-comment-uid="{{ item.comment['uid'] }}">
|
|
<div class="comment-header">
|
|
<a href="/profile/{{ item.author['username'] if item.author else '#' }}">
|
|
<img src="{{ avatar_url('multiavatar', item.author['username'] if item.author else '?', 32) }}" class="avatar-img avatar-sm" alt="{{ item.author['username'] if item.author else '?' }}" loading="lazy">
|
|
</a>
|
|
<a href="/profile/{{ item.author['username'] if item.author else '#' }}" class="comment-author">{{ item.author['username'] if item.author else 'Unknown' }}</a>
|
|
<span class="comment-time">{{ item.time_ago }}</span>
|
|
</div>
|
|
<div class="comment-text rendered-content" data-render>{{ item.comment['content'] }}</div>
|
|
{% set attachments = item.get('attachments', []) %}
|
|
{% if attachments %}
|
|
{% include "_attachment_display.html" %}
|
|
{% endif %}
|
|
<div class="comment-actions">
|
|
<button class="comment-action-btn" data-action="reply"><span class="icon">💬</span>Reply</button>
|
|
{% if user and item.comment['user_uid'] == user['uid'] %}
|
|
<form method="POST" action="/comments/delete/{{ item.comment['uid'] }}" class="inline-form">
|
|
<button type="submit" class="comment-action-btn"><span class="icon">🗑️</span>Delete</button>
|
|
</form>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% if item.children %}
|
|
<div class="comment-replies">
|
|
{% for child in item.children %}
|
|
{{ render_comment(child, depth + 1) }}
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endmacro %}
|
|
|
|
{% for item in comments %}
|
|
{{ render_comment(item, 0) }}
|
|
{% else %}
|
|
<p class="no-comments-msg">No comments yet. Start the discussion.</p>
|
|
{% endfor %}
|
|
|
|
{% if user %}
|
|
<form class="comment-form" method="POST" action="/comments/create">
|
|
<input type="hidden" name="target_uid" value="{{ target_uid }}">
|
|
<input type="hidden" name="target_type" value="{{ target_type }}">
|
|
<a href="/profile/{{ user['username'] }}">
|
|
<img src="{{ avatar_url('multiavatar', user['username'], 32) }}" class="avatar-img avatar-sm" alt="{{ user['username'] }}" loading="lazy">
|
|
</a>
|
|
<textarea name="content" placeholder="Your opinion goes here..." required maxlength="1000" class="emoji-picker-target" data-mention></textarea>
|
|
<div class="comment-form-actions">
|
|
<div class="attachment-upload-container" data-attachment-upload
|
|
data-max-size="{{ max_upload_size_mb() }}"
|
|
data-max-files="{{ max_attachments_per_resource() }}"
|
|
data-allowed-types="{{ allowed_file_types() }}"></div>
|
|
<button type="submit" class="comment-form-submit"><span class="icon">📤</span>Post</button>
|
|
</div>
|
|
</form>
|
|
{% endif %}
|
|
</section>
|