rDrama/files/templates/submission.html

1174 lines
49 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

{% extends "default.html" %}
{% set ups=p.upvotes %}
{% set downs=p.downvotes %}
{% set score=ups-downs %}
{% if v %}
{% set voted=p.voted if p.voted else 0 %}
{% else %}
{% set voted=-2 %}
{% endif %}
{% block title %}
<style>
body > .container {
padding-left: 20px !important;
padding-right: 20px !important;
}
</style>
{% if success %}
<script>
history.pushState(null, null, '{{p.permalink}}');
localStorage.setItem("post_title", "")
localStorage.setItem("post_text", "")
localStorage.setItem("post_url", "")
localStorage.setItem("sub", "")
</script>
{% endif %}
{% if p.award_count("crab") %}
<script>
let audio = new Audio('/assets/crab.mp3');
audio.loop=true;
audio.play();
window.addEventListener('click', () => {
if (audio.paused) audio.play();
}, {once : true});
</script>
{% endif %}
{% if fart and not (v and v.has_badge(128)) and SITE_NAME == 'rDrama' %}
<script>
fart = Math.floor(Math.random() * 4) + 1
let audio = new Audio(`/assets/images/${fart}.webp`);
audio.play();
if (audio.paused) {
window.addEventListener('click', () => {
if (audio.paused) audio.play();
}, {once : true})
}
</script>
{% endif %}
{% if SITE_NAME == 'PCM' %}
{% set wholesome = '/assets/images/wholesome.webp' %}
{% else %}
{% set wholesome = '/e/marseywholesome.webp' %}
{% endif %}
{% if p.award_count("confetti") %}
<div id="post-award-confetti"></div>
{% endif %}
{% if p.award_count("firework") %}
<script defer src="/assets/js/fireworks.js?v=4"></script>
<div class="firework">
<img src="">
</div>
{% if p.award_count("firework") > 1 %}
<div class="firework">
<img src="">
</div>
{% endif %}
{% if p.award_count("firework") > 2 %}
<div class="firework">
<img src="">
</div>
{% endif %}
{% if p.award_count("firework") > 3 %}
<div class="firework">
<img src="">
</div>
{% endif %}
{% endif %}
{% if p.award_count("ricardo") %}
<script src="/assets/js/ricardo.js?v=4"></script>
<div id="ricardo1" class="ricardo ricardoleft">
<img src="/assets/images/ricardo1.webp">
</div>
{% if p.award_count("ricardo") > 1 %}
<div id="ricardo2" class="ricardo">
<img src="/assets/images/ricardo2.webp" style="max-height:200px">
</div>
{% endif %}
{% if p.award_count("ricardo") > 2 %}
<div id="ricardo3" class="ricardo">
<img src="/assets/images/ricardo3.webp" style="max-height:150px">
</div>
{% endif %}
{% endif %}
{% if g.inferior_browser %}
{% if p.award_count("wholesome") %}
<style>
.sealimg {
width: 100px !important;
height: 89.5px !important;
}
@media (max-width: 992px) {
.sealimg {
width: 30px !important;
height: 27px !important;
}
}
.seal {
position:fixed;
z-index:9999;
pointer-events: none;
width: 100% !important;
height: 100% !important;
}
@keyframes moveX {
from { left: 0; } to { left: 98%; }
}
@keyframes moveY {
from { top: 0; } to { top: 98%; }
}
.seal1 {
animation: moveX 4s linear 0s infinite alternate, moveY 6.8s linear 0s infinite alternate !important;
animation-delay:0s;
}
</style>
<div class="seal seal1" height="100%" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</div>
{% if p.award_count("wholesome") > 1 %}
<style>
.seal2 {
animation: moveX 5s linear 0s infinite alternate, moveY 8s linear 0s infinite alternate !important;
animation-delay:1s;
}
</style>
<div class="seal seal2" height="100%" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</div>
{% endif %}
{% if p.award_count("wholesome") > 2 %}
<style>
.seal3 {
animation: moveX 4s linear 0s infinite alternate, moveY 5s linear 0s infinite alternate !important;
animation-delay:2s;
}
</style>
<div class="seal seal3" height="100%" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</div>
{% endif %}
{% if p.award_count("wholesome") > 3 %}
<style>
.seal4 {
animation: moveX 5s linear 0s infinite alternate, moveY 6.8s linear 0s infinite alternate !important;
animation-delay:3s;
}
</style>
<div class="seal seal4" height="100%" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</div>
{% endif %}
{% endif %}
{% if SITE_NAME == 'PCM' and p.award_count("toe") %}
<style>
.toeimg {
width: 100px !important;
height: auto !important;
}
@media (max-width: 992px) {
.toeimg {
width: 30px !important;
height: auto !important;
}
}
.toe {
position:fixed;
z-index:9999;
pointer-events: none;
width: 100% !important;
height: 100% !important;
}
@keyframes moveX {
from { left: 0; } to { left: 98%; }
}
@keyframes moveY {
from { top: 0; } to { top: 98%; }
}
.toe1 {
animation: moveX 4s linear 0s infinite alternate, moveY 6.8s linear 0s infinite alternate !important;
animation-delay:0s;
}
</style>
<div class="toe toe1" height="100%" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</div>
{% if p.award_count("toe") > 1 %}
<style>
.toe2 {
animation: moveX 5s linear 0s infinite alternate, moveY 8s linear 0s infinite alternate !important;
animation-delay:1s;
}
</style>
<div class="toe toe2" height="100%" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</div>
{% endif %}
{% if p.award_count("toe") > 2 %}
<style>
.toe3 {
animation: moveX 4s linear 0s infinite alternate, moveY 5s linear 0s infinite alternate !important;
animation-delay:2s;
}
</style>
<div class="toe toe3" height="100%" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</div>
{% endif %}
{% if p.award_count("toe") > 3 %}
<style>
.toe4 {
animation: moveX 5s linear 0s infinite alternate, moveY 6.8s linear 0s infinite alternate !important;
animation-delay:3s;
}
</style>
<div class="toe toe4" height="100%" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</div>
{% endif %}
{% endif %}
{% else %}
{% if p.award_count("wholesome") %}
<style>
.seal {
position:fixed;
z-index:9999;
pointer-events: none;
width: 100% !important;
height: 100% !important;
}
.sealimg {
width: 100px !important;
height: 89.5px !important;
}
@media (max-width: 992px) {
.sealimg {
width: 30px !important;
height: 27px !important;
}
}
</style>
<div class="seal" height="100%" width="100%">
<marquee class="seal" scrollamount=10 behavior="alternate" direction="up" height="100%" width="100%">
<marquee direction="right" scrollamount=10 behavior="alternate" height="100%" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</marquee>
</marquee>
</div>
{% if p.award_count("wholesome") > 1 %}
<marquee class="seal" scrollamount=10 behavior="alternate" direction="down" height="100%">
<marquee direction="right" scrollamount=10 behavior="alternate" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</marquee>
</marquee>
{% endif %}
{% if p.award_count("wholesome") > 2 %}
<marquee class="seal" scrollamount=10 behavior="alternate" direction="up" height="100%">
<marquee direction="left" scrollamount=10 behavior="alternate" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</marquee>
</marquee>
{% endif %}
{% if p.award_count("wholesome") > 3 %}
<marquee class="seal" scrollamount=10 behavior="alternate" direction="down" height="100%">
<marquee direction="left" scrollamount=10 behavior="alternate" width="100%">
<img alt=":#marseywholesome:" class="sealimg" src="{{wholesome}}">
</marquee>
</marquee>
{% endif %}
{% endif %}
{% if SITE_NAME == 'PCM' and p.award_count("toe") %}
<style>
.toe {
position:fixed;
z-index:9999;
pointer-events: none;
width: 100% !important;
height: 100% !important;
}
.toeimg {
width: 100px !important;
height: auto !important;
}
@media (max-width: 992px) {
.toeimg {
width: 30px !important;
height: auto !important;
}
}
</style>
<div class="toe" height="100%" width="100%">
<marquee class="toe" scrollamount=10 behavior="alternate" direction="up" height="100%" width="100%">
<marquee direction="right" scrollamount=10 behavior="alternate" height="100%" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</marquee>
</marquee>
</div>
{% if p.award_count("toe") > 1 %}
<marquee class="toe" scrollamount=10 behavior="alternate" direction="down" height="100%">
<marquee direction="right" scrollamount=10 behavior="alternate" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</marquee>
</marquee>
{% endif %}
{% if p.award_count("toe") > 2 %}
<marquee class="toe" scrollamount=10 behavior="alternate" direction="up" height="100%">
<marquee direction="left" scrollamount=10 behavior="alternate" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</marquee>
</marquee>
{% endif %}
{% if p.award_count("toe") > 3 %}
<marquee class="toe" scrollamount=10 behavior="alternate" direction="down" height="100%">
<marquee direction="left" scrollamount=10 behavior="alternate" width="100%">
<img alt="Blade's toe" class="toeimg" src="/assets/images/PCM/toe.webp?v=1">
</marquee>
</marquee>
{% endif %}
{% endif %}
{% endif %}
{% if p.award_count("train") or p.award_count("scooter") %}
<style>
.train {
position:fixed;
z-index:9999;
pointer-events: none;
}
.train1 {
top: 10%
}
.train2 {
top: 35%
}
.train3 {
top: 60%
}
.train4 {
top: 85%
}
</style>
{% endif %}
{% if p.award_count("train") %}
<style>
.trainimg {
width: 100px !important;
height: 51px !important;
}
@media (max-width: 992px) {
.trainimg {
width: 40px !important;
height: 20px !important;
}
}
</style>
<marquee class="train train1" direction="left" scrollamount=10 width="100%">
<img alt=":#marseytrain:" class="trainimg mirrored" src="/e/marseytrain.webp">
</marquee>
{% if p.award_count("train") > 1 %}
<marquee class="train train2" direction="right" scrollamount=10 width="100%">
<img alt=":#marseytrain:" class="trainimg" src="/e/marseytrain.webp">
</marquee>
{% endif %}
{% if p.award_count("train") > 2 %}
<marquee class="train train3" direction="left" scrollamount=10 width="100%">
<img alt=":#marseytrain:" class="trainimg mirrored" src="/e/marseytrain.webp">
</marquee>
{% endif %}
{% if p.award_count("train") > 3 %}
<marquee class="train train4" direction="right" scrollamount=10 width="100%">
<img alt=":#marseytrain:" class="trainimg" src="/e/marseytrain.webp">
</marquee>
{% endif %}
{% endif %}
{% if SITE_NAME == 'PCM' and p.award_count("croag") %}
<style>
.croag {
position:fixed;
z-index:9999;
pointer-events: none;
}
.croag1 {
top: 15%
}
.croag2 {
top: 40%
}
.croag3 {
top: 65%
}
.croag4 {
top: 90%
}
.croagimg {
width: 169px !important;
height: 68px !important;
}
@media (max-width: 992px) {
.croagimg {
width: 100px !important;
height: 40px !important;
}
}
</style>
<marquee class="croag croag1" direction="left" scrollamount=10 width="100%">
<img alt="croag" class="croagimg mirrored" src="/assets/images/PCM/croag.webp?v=1">
</marquee>
{% if p.award_count("croag") > 1 %}
<marquee class="croag croag2" direction="right" scrollamount=10 width="100%">
<img alt="croag" class="croagimg" src="/assets/images/PCM/croag.webp?v=1">
</marquee>
{% endif %}
{% if p.award_count("croag") > 2 %}
<marquee class="croag croag3" direction="left" scrollamount=10 width="100%">
<img alt="croag" class="croagimg mirrored" src="/assets/images/PCM/croag.webp?v=1">
</marquee>
{% endif %}
{% if p.award_count("croag") > 3 %}
<marquee class="croag croag4" direction="right" scrollamount=10 width="100%">
<img alt="croag" class="croagimg" src="/assets/images/PCM/croag.webp?v=1">
</marquee>
{% endif %}
{% endif %}
{% if p.award_count("scooter") %}
<style>
.scooterimg {
width: 100px !important;
height: 135px !important;
}
@media (max-width: 992px) {
.scooterimg {
width: 40px !important;
height: 54px !important;
}
}
</style>
<marquee class="train train3" direction="right" scrollamount=10 width="100%">
<img alt=":#marseyscooter:" class="scooterimg" src="/e/marseyscooter.webp">
</marquee>
{% if p.award_count("scooter") > 1 %}
<marquee class="train train4" direction="left" scrollamount=10 width="100%">
<img alt=":#marseyscooter:" class="scooterimg mirrored" src="/e/marseyscooter.webp">
</marquee>
{% endif %}
{% if p.award_count("scooter") > 2 %}
<marquee class="train train1" direction="right" scrollamount=10 width="100%">
<img alt=":#marseyscooter:" class="scooterimg" src="/e/marseyscooter.webp">
</marquee>
{% endif %}
{% if p.award_count("scooter") > 3 %}
<marquee class="train train2" direction="left" scrollamount=10 width="100%">
<img alt=":#marseyscooter:" class="scooterimg mirrored" src="/e/marseyscooter.webp">
</marquee>
{% endif %}
{% endif %}
{% if p.award_count("tilt") and not p.distinguish_level %}
<style>
@keyframes post-tilt {
0% {transform: rotate(0deg);}
25% {transform: rotate({{p.award_count("tilt")}}deg);}
75% {transform: rotate(-{{p.award_count("tilt")}}deg);}
100% {transform: rotate(0deg);}
}
@media (max-width: 720px) {
@keyframes post-tilt {
0% {transform: rotate(0deg);}
25% {transform: rotate({{p.award_count("tilt")/4}}deg);}
75% {transform: rotate(-{{p.award_count("tilt")/4}}deg);}
100% {transform: rotate(0deg);}
}
}
#post-root {
animation-name: post-tilt !important;
animation-duration: 60s !important;
animation-iteration-count: infinite !important;
animation-direction: alternate !important;
animation-timing-function: linear !important;
}
</style>
{% endif %}
<meta charset="utf-8">
<meta property="og:type" content="article">
{% if comment_info and not comment_info.is_banned and not comment_info.deleted_utc %}
<title>{{'@'+comment_info.author_name}} comments on "{{p.plaintitle(v)}} - {{SITE_NAME}}"</title>
<meta property="og:article:author" content="{{'@'+comment_info.author_name}}">
<meta property="article:published_time" content="{{comment_info.created_datetime}}">
{% if comment_info.edited_utc %}<meta property="article:modified_time" content="{{comment_info.edited_string}}">{% endif %}
<meta property="og:description" name="description" content="{{comment_info.plainbody(v)}}">
<meta property="og:author" name="author" content="{{'@'+comment_info.author_name}}">
<meta property="og:title" content="{{'@'+comment_info.author_name}} comments on {{p.plaintitle(v)}} - {{SITE_NAME}}">
<meta property="og:image" content="{% if p.is_image %}{{p.realurl(v)}}{% elif p.has_thumb%}{{p.thumb_url}}{% else %}{{SITE_NAME}}/assets/images/{{SITE_NAME}}/site_preview.webp?v=1016{% endif %}">
{% if p.is_video %}
<meta property="og:video" content="{{p.realurl(v)}}">
{% elif p.is_audio %}
<meta property="og:audio" content="{{p.realurl(v)}}">
{% endif %}
<meta property="og:url" content="{{comment_info.permalink}}">
<meta property="og:site_name" content="{{request.host}}">
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="{{SITE_FULL}}">
<meta name="twitter:title" content="{{'@'+comment_info.author_name}} comments on {{p.plaintitle(v)}} - {{SITE_NAME}}">
<meta name="twitter:creator" content="{{'@'+comment_info.author_name}}">
<meta name="twitter:description" content="{{comment_info.plainbody(v)}}">
<meta name="twitter:image" content="{% if p.is_image %}{{p.realurl(v)}}{% elif p.has_thumb%}{{p.thumb_url}}{% else %}{{SITE_NAME}}/assets/images/{{SITE_NAME}}/site_preview.webp?v=1016{% endif %}">
<meta name="twitter:url" content="{{p.permalink}}">
{% else %}
<title>{{p.plaintitle(v)}} - {{SITE_NAME}}</title>
{% if p.author %}<meta property="og:article:author" content="{{'@'+p.author_name}}">{% endif %}
<meta property="article:published_time" content="{{p.created_datetime}}">
{% if p.edited_utc %}<meta property="article:modified_time" content="{{p.edited_string}}">{% endif %}
<meta property="og:description" name="description" content="{{p.plainbody(v)}}">
{% if p.author %}<meta property="og:author" name="author" content="{{'@'+p.author_name}}">{% endif %}
<meta property="og:title" content="{{p.plaintitle(v)}} - {{SITE_NAME}}">
<meta property="og:image" content="{% if p.is_image %}{{p.realurl(v)}}{% elif p.has_thumb%}{{p.thumb_url}}{% else %}{{SITE_NAME}}/assets/images/{{SITE_NAME}}/site_preview.webp?v=1016{% endif %}">
<meta property="og:url" content="{{p.permalink}}">
<meta property="og:site_name" content="{{request.host}}">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="{{SITE_FULL}}">
<meta name="twitter:title" content="{{p.plaintitle(v)}} - {{SITE_NAME}}">
{% if p.author %}<meta name="twitter:creator" content="{{'@'+p.author_name}}">{% endif %}
<meta name="twitter:description" content="{{p.plainbody(v)}}">
<meta name="twitter:image" content="{% if p.is_image %}{{p.realurl(v)}}{% elif p.has_thumb %}{{p.thumb_url}}{% else %}{{SITE_NAME}}/assets/images/{{SITE_NAME}}/site_preview.webp?v=1016{% endif %}">
<meta name="twitter:url" content="{{p.permalink}}">
{% endif %}
{% endblock %}
{% block pagetype %}thread{% endblock %}
{% block actionsModal %}
{% if v %}
<div class="modal fade d-md-none" id="actionsModal" tabindex="-1" role="dialog" aria-labelledby="actionsModalTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header p-3">
<h5 class="col modal-title text-center h6">More options</h5>
<button class="close position-absolute py-3" style="right: 1rem"data-bs-dismiss="modal" aria-label="Close">
<span aria-hidden="true"><i class="fas fa-times-circle text-gray-500"></i></span>
</button>
</div>
<div class="modal-body">
<ul class="list-group post-actions">
{% if v.id==p.author_id %}
<button class="nobackground btn btn-link btn-block btn-lg text-left text-muted" data-bs-dismiss="modal" onclick="togglePostEdit('{{p.id}}')"><i class="far fa-edit text-center text-muted mr-3"></i>Edit</button>
{% elif p.body %}
<button class="nobackground btn btn-link btn-block btn-lg text-left text-muted" data-bs-dismiss="modal" onclick="expandMarkdown(this,'{{p.id}}')"><i class="fas text-expand-icon-{{p.id}} fa-expand-alt text-center mr-3"></i><span>View source</span></button>
{% endif %}
{% include "post_actions_mobile.html" %}
</ul>
</div>
</div>
</div>
</div>
{% endif %}
{% if v and v.admin_level > 1 %}
{% include "post_admin_actions_mobile.html" %}
{% endif %}
{% endblock %}
{% block content %}
{% if request.host == 'pcmemes.net' %}
{% set cc='SPLASH MOUNTAIN' %}
{% else %}
{% set cc='COUNTRY CLUB' %}
{% endif %}
<div class="row mb-3">
<div id="post-root" class="col-12">
<div class="card border-0 mt-3{% if p.is_banned %} banned{% endif %}{% if p.stickied %} stickied{% endif %}{% if voted==1 %} upvoted{% elif voted==-1 %} downvoted{% endif %}">
<div id="post-{{p.id}}" class="{% if p.award_count('glowie') %}glow{% endif %} {% if p.deleted_utc %}deleted {% endif %}d-flex flex-row-reverse flex-nowrap justify-content-end">
{% if not p.is_image and p.thumb_url and not p.embed_url %}
<div class="card-header bg-transparent border-0 d-none d-md-flex flex-row flex-nowrap pl-3 p-0">
<a rel="nofollow noopener noreferrer" href="{{p.realurl(v)}}" style="height: fit-content"{% if not v or v.newtabexternal %}target="_blank"{% endif %}><img loading="lazy" src="{{p.thumb_url}}" class="post-img d-none d-md-block" alt="Unable to load image"></a>
</div>
{% endif %}
<div id="post-content" class="{% if p.deleted_utc %}deleted {% endif %}card-block w-100 my-md-auto">
<div class="post-meta text-left mb-2">
{% if p.sub %}
<a href='/h/{{p.sub}}'>/h/{{p.sub}}</a>&nbsp;&nbsp;
{% endif %}
{% if p.sub and p.author.exiled_from(p.sub) %}
<a role="button"><i class="fas fa-campfire text-danger" data-bs-toggle="tooltip" data-bs-placement="bottom" title="User has been exiled from /h/{{p.sub}}"></i></a>
{% endif %}
{% if p.bannedfor %}
<a role="button"><i class="fas fa-hammer-crash text-danger" data-bs-toggle="tooltip" data-bs-placement="bottom" title="User was banned for this post{% if p.author.banned_by %} by @{{p.author.banned_by.username}}{% endif %}"></i></a>
{% endif %}
{% for a in p.awards|reverse %}
<i class="{{a.class_list}} px-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{a.title}} Award given by @{{a.user.username}}"></i>
{% endfor %}
{% if v and v.admin_level > 1 and p.author.shadowbanned %}<i class="fas fa-user-times text-admin" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Shadowbanned by @{{p.author.shadowbanned}}"></i>{% endif %}
{% if p.stickied %}
<i id='pinned-{{p.id}}' class="fas fa-thumbtack fa-rotate--45 text-admin" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Pinned by @{{p.stickied}}" {% if p.stickied_utc %}onmouseover="pinned_timestamp('pinned-{{p.id}}')" data-timestamp={{p.stickied_utc}} {% endif %}></i>
{% endif %}
{% if p.is_pinned %}<i class="fas fa-thumbtack fa-rotate--45 fa-fw text-admin" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Pinned to profile"></i>{% endif %}
{% if p.distinguish_level %} <i class="fas fa-broom text-admin" data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{SITE_NAME}} Admin, speaking officially"></i>{% endif %}
{% if p.is_bot %} <i class="fas fa-robot text-info" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Bot"></i>{% endif %}
{% if p.over_18 %}<span class="badge badge-danger text-small-extra mr-1">+18</span>{% endif %}
{% if p.private %}<span class="badge border-warning border-1 text-small-extra">Draft</span>{% endif %}
{% if p.active_flags(v) %}<a class="btn btn-primary" role="button" style="padding:1px 5px; font-size:10px"onclick="document.getElementById('flaggers').classList.toggle('d-none')">{{p.active_flags(v)}} Report{{ help.plural(p.active_flags(v)) }}</a>{% endif %}
{% if not p.author %}
{{p.print()}}
{% endif %}
{% if p.ghost %}
<span {% if p.distinguish_level %}class="mod"{% endif %}>👻</span>
{% else %}
{% if SITE_NAME=='rDrama' and p.author.house %}
<img loading="lazy" src="/assets/images/{{SITE_NAME}}/houses/{{p.author.house}}.webp?v=7" height="20" data-bs-toggle="tooltip" data-bs-placement="bottom" title="House {{p.author.house}}" alt="House {{p.author.house}}">
{% endif %}
{% if p.author.verified %}<i class="fas fa-badge-check align-middle ml-1 {% if p.author.verified=='Glowiefied' %}glow{% endif %}" style="color:{% if p.author.verifiedcolor %}#{{p.author.verifiedcolor}}{% else %}#1DA1F2{% endif %}" data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{p.author.verified}}"></i>
{% endif %}
<a class="user-name text-decoration-none" href="{{p.author.url}}" data-pop-info='{{p.author.json_popover(v) | tojson}}' onclick='popclick(event)' data-bs-placement="bottom" data-bs-toggle="popover" data-bs-trigger="click" data-content-id="popover" role="button" tabindex="0" style="color: #{{p.author.namecolor}}; font-weight: bold"class="user-name">
<img loading="lazy" src="{{p.author.profile_url}}" class="profile-pic-25 mr-2">
{% if p.author.is_cakeday %}
<img class="party-hat" src="/assets/images/party-hat.webp" data-bs-toggle="tooltip" data-bs-placement="bottom" title="I’ve spent another year rotting my brain with dramaposting, please ridicule me 🤓">
{% endif %}
<span {% if p.author.patron and not p.distinguish_level %}class="patron" style="background-color:#{{p.author.namecolor}};"{% elif p.distinguish_level %}class="mod"{% endif %}>{{p.author_name}}</span>
</a>
{% if p.author.customtitle %}
&nbsp;<bdi style="color: #{{p.author.titlecolor}}">&nbsp;{{p.author.customtitle | safe}}</bdi>
{% endif %}
{% endif %}
<span data-bs-toggle="tooltip" data-bs-placement="bottom" id="timestamp" onmouseover="timestamp('timestamp','{{p.created_utc}}')">&nbsp;{{p.age_string}}</span>
({% if p.is_image %}image post{% elif p.is_video %}video post{% elif p.is_audio %}audio post{% elif p.domain %}<a href="/search/posts/?q=domain%3A{{p.domain}}&sort=new&t=all" {% if not v or v.newtabexternal %}target="_blank"{% endif %}>{{p.domain}}</a>{% else %}text post{% endif %})
{% if p.edited_utc %}
&nbsp;&nbsp;Edited <span data-bs-toggle="tooltip" data-bs-placement="bottom" onmouseover="timestamp('edited_timestamp','{{p.edited_utc}}')" id="edited_timestamp">{{p.edited_string}}</span>
{% endif %}
&nbsp;&nbsp;{{p.views}} thread views
</div>
{% if p.active_flags(v) %}
<div id="flaggers" class="flaggers d-none">
<strong><i class="far fa-fw fa-flag"></i> Reported by:</strong>
<pre></pre>
<ul style="padding-left:20px; margin-bottom: 0;word-wrap:break-word">
{% for f in p.flags(v) %}
<li><a style="font-weight:bold" href="{{f.user.url}}">{{f.user.username}}</a>{% if f.reason %}: {{f.realreason(v) | safe}}{% endif %} {% if v and v.admin_level > 1 %}<a role="button" onclick="post_toast(this,'/del_report/post/{{f.post_id}}/{{f.user_id}}')">[remove]</a>{% endif %}</li>
{% endfor %}
</ul>
</div>
{% endif %}
{% if p.realurl(v) %}
<h1 id="post-title" class="card-title post-title text-left mb-md-3 {% if p.author.agendaposter %}agendaposter{% endif %}"><a {% if not v or v.newtabexternal %}target="_blank"{% endif %} rel="nofollow noopener noreferrer" href="{{p.realurl(v)}}">
{% if p.club %}<span class="patron font-weight-bolder mr-1" style="background-color:red; font-size:12px; line-height:2;">{{CC}}</span>{% endif %}
{% if p.flair %}<span class="patron font-weight-bolder mr-1" style="background-color:var(--primary); font-size:12px; line-height:2;">{{p.flair | safe}}</span>{% endif %}
{{p.realtitle(v) | safe}}
</a></h1>
{% else %}
<h1 id="post-title" class="card-title post-title text-left mb-md-3 {% if p.author.agendaposter %}agendaposter{% endif %}">
{% if p.club %}<span class="patron font-weight-bolder mr-1" style="background-color:red; font-size:12px; line-height:2;">{{CC}}</span>{% endif %}
{% if p.flair %}<span class="patron font-weight-bolder mr-1" style="background-color:var(--primary); font-size:12px; line-height:2;">{{p.flair | safe}}</span>{% endif %}
{{p.realtitle(v) | safe}}
</h1>
{% endif %}
<div id="post-body" class="post-body mt-3">
{% if p.realurl(v) %}
{% if not p.embed_url and not p.is_image and not p.is_video and not p.is_audio %}
<a rel="nofollow noopener noreferrer" href="{{p.realurl(v)}}" {% if not v or v.newtabexternal %}target="_blank"{% endif %}>
<div class="d-flex d-md-none justify-content-between align-items-center border rounded p-2{% if p.realbody(v) %} mb-3{% endif %}">
<span>{{p.domain|truncate(30, True)}}</span>
<i class="fas fa-external-link-alt text-small"></i>
</div>
</a>
{% endif %}
{% endif %}
{% if p.embed_url %}
{% if p.domain == "twitter.com" %}
{{p.embed_url | safe}}
{% if v and v.theme.split("_")[0] in ["light", "coffee", "4chan"] %}
<script src="/assets/js/twitterlight.js?v=243"></script>
{% else %}
<script src="/assets/js/twitter.js?v=243"></script>
{% endif %}
{% elif p.domain in ['youtu.be','youtube.com'] and p.embed_url and p.embed_url.startswith('<lite-youtube') %}
{{p.embed_url | safe}}
{% endif %}
{% endif %}
<div id="post-text" {% if p.author.agendaposter %}class="agendaposter"{% endif %}>
{% if p.is_image %}
<div class="row no-gutters">
<div class="col">
<a {% if not v or v.newtabexternal %}target="_blank"{% endif %} rel="nofollow noopener noreferrer" href="{{p.realurl(v)}}">
<img src="{{p.realurl(v)}}" class="img-fluid" style="max-height:500px" alt="Unable to load image">
</a>
</div>
</div>
<pre></pre>
{% elif p.is_video %}
<div class="row no-gutters">
<div class="col">
<video controls preload="none">
<source src="{{p.realurl(v)}}">
</video>
</div>
</div>
<pre></pre>
{% elif p.is_audio %}
<div class="row no-gutters">
<div class="col">
<audio controls preload="none" src="{{p.realurl(v)}}"></audio>
</div>
</div>
<pre></pre>
{% endif %}
{{p.realbody(v) | safe}}
{% if p.is_banned and p.ban_reason %}
<div class="text-removed mb-0">removed by @{{p.ban_reason}}</div>
{% endif %}
</div>
</div>
{% if v and (v.id==p.author_id or v.admin_level > 2) and not v.is_suspended %}
<div id="edit-post-body-{{p.id}}" class="d-none comment-write collapsed child">
<form id="post-edit-form-{{p.id}}" action="/edit_post/{{p.id}}" method="post" enctype="multipart/form-data">
<input type="hidden" name="formkey" value="{{v.formkey}}">
<input type="hidden" name="current_page" value="{{request.path}}">
<textarea autocomplete="off" max-length="500" name="title" class="comment-box form-control rounded" required placeholder="title">{{p.title}}</textarea>
<textarea autocomplete="off" name="body" {% if v.longpost %}minlength="280"{% endif %} maxlength="{% if v.bird %}140{% else %}20000{% endif %}" oninput="markdown('post-edit-box-{{p.id}}', 'post-edit-{{p.id}}');charLimit('post-edit-box-{{p.id}}','charcount-post-edit')" id="post-edit-box-{{p.id}}" form="post-edit-form-{{p.id}}" class="comment-box form-control rounded" aria-label="With textarea" placeholder="Add text to your post..." rows="10" data-id="{{p.id}}">{{p.body}}</textarea>
<div class="text-small font-weight-bold mt-1" id="charcount-post-edit" style="right: 1rem; bottom: 0.5rem; z-index: 3;"></div>
<div class="comment-format">
<small class="format btn btn-secondary"><i class="fas fa-bold" aria-hidden="true" onclick="makeBold('post-edit-box-{{p.id}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Bold"></i></small>
<a class="format btn btn-secondary" role="button"><i class="fas fa-italic" aria-hidden="true" onclick="makeItalics('post-edit-box-{{p.id}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Italicize"></i></a>
<a class="format btn btn-secondary" role="button"><i class="fas fa-quote-right" aria-hidden="true" onclick="makeQuote('post-edit-box-{{p.id}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Quote"></i></a>
<a class="format btn btn-secondary" role="button"><span class="font-weight-bolder text-uppercase" onclick="commentForm('post-edit-box-{{p.id}}');getGif()" aria-hidden="true" data-bs-toggle="modal" data-bs-target="#gifModal" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Add GIF">GIF</span></a>
<div onclick="loadEmojis('post-edit-box-{{p.id}}')" class="format btn btn-secondary" role="button" aria-hidden="true" data-bs-toggle="modal" data-bs-target="#emojiModal" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Add Emoji"><i class="fas fa-smile-beam"></i></div>
<label class="format btn btn-secondary m-0 ml-1 {% if v %}d-inline-block{% else %}d-none{% endif %}" for="file-upload-edit-{{p.id}}">
<div id="filename-show-edit-{{p.id}}"><i class="fas fa-file"></i></div>
<input autocomplete="off" id="file-upload-edit-{{p.id}}" type="file" multiple="multiple" name="file" accept="image/*, video/*, audio/*" {% if request.headers.get('cf-ipcountry')=="T1" %}disabled{% endif %} onchange="changename('filename-show-edit-{{p.id}}','file-upload-edit-{{p.id}}')" hidden>
</label>
<small class="format d-none"><i class="fas fa-link" aria-hidden="true"></i></small>
</div>
<button form="post-edit-form-{{p.id}}" class="btn btn-primary ml-2 fl-r">Save Edit</button>
<a role="button" onclick="togglePostEdit('{{p.id}}')" class="btn btn-link text-muted ml-auto cancel-form fl-r">Cancel</a>
</form>
<div id="post-edit-{{p.id}}" class="preview mb-3 mt-5"></div>
<div class="form-text text-small p-0 m-0"><a href="/formatting" {% if v and v.newtab and not g.webview %}target="_blank"{% endif %}>Formatting help</a></div>
</div>
{% endif %}
{% if p.embed_url and "http" not in p.embed_url and "<" not in p.embed_url %}
<div id="crosspost-embed">
<div class="row no-gutters">
<div id="frontpage" class="col-12 pt-0">
<div class="posts" id="posts">
{{p.embed_url | post_embed(v) | safe}}
</div>
</div>
</div>
</div>
{% endif %}
<div class="d-none d-md-flex justify-content-between align-items-center mt-2">
<div class="post-actions mt-2">
<ul class="list-inline text-right d-flex">
<li class="list-inline-item">
<a {% if v and v.newtab and not g.webview %}target="_blank"{% endif %} href="{{p.permalink}}">
<i class="fas fa-comment-dots"></i>{{p.comment_count}}
<span class="text-info d-none {{p.id}}-new-comments"></span>
</a>
</li>
{% if v and (v.id==p.author_id or v.admin_level > 1 and v.admin_level > 2) %}
<a class="list-inline-item" role="button" onclick="togglePostEdit('{{p.id}}')"><i class="fas fa-edit"></i>Edit</a>
{% endif %}
{% if v and v.id != p.author_id and p.body %}
<a class="list-inline-item" role="button" onclick="expandMarkdown(this,'{{p.id}}')"><i class="fas text-expand-icon-{{p.id}} fa-expand-alt"></i><span>View source</span></a>
{% endif %}
{% include 'post_actions.html' %}
</ul>
</div>
</div>
</div>
{% if v %}
<div id="voting" class="voting d-none d-md-block mb-auto">
<div tabindex="0" role="button" onclick="vote('post', '{{p.id}}', '1')" class="post-{{p.id}}-up mx-auto arrow-up upvote-button post-{{p.id}}-up {% if voted==1 %}active{% endif %}"></div>
<span class="post-score-{{p.id}} score post-score-{{p.id}} {% if voted==1 %}score-up{% elif voted==-1%}score-down{% endif %}{% if p.controversial %} controversial{% endif %}" data-bs-toggle="tooltip" data-bs-placement="right" title="+{{ups}} | -{{downs}}">{{score}}</span>
<div {% if environ.get('DISABLE_DOWNVOTES') == '1' %}style="display:None!important"{% endif %} tabindex="0" role="button" onclick="vote('post', '{{p.id}}', '-1')" class="post-{{p.id}}-down text-muted mx-auto arrow-down downvote-button post-{{p.id}}-down {% if voted==-1 %}active{% endif %}"></div>
</div>
{% else %}
<div id="voting" class="voting d-none d-md-block mb-auto">
<div tabindex="0" role="button" onclick="vote('post', '{{p.id}}', '1')" class="post-{{p.id}}-up arrow-up mx-auto" onclick="location.href='/login?redirect={{request.path | urlencode}}';">
</div>
<span class="post-{{p.id}}-score-none score text-muted{% if p.controversial %} controversial{% endif %}"{% if not p.is_banned %} data-bs-toggle="tooltip" data-bs-placement="right" title="+{{ups}} | -{{downs}}"{% endif %}>{{score}}</span>
<div {% if environ.get('DISABLE_DOWNVOTES') == '1' %}style="display:None!important"{% endif %} tabindex="0" role="button" onclick="vote('post', '{{p.id}}', '-1')" class="post-{{p.id}}-down arrow-down mx-auto" onclick="location.href='/login?redirect={{request.path | urlencode}}';"></div>
</div>
{% endif %}
</div>
</div>
</div>
{% if not p.is_image and not p.is_video and not p.is_audio %}
<div class="row no-gutters d-md-none">
<div class="col">
<a {% if not v or v.newtabexternal %}target="_blank"{% endif %} rel="nofollow noopener noreferrer" href="{{p.realurl(v)}}"></a>
</div>
</div>
{% endif %}
</div>
<div class="row mb-3 d-md-none">
<div class="col-12">
<div class="post-actions">
<ul class="list-inline text-right d-flex">
<li class="list-inline-item mr-auto">
<a href="{{p.permalink}}">
<i class="fas fa-comment-dots"></i>{{p.comment_count}}
<span class="text-info d-none {{p.id}}-new-comments"></span>
</a>
{% if v and v.admin_level > 1 %}
<a class="ml-2" role="button" data-bs-toggle="modal" data-bs-target="#adminModal-{{p.id}}">
<i class="fas fa-broom"></i>
</a>
{% endif %}
</li>
{% if v %}
<li class="list-inline-item">
<a role="button" data-bs-toggle="modal" data-bs-target="#actionsModal">
<i class="fas fa-ellipsis-h"></i>
</a>
</li>
{% endif %}
<li id="voting-{{p.id}}-mobile" class="voting list-inline-item d-md-none{% if voted==1 %} upvoted{% elif voted==-1 %} downvoted{% endif %}">
{% if v %}
<span tabindex="0" role="button" onclick="vote('post-mobile', '{{p.id}}', '1')" class="post-mobile-{{p.id}}-up mx-0 pr-1 arrow-up upvote-button post-{{p.id}}-up {% if voted==1 %}active{% endif %}">
</span>
{% else %}
<span tabindex="0" class="arrow-{{p.id}}-mobile-up mx-0 pr-1 arrow-mobile-up" onclick="location.href='/login?redirect={{request.path | urlencode}}';">
<i class="fas fa-arrow-alt-up mx-0" aria-hidden="true"></i>
</span>
{% endif %}
<span class="post-mobile-score-{{p.id}} score post-score-{{p.id}} {% if voted==1 %}score-up{% elif voted==-1%}score-down{% endif %}{% if p.controversial %} controversial{% endif %}" data-bs-toggle="tooltip" data-bs-placement="top" title="+{{ups}} | -{{downs}}">{{score}}</span>
{% if v %}
<span {% if environ.get('DISABLE_DOWNVOTES') == '1' %}style="display:None!important"{% endif %} tabindex="0" role="button" onclick="vote('post-mobile', '{{p.id}}', '-1')" class="post-mobile-{{p.id}}-down mx-0 pl-1 my-0 arrow-down downvote-button post-{{p.id}}-down {% if voted==-1 %}active{% endif %}"></span>
{% else %}
<span {% if environ.get('DISABLE_DOWNVOTES') == '1' %}style="display:None!important"{% endif %} tabindex="0" class="arrow-{{p.id}}-mobile-down arrow-mobile-down mx-0 pl-1 my-0" onclick="location.href='/login?redirect={{request.path | urlencode}}';">
<i class="fas fa-arrow-alt-down mx-0" aria-hidden="true"></i>
</span>
{% endif %}
</li>
</ul>
</div>
</div>
</div>
{% if v and v.id != p.author_id and p.body %}
<textarea autocomplete="off" class="d-none card border my-2 p-3 comment-box form-control rounded" id="markdown-{{p.id}}" readonly>{{p.body.strip()}}</textarea>
{% endif %}
<div class="row border-md-0 comment-section pb-3">
<div class="col border-top">
<div class="comments-count py-3">
<div class="dropdown dropdown-actions">
<button class="btn btn-secondary dropdown-toggle" id="dropdownMenuButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{% if sort=="top" %}<i class="fas fa-arrow-alt-circle-up mr-1"></i>{% endif %}
{% if sort=="bottom" %}<i class="fas fa-arrow-alt-circle-down mr-1"></i>{% endif %}
{% if sort=="new" %}<i class="fas fa-sparkles mr-1"></i>{% endif %}
{% if sort=="old" %}<i class="fas fa-book mr-1"></i>{% endif %}
{% if sort=="controversial" %}<i class="fas fa-bullhorn mr-1"></i>{% endif %}
{{sort | capitalize}}
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton" x-placement="bottom-start" style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(0px, 31px, 0px);">
{% if sort != "top" %}<a class="dropdown-item" href="?sort=top"><i class="fas fa-arrow-alt-circle-up mr-2"></i>Top</a>{% endif %}
{% if sort != "bottom" %}<a class="dropdown-item" href="?sort=bottom"><i class="fas fa-arrow-alt-circle-down mr-2"></i>Bottom</a>{% endif %}
{% if sort != "new" %}<a class="dropdown-item" href="?sort=new"><i class="fas fa-sparkles mr-2"></i>New</a>{% endif %}
{% if sort != "old" %}<a class="dropdown-item" href="?sort=old"><i class="fas fa-book mr-2"></i>Old</a>{% endif %}
{% if sort != "controversial" %}<a class="dropdown-item" href="?sort=controversial"><i class="fas fa-bullhorn mr-2"></i>Controversial</a>{% endif %}
</div>
{% if comment_info and p.comment_count >= 2%}
<pre></pre>
<div class="total"><a href="{{p.permalink}}">View entire discussion</a></div>
{% endif %}
</div>
</div>
{% if v %}
<div id="comment-form-space-{{p.fullname}}" class="comment-write mb-3">
<form id="reply-to-{{p.fullname}}" action="/comment" method="post">
<input type="hidden" name="formkey" value="{{v.formkey}}">
<input type="hidden" name="parent_fullname" value="t2_{{p.id}}">
<input autocomplete="off" id="reply-form-submission-{{p.fullname}}" type="hidden" name="submission" value="{{p.id}}">
<textarea required autocomplete="off" {% if not (p and p.id in ADMIGGERS) %}{% if v.longpost %}minlength="280"{% elif v.bird %}maxlength="140"{% endif %}{% endif %} minlength="1" maxlength="10000" oninput="markdown('reply-form-body-{{p.fullname}}', 'form-preview-{{p.id}}');charLimit('reply-form-body-{{p.fullname}}','charcount-reply')" id="reply-form-body-{{p.fullname}}" data-fullname="{{p.fullname}}" class="comment-box form-control rounded" id="comment-form" name="body" form="reply-to-{{p.fullname}}" aria-label="With textarea" placeholder="Add your comment..." rows="3"></textarea>
<div class="text-small font-weight-bold mt-1" id="charcount-reply" style="right: 1rem; bottom: 0.5rem; z-index: 3;"></div>
<div class="comment-format">
<a class="btn btn-secondary format d-inline-block m-0" role="button"><i class="fas fa-bold" onclick="makeBold('reply-form-body-{{p.fullname}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Bold"></i></a>
&nbsp;
<a class="btn btn-secondary format d-inline-block m-0" role="button"><i class="fas fa-italic" onclick="makeItalics('reply-form-body-{{p.fullname}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Italicize"></i></a>
&nbsp;
<a class="btn btn-secondary format d-inline-block m-0" role="button"><i class="fas fa-quote-right" onclick="makeQuote('reply-form-body-{{p.fullname}}')" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Quote"></i></a>
&nbsp;
<label class="btn btn-secondary format d-inline-block m-0" for="gif-reply-btn-{{p.fullname}}">
<span id="gif-reply-btn-{{p.fullname}}" class="font-weight-bolder text-uppercase" onclick="commentForm('reply-form-body-{{p.fullname}}');getGif()" aria-hidden="true" data-bs-toggle="modal" data-bs-target="#gifModal" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Add GIF">GIF</span>
</label>
&nbsp;
<div onclick="loadEmojis('reply-form-body-{{p.fullname}}')" class="btn btn-secondary format d-inline-block m-0" id="emoji-reply-btn-{{p.fullname}}" aria-hidden="true" data-bs-toggle="modal" data-bs-target="#emojiModal" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Add Emoji"><i class="fas fa-smile-beam"></i></div>
&nbsp;
<label class="format btn btn-secondary m-0 ml-1 {% if v %}d-inline-block{% else %}d-none{% endif %}" for="file-upload-reply-{{p.fullname}}">
<div id="filename-show-reply-{{p.fullname}}"><i class="fas fa-file"></i></div>
<input autocomplete="off" id="file-upload-reply-{{p.fullname}}" type="file" multiple="multiple" name="file" accept="image/*, video/*, audio/*" {% if request.headers.get('cf-ipcountry')=="T1" %}disabled{% endif %} onchange="changename('filename-show-reply-{{p.fullname}}','file-upload-reply-{{p.fullname}}')" hidden>
</label>
</div>
<a id="save-reply-to-{{p.fullname}}" role="button" form="reply-to-{{p.fullname}}" class="btn btn-primary text-whitebtn ml-auto fl-r" onclick="post_comment('{{p.fullname}}', '{{p.id}}')">Comment</a>
</form>
<div id="form-preview-{{p.id}}" class="mb-3 mt-5"></div>
<div class="form-text text-small p-0 m-0"><a href="/formatting" {% if v and v.newtab and not g.webview %}target="_blank"{% endif %}>Formatting help</a></div>
</div>
{% else %}
<div class="comment-write mb-3">
<textarea autocomplete="off" maxlength="10000" class="comment-box form-control rounded" name="body" aria-label="With textarea" placeholder="Add your comment..." rows="3" onclick="location.href='/login?redirect={{request.path | urlencode}}';"></textarea>
</div>
<div class="card border-0 mt-4">
<div class="card-body">
<h5 class="card-title">Jump in the discussion.</h5>
<p class="card-text">No email address required.</p>
<div>
<a href="/signup" class="btn btn-primary">Sign up</a>
<a href="/login?redirect={{request.path | urlencode}}" class="btn btn-link text-muted">Sign in</a>
</div>
</div>
</div>
{% endif %}
{% if p.replies %}
<div class="comment-section">
{% with comments=p.replies %}
{% include "comments.html" %}
{% endwith %}
</div>
{% if offset %}
<script>
function viewmore(pid,sort,offset,ids) {
btn = document.getElementById("viewbtn");
btn.disabled = true;
btn.innerHTML = "Requesting...";
var form = new FormData();
const xhr = new XMLHttpRequest();
xhr.open("get", `/viewmore/${pid}/${sort}/${offset}?ids=${ids}`);
xhr.setRequestHeader('xhr', 'xhr');
xhr.onload=function(){
if (xhr.status==200) {
let e = document.getElementById(`viewmore-${offset}`);
e.innerHTML = xhr.response.replace(/data-src/g, 'src').replace(/data-cfsrc/g, 'src').replace(/style="display:none;visibility:hidden;"/g, '');
bs_trigger(e)
comments = JSON.parse(localStorage.getItem("old-comment-counts")) || {}
lastCount = comments['{{p.id}}']
if (lastCount)
{
{% for c in p.comments %}
{% if not (v and v.id==c.author_id) and not c.voted %}
if ({{c.created_utc*1000}} > lastCount.t)
try {document.getElementById("comment-{{c.id}}-only").classList.add('unread')}
catch(e) {}
{% endif %}
{% endfor %}
}
}
btn.disabled = false;
}
xhr.send(form)
}
</script>
{% endif %}
{% elif not p.replies and p.deleted_utc == 0 %}
<div class="comment-section text-center py-7">
<span class="fa-stack fa-2x text-muted mb-4">
<i class="fas fa-square text-gray-500 opacity-25 fa-stack-2x"></i>
<i class="fas text-gray-500 fa-ghost fa-stack-1x text-lg"></i>
</span>
<h2 class="h5">Be the first to comment!</h2>
{% if v %}
<p class="text-muted">This comment section is a ghost town...</p>
{% else %}
<p class="text-muted">This comment section is a ghost town. <a href="/login?redirect={{request.path | urlencode}}">Sign in</a></p>
{% endif %}
</div>
{% endif %}
</div>
</div>
{% if v and v.id==p.author_id %}
{% include "delete_post_modal.html" %}
{% endif %}
{% if v %}
{% include "report_post_modal.html" %}
{% endif %}
{% if v and (v.id == p.author_id or v.admin_level > 1 and v.admin_level > 2) %}
<script src="/assets/js/togglePostEdit.js?v=240"></script>
{% endif %}
{% if not v or v.highlightcomments %}
<script src="/assets/js/new_comments_count.js?v=242"></script>
{% endif %}
<script src="/assets/js/clipboard.js?v=240"></script>
{% if not p.replies %}
{% include "comments.html" %}
{% endif %}
{% if p.award_count("shit") %}
<script src="/assets/js/critters.js?v=245"></script>
<script src="/assets/js/bugs.js?v=245"></script>
{% endif %}
{% if p.award_count("fireflies") %}
<script src="/assets/js/critters.js?v=245"></script>
<script src="/assets/js/fireflies.js?v=245"></script>
{% endif %}
<script>
(() => {
{% if not v or v.highlightcomments %}
showNewCommentCounts('{{p.id}}', {{p.comment_count}})
{% endif %}
{% if "?context" not in request.full_path %}
localStorage.setItem("old-comment-counts", localStorage.getItem("comment-counts"))
const comments = JSON.parse(localStorage.getItem("comment-counts")) || {}
const newTotal = {{p.comment_count}} || ((comments['{{p.id}}'] || {c: 0}).c + 1)
comments['{{p.id}}'] = {c: newTotal, t: Date.now()}
localStorage.setItem("comment-counts", JSON.stringify(comments))
{% endif %}
})()
</script>
{% endblock %}