rDrama/files/templates/comments.html

266 lines
11 KiB
HTML

{%- include "component/comment/usernote_header.html" -%}
{# "level" represents the nested level in this call; always starts at 1 #}
{# this is distinct from "comment.level", which is the global depth of this comment #}
{% macro single_comment(c, level) %}
{%- if render_ctx is not defined -%}
{% set render_ctx = 'comments' %}
{%- endif -%}
{%- set ups = c.upvotes_str(render_ctx) -%}
{%- set score = c.score_str(render_ctx) -%}
{%- set downs = c.downvotes_str(render_ctx) -%}
{% set replies = c.replies(v) %}
{% if not c.visibility_and_message(v)[0] %}
{% if c.show_descendants(v) %}
<div id="comment-{{c.id}}" class="comment">
<div class="comment-collapse-icon" onclick="collapse_comment('{{c.id}}', this.parentElement)"></div>
<div class="comment-collapse-bar-click" onclick="collapse_comment('{{c.id}}', this.parentElement)">
<div class="comment-collapse-bar"></div>
</div>
<div class="comment-user-info">
{% if standalone and c.over_18 %}<span class="badge badge-danger">+18</span>{% endif %}
{{c.visibility_and_message(v)[1]}}
</div>
<div class="comment-body">
<div id="comment-{{c.id}}-only" class="comment-{{c.id}}-only"></div>
{% if render_replies %}
<div id="replies-of-{{c.id}}" class="{% if replies and is_notification_page %}d-none d-md-block{% endif %}">
{% if level <= RENDER_DEPTH_LIMIT - 1 %}
{% set standalone=false %}
{% for reply in replies %}
{{single_comment(reply, level=level+1)}}
{% endfor %}
{% endif %}
</div>
{% if replies and level >= RENDER_DEPTH_LIMIT -%}
<div id="morecomment-{{c.id}}" class="{% if is_notification_page %}d-md-none {% endif %}mt-2 more-comments">
{% if not is_notification_page %}<button id="btn-{{c.id}}" class="d-none d-md-block btn btn-primary" onclick="morecomments('{{c.id}}')">More comments ({{c.descendant_count}})</button>{% endif %}
<a {% if not is_notification_page %}class="d-md-none" {% endif %}href="{{c.morecomments}}">More comments <i class="fas fa-long-arrow-right ml-1"></i></a>
</div>
{%- endif %}
{% endif %}
</div>
</div>
{% endif %}
{% else %}
{%- set voted = c.voted_display(v) -%}
{% if standalone and level==1 %}
<div class="post-info post-row-cid-{{c.id}} mb-1 mr-2 mt-3">
{% if c.post and c.post.over_18 %}<span class="badge badge-danger text-small-extra mr-1">+18</span>{% endif %}
<span class="align-top">
<span class="font-weight-bold">{{c.header_msg(v, is_notification_page) | safe}}</span>
</span>
</div>
{% endif %}
{% set isreply = not standalone and c.parent_comment and c.parent_comment.sentto %}
<div id="comment-{{c.id}}" class="anchor comment {% if standalone and level==1 %} mt-0{% endif %} {% if c.collapse_for_user(v,request.path) %}collapsed{% endif %}">
{% if not isreply %}
<div class="comment-collapse-icon" onclick="collapse_comment('{{c.id}}', this.parentElement)"></div>
<div class="comment-collapse-bar-click" onclick="collapse_comment('{{c.id}}', this.parentElement)">
<div class="comment-collapse-bar collapse-bar-{{(c.level + 6) % 8 + 1}}"></div>
</div>
{% endif %}
{%- include 'component/comment/user_info.html' -%}
<div class="comment-body">
<div id="{% if comment_info and comment_info.id == c.id %}context{%else%}comment-{{c.id}}-only{% endif %}" class="{% if c.unread %}unread{% endif %} comment-{{c.id}}-only comment-anchor {% if comment_info and comment_info.id == c.id %}context{%endif%}{% if c.state_mod == StateMod.REMOVED %} removed{% endif %}{% if c.state_mod == StateMod.FILTERED %} filtered{% endif %}{% if c.state_user_deleted_utc %} deleted{% endif %}">
{%- include 'component/comment/reports.html'-%}
{% if c.state_mod == StateMod.REMOVED and c.state_mod_set_by and v and v.admin_level >= PERMS['POST_COMMENT_MODERATION'] %}
<div id="comment-banned-warning" class="comment-text text-removed mb-0">removed by @{{c.state_mod_set_by}}</div>
{% endif %}
<div id="comment-text-{{c.id}}" class="comment-text mb-0">
{{c.realbody(v) | safe}}
</div>
{% if c.parent_submission %}
{%- include 'component/comment/editbox_comment.html' -%}
<div id="comment-{{c.id}}-actions" class="comment-actions{% if voted==1 %} upvoted{% elif voted==-1 %} downvoted{% endif %}">
<div class="d-md-none mt-2">
<div class="post-actions">
<ul class="list-inline text-right d-flex">
{% if v and v.admin_level >= 2 %}
<li class="list-inline-item mr-auto">
<a role="button" data-bs-toggle="modal" data-bs-target="#adminModal-{{c.id}}"> <i class="fas fa-broom"></i></a>
</li>
{% endif %}
{% if v %}
<a class="list-inline-item mr-3" role="button" onclick="openReplyBox('reply-to-{{c.id}}')"><i class="fas fa-reply" style="margin-top:0.35rem"></i></a>
{% endif %}
<li class="list-inline-item">
<a role="button" data-bs-toggle="modal" data-bs-target="#actionsModal-{{c.id}}"> <i class="fas fa-ellipsis-h mt-1"></i></a>
</li>
{%- include 'component/comment/voting_mobile.html' -%}
</ul>
</div>
</div>
<ul class="d-none d-md-flex list-inline text-right text-md-left">
<li>
{%- include 'component/comment/voting_desktop.html' -%}
{%- include 'component/comment/actions_desktop.html' -%}
</li>
</ul>
</div>
{% endif %}
</div>
{% if v and v.id != c.author_id and c.body %}
<textarea autocomplete="off" class="d-none card border my-2 p-3 comment-box form-control rounded" id="markdown-{{c.id}}" readonly>{{c.body.strip()}}</textarea>
{% endif %}
{%- include 'component/comment/replybox_comment.html' -%}
{% if is_notification_page and c.is_strict_message and c.author_id not in (NOTIFICATIONS_ID, AUTOJANNY_ID) %}
{%- include 'component/comment/replybox_message.html' -%}
{% endif %}
{% if render_replies %}
{% if level <= RENDER_DEPTH_LIMIT - 1 or is_notification_page %}
<div id="replies-of-{{c.id}}">
{% for reply in replies %}
{{single_comment(reply, level=level+1)}}
{% endfor %}
</div>
{% elif replies %}
<div id="replies-of-{{c.id}}"></div>
<div id="morecomments-{{c.id}}" class="mt-2 more-comments">
<button id="btn-{{c.id}}" class="d-none d-md-block btn btn-primary" onclick="morecomments('{{c.id}}')">More comments ({{c.descendant_count}})</button>
<a class="d-md-none" href="{{c.morecomments}}">More comments <i class="fas fa-long-arrow-right ml-1"></i></a>
</div>
{% endif %}
{% else %}
<div id="replies-of-{{c.id}}"></div>
{% endif %}
</div>
{%- include 'component/comment/actions_mobile.html' -%}
{% if v and v.admin_level >= 2 %}
{%- include 'component/comment/actions_mobile_admin.html' -%}
{% endif %}
</div>
{% endif %}
{% endmacro %}
{% for comment in comments %}
{%- set parent_level = parent_level | int if parent_level else 0 -%}
{{single_comment(comment, level = parent_level + 1)}}
{% endfor %}
{%- include 'component/comment/view_more_button.html' -%}
{% if not ajax %}
{% if v %}
{% if v.admin_level >= 2 %}
{% include "component/modal/ban.html" %}
{% endif %}
{%- include 'component/modal/delete_comment.html' -%}
{%- include 'component/modal/report_comment.html' -%}
{% endif %}
{% if v %}
<script src="{{ 'js/vendor/purify.min.js' | asset }}"></script>
<script src="{{ 'js/vendor/marked.min.js' | asset }}"></script>
<script src="{{ 'js/marked.custom.js' | asset }}"></script>
<script src="{{ 'js/comments_v.js' | asset }}"></script>
{% if FEATURES['AWARDS'] %}
<script src="{{ 'js/award_modal.js' | asset }}"></script>
{% endif %}
{% endif %}
<script src="{{ 'js/clipboard.js' | asset }}"></script>
{% if v %}
{% if v.admin_level >= 2 %}
<script src="{{ 'js/comments+submission_admin.js' | asset }}"></script>
{% endif %}
{% if v.admin_level >= 2 %}
<script src="{{ 'js/filter_actions.js' | asset }}"></script>
{% endif %}
{% endif %}
{% include "component/modal/expanded_image.html" %}
<script src="{{ 'js/comments+submission_listing.js' | asset }}"></script>
<script src="{{ 'js/comments.js' | asset }}"></script>
{# See https://github.com/themotte/rDrama/pull/642#issuecomment-1646649781 for info on this section of the code #}
<script>
{% if p and (not v or v.highlightcomments) %}
comments = JSON.parse(localStorage.getItem("comment-counts")) || {}
lastCount = comments['{{p.id}}']
var commentsToCheck = [
{% for c in p.comments -%}
{%- if not (v and v.id==c.author_id) and not c.voted %}
[{{c.id}}, {{c.created_utc * 1000}}],
{%- endif -%}
{% endfor %}
];
commentsToCheck = commentsToCheck.filter(comment => comment[1] > lastCount.t)
.map(comment => comment[0]);
if (lastCount) commentsAddUnreadIndicator(commentsToCheck);
{% endif %}
{% if p and not (request.values and ('context' in request.values)) %}
collapsedCommentStorageInit('post_{{p.id}}');
{% elif is_notification_page or request.path.startswith('/@') %}
collapsedCommentStorageInit('{{request.path}}');
{% endif %}
if (document.readyState === "complete" ||
(document.readyState !== "loading" && !document.documentElement.doScroll)) {
collapsedCommentStorageApply();
} else {
document.addEventListener("DOMContentLoaded", collapsedCommentStorageApply);
}
function morecomments(cid) {
btn = document.getElementById(`btn-${cid}`);
btn.disabled = true;
btn.innerHTML = "Requesting...";
var form = new FormData();
form.append("formkey", formkey());
const xhr = new XMLHttpRequest();
xhr.open("get", `/morecomments/${cid}`);
xhr.setRequestHeader('xhr', 'xhr');
xhr.onload=function(){
if (xhr.status==200) {
let e = document.getElementById(`morecomments-${cid}`)
e.innerHTML = xhr.response.replace(/data-src/g, 'src').replace(/data-cfsrc/g, 'src').replace(/style="display:none;visibility:hidden;"/g, '');
bs_trigger(e)
{% if p %}
comments = JSON.parse(localStorage.getItem("old-comment-counts")) || {}
lastCount = comments['{{p.id}}']
var commentsToCheck = [
{% for c in p.comments -%}
{%- if not (v and v.id==c.author_id) and not c.voted %}
[{{c.id}}, {{c.created_utc * 1000}}],
{%- endif -%}
{% endfor %}
];
commentsToCheck = commentsToCheck.filter(comment => comment[1] > lastCount.t)
.map(comment => comment[0]);
if (lastCount) commentsAddUnreadIndicator(commentsToCheck);
{% endif %}
MicroModal.init();
}
btn.disabled = false;
}
xhr.send(form)
}
</script>
{% endif %}