ttvdrops/templates/chzzk/dashboard.html
2026-04-01 04:04:58 +02:00

137 lines
7.6 KiB
HTML

{% extends "base.html" %}
{% block title %}
Chzzk Drops
{% endblock title %}
{% block extra_head %}
<link rel="alternate"
type="application/rss+xml"
title="All Chzzk campaigns (RSS)"
href="{% url 'chzzk:campaign_feed' %}" />
<link rel="alternate"
type="application/atom+xml"
title="All Chzzk campaigns (Atom)"
href="{% url 'chzzk:campaign_feed_atom' %}" />
<link rel="alternate"
type="application/atom+xml"
title="All Chzzk campaigns (Discord)"
href="{% url 'chzzk:campaign_feed_discord' %}" />
{% endblock extra_head %}
{% block content %}
<main>
<h1>Active Chzzk Drops</h1>
<div>CHZZK is South Korean alternative to Twitch.</div>
<!--RSS Feeds
<div>
<a href="{% url 'chzzk:campaign_feed' %}" title="RSS feed for all campaigns">[rss]</a>
<a href="{% url 'chzzk:campaign_feed_atom' %}" title="Atom feed for all campaigns">[atom]</a>
<a href="{% url 'chzzk:campaign_feed_discord' %}" title="Discord feed for all campaigns">[discord]</a>
<a href="{% url 'core:docs_rss' %}" title="RSS feed documentation">[explain]</a>
</div> -->
<hr />
{% if active_campaigns %}
{% for campaign in active_campaigns %}
<!-- {{ campaign }} -->
<article>
<header>
<h2>{{ campaign.category_value }}</h2>
<div style="font-size: 0.9rem; color: #666;">Status: {{ campaign.state }} | Campaign #{{ campaign.campaign_no }}</div>
</header>
<div style="display: flex; gap: 1rem;">
<div style="flex-shrink: 0;">
{% if campaign.image_url %}
<img src="{{ campaign.image_url }}"
width="200"
height="200"
alt="{{ campaign.title }} image"
style="width: 200px;
height: auto;
border-radius: 8px" />
{% else %}
<div style="width: 200px;
height: 200px;
background-color: #eee;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px">No Image</div>
{% endif %}
</div>
<div style="flex: 1;">
<h3>
<a href="{% url 'chzzk:campaign_detail' campaign.campaign_no %}">{{ campaign.title }}</a>
</h3>
{% if campaign.description %}
<p style="margin: 0.25rem 0; font-style: italic;">{{ campaign.description }}</p>
{% endif %}
<!-- Start -->
{% if campaign.start_date %}
<p style="margin: 0.25rem 0;">
<strong>Starts:</strong>
<time datetime="{{ campaign.start_date|date:'c' }}"
title="{{ campaign.start_date|date:'DATETIME_FORMAT' }}">
{{ campaign.start_date|date:"M d, Y H:i" }}
</time>
{% if campaign.start_date < now %}
(started {{ campaign.start_date|timesince }} ago)
{% else %}
(in {{ campaign.start_date|timeuntil }})
{% endif %}
</p>
{% endif %}
<!-- End -->
{% if campaign.end_date %}
<p style="margin: 0.25rem 0;">
<strong>Ends:</strong>
<time datetime="{{ campaign.end_date|date:'c' }}"
title="{{ campaign.end_date|date:'DATETIME_FORMAT' }}">
{{ campaign.end_date|date:"M d, Y H:i" }}
</time>
{% if campaign.end_date < now %}
(ended {{ campaign.end_date|timesince }} ago)
{% else %}
(in {{ campaign.end_date|timeuntil }})
{% endif %}
</p>
{% endif %}
{% if campaign.reward_type %}
<p style="margin: 0.25rem 0;">
<strong>Reward Type:</strong> {{ campaign.reward_type }}
</p>
{% endif %}
<p style="margin: 0.25rem 0;">
{% if campaign.account_link_url %}<a href="{{ campaign.account_link_url }}">Connect account</a> |{% endif %}
{% if campaign.pc_link_url %}<a href="{{ campaign.pc_link_url }}" target="_blank">View on Chzzk</a>{% endif %}
</p>
<div style="margin-top: 0.5rem; font-size: 0.9rem;">
<strong>Participating channels:</strong>
<p style="margin: 0.25rem 0 0 0;">{{ campaign.category_value }} is game wide.</p>
</div>
{% if campaign.rewards.all %}
<div style="margin-top: 0.75rem;">
<strong>Rewards:</strong>
<ul style="margin: 0.25rem 0 0 0; padding-left: 1rem;">
{% for reward in campaign.rewards.all %}
<li>
{% if reward.image_url %}
<img src="{{ reward.image_url }}"
alt="{{ reward.title }}"
width="56"
height="56"
style="vertical-align: middle;
border-radius: 4px" />
{% endif %}
{{ reward.title }} ({{ reward.condition_for_minutes }} min)
</li>
{% endfor %}
</ul>
</div>
{% endif %}
</div>
</div>
</article>
{% endfor %}
{% else %}
<p>No active Chzzk drop campaigns at the moment. Check back later!</p>
{% endif %}
</main>
{% endblock content %}