Support for viewing completed polls

This commit is contained in:
Jason McBrayer 2019-07-09 19:37:18 -04:00
parent 76b50cedd2
commit 83f46babe5
4 changed files with 190 additions and 146 deletions

View File

@ -240,6 +240,12 @@ a.navbar-item span:nth-child(2):before
content: " "; content: " ";
} }
div.poll {
margin-bottom: 1ex;
margin-top: 1em;
max-width: 90%;
}
/* Fix some rules that don't need to be there */ /* Fix some rules that don't need to be there */
.content figure:not(:last-child) .content figure:not(:last-child)
{ {

View File

@ -2,7 +2,6 @@ body > section > div.container {
max-width: 100%; max-width: 100%;
} }
.reblog-icon { .reblog-icon {
position: relative; position: relative;
top: -24px; top: -24px;
@ -219,6 +218,14 @@ a.navbar-item span:nth-child(2):before
content: " "; content: " ";
} }
div.poll {
margin-bottom: 1ex;
margin-top: 1em;
max-width: 90%;
}
/* Fix some rules that don't need to be there */ /* Fix some rules that don't need to be there */
.content figure:not(:last-child) .content figure:not(:last-child)
{ {

View File

@ -6,56 +6,68 @@
{% if active %} {% if active %}
<article id="toot-{{toot.id}}" class="media box active-context"> <article id="toot-{{toot.id}}" class="media box active-context">
{% else %} {% else %}
<article id="toot-{{toot.id}}" class="media box"> <article id="toot-{{toot.id}}" class="media box">
{% endif %} {% endif %}
<figure class="media-left"> <figure class="media-left">
<p class="image is-64x64 account-avatar"> <p class="image is-64x64 account-avatar">
<a href="{% url "user" toot.account.acct %}"> <a href="{% url "user" toot.account.acct %}">
<img src="{{ toot.account.avatar_static }}" <img src="{{ toot.account.avatar_static }}"
alt=""> alt="">
</a> </a>
</p> </p>
{% if reblog %}
<p class="image is-32x32 reblog-icon" >
<a href="{% url "user" reblog_by %}">
<img src ="{{ reblog_icon }}" alt="">
</a>
</p>
{% endif %}
</figure>
<div class="media-content">
<div class="content">
<p>
<strong>{{ toot.account.display_name }}</strong>
<small><a href="{% url "user" toot.account.acct %}">
@{{ toot.account.acct }}</a></small>
<a href="{{ toot.url }}">
<small>{{ toot.created_at |humane_time }}</small>
</a>
{% if reblog %} {% if reblog %}
<p class="image is-32x32 reblog-icon" > <br>
<a href="{% url "user" reblog_by %}"> Boosted by @{{ reblog_by }}
<img src ="{{ reblog_icon }}" alt="">
</a>
</p>
{% endif %} {% endif %}
</figure> </p>
<div class="media-content"> {% if toot.spoiler_text %}
<div class="content"> <details class="toot">
<p> <summary><strong>{{ toot.spoiler_text }} </strong></summary>
<strong>{{ toot.account.display_name }}</strong>
<small><a href="{% url "user" toot.account.acct %}">@{{ toot.account.acct }}</a></small>
<a href="{{ toot.url }}">
<small>{{ toot.created_at |humane_time }}</small>
</a>
{% if reblog %}
<br>
Boosted by @{{ reblog_by }}
{% endif %}
</p>
{% if toot.spoiler_text %}
<details class="toot">
<summary><strong>{{ toot.spoiler_text }} </strong></summary>
<div class="toot">
{{ toot.content | relink_toot | fix_emojos:toot.emojis | strip_html | safe }}
</div>
</details>
{% else %}
<div class="toot"> <div class="toot">
{{ toot.content | relink_toot | fix_emojos:toot.emojis | strip_html | safe }} {{ toot.content | relink_toot | fix_emojos:toot.emojis | strip_html | safe }}
</div> </div>
{% endif %} </details>
{% else %}
<div class="toot">
{{ toot.content | relink_toot | fix_emojos:toot.emojis | strip_html | safe }}
</div>
{% endif %}
{% if toot.card %} {% if toot.poll %}
<div class="card"> <div class="poll">
<div class="card-content columns"> {% if toot.poll.voted or toot.poll.expired %}
{% if toot.card.image %} {% include "polls/completed_partial.html" with toot=toot %}
{% else %}
<!-- Poll form -->
{% endif %}
</div>
{% endif %}
{% if toot.card %}
<div class="card">
<div class="card-content columns">
{% if toot.card.image %}
<div class="column is-one-third"> <div class="column is-one-third">
<a href="{{ toot.card.url }}"> <a href="{{ toot.card.url }}">
<img alt="{{ toot.card.title }}" <img alt="{{ toot.card.title }}"
@ -63,126 +75,126 @@
class="is-max-128"> class="is-max-128">
</a> </a>
</div> </div>
{% endif %} {% endif %}
<div class="column is-two-thirds"> <div class="column is-two-thirds">
<p> <p>
<strong> <strong>
<a href="{{ toot.card.url }}"> <a href="{{ toot.card.url }}">
{{ toot.card.title }} {{ toot.card.title }}
</a> </a>
</strong> </strong>
<p>{{ toot.card.description }}</p> <p>{{ toot.card.description }}</p>
</div>
</div> </div>
</div> </div>
{% endif %} </div>
{% endif %}
{% if toot.media_attachments %} {% if toot.media_attachments %}
<br> <br>
<div class="columns is-multiline attachments is-gapless"> <div class="columns is-multiline attachments is-gapless">
{% for media in toot.media_attachments %} {% for media in toot.media_attachments %}
{% if media.type == "image" %} {% if media.type == "image" %}
<figure class="column attachment-image"> <figure class="column attachment-image">
<a href="{{ media.url }}">
{% if toot.sensitive %}
<img src="{% static "images/sensitive.png" %}"
{% else %}
<img src="{{ media.preview_url }}"
{% endif %}
alt="{% if media.description %}
{{ media.description }}
{% elif media.text_url %}
{{ media.text_url }}
{% else %}
{{ media.url }}
{% endif %}"
{% if media.description %}
title="{{ media.description }}"
{% endif %}
class="image is-max-256">
</a>
</figure>
{% else %}
<figure class="column">
<video controls loop class="is-max-256"
poster="{{ media.preview_url }}">
<source src="{{ media.url }}" type="video/mp4">
<a href="{{ media.url }}"> <a href="{{ media.url }}">
{% if toot.sensitive %} {% if toot.sensitive %}
<img src="{% static "images/sensitive.png" %}" <img src="{% static "images/sensitive.png" %}"
{% else %} {% else %}
<img src="{{ media.preview_url }}" <img src="{{ media.preview_url }}"
{% endif %} {% endif %}
alt="{% if media.description %} alt="{% if media.description %}
{{ media.description }} {{ media.description }}
{% elif media.text_url %} {% elif media.text_url %}
{{ media.text_url }} {{ media.text_url }}
{% else %} {% else %}
{{ media.url }} {{ media.url }}
{% endif %}" {% endif %}"
{% if media.description %} {% if media.description %}
title="{{ media.description }}" title="{{ media.description }}"
{% endif %} {% endif %}
class="image is-max-256"> class="image is-max-256">
</a> </a>
</video> </figure>
</figure> {% else %}
<figure class="column">
<video controls loop class="is-max-256"
poster="{{ media.preview_url }}">
<source src="{{ media.url }}" type="video/mp4">
<a href="{{ media.url }}">
{% if toot.sensitive %}
<img src="{% static "images/sensitive.png" %}"
{% else %}
<img src="{{ media.preview_url }}"
{% endif %}
alt="{% if media.description %}
{{ media.description }}
{% elif media.text_url %}
{{ media.text_url }}
{% else %}
{{ media.url }}
{% endif %}"
{% if media.description %}
title="{{ media.description }}"
{% endif %}
class="image is-max-256">
</a>
</video>
</figure>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div>
{% endif %}
<br>
<p class="is-hidden"></p>
</div> </div>
{% if not confirm_page %} {% endif %}
<nav class="level is-mobile"> <br>
<div class="level-left"> <p class="is-hidden"></p>
<a href="{% url "reply" toot.id %}#toot-{{ toot.id }}" class="level-item">
{% if toot.replies_count > 0 %} </div>
{% if not confirm_page %}
<nav class="level is-mobile">
<div class="level-left">
<a href="{% url "reply" toot.id %}#toot-{{ toot.id }}" class="level-item">
{% if toot.replies_count > 0 %}
<span class="fa fa-reply-all"> <span class="fa fa-reply-all">
<span class="is-hidden-mobile"><strong>Reply</strong></span> <span class="is-hidden-mobile"><strong>Reply</strong></span>
</span> </span>
{% else %} {% else %}
<span class="fa fa-reply"> <span class="fa fa-reply">
<span class="is-hidden-mobile">Reply</span> <span class="is-hidden-mobile">Reply</span>
</span> </span>
{% endif %} {% endif %}
</a> </a>
{% if toot.visibility != 'private' and toot.visibility != 'direct' %} {% if toot.visibility != 'private' and toot.visibility != 'direct' %}
<a href="{% url "boost" toot.id %}" class="level-item" <a href="{% url "boost" toot.id %}" class="level-item"
ic-post-to="{% url "boost" toot.id %}" ic-post-to="{% url "boost" toot.id %}"
ic-indicator="#toot-spinner-{{toot.id}}"> ic-indicator="#toot-spinner-{{toot.id}}">
{% if toot.reblogged %} {% if toot.reblogged %}
<span class="fa fa-retweet has-text-warning"> <span class="fa fa-retweet has-text-warning">
<strong class="is-hidden-mobile" >Boosted</strong> <strong class="is-hidden-mobile" >Boosted</strong>
{% else %} {% else %}
<span class="fa fa-retweet" > <span class="fa fa-retweet" >
<span class="is-hidden-mobile" >Boost</span> <span class="is-hidden-mobile" >Boost</span>
{% endif %} {% endif %}
</span>
</span> </span>
</span>
</a> </a>
{% endif %} {% endif %}
<a href="{% url "fav" toot.id %}" class="level-item" <a href="{% url "fav" toot.id %}" class="level-item"
ic-post-to="{% url "fav" toot.id %}" ic-post-to="{% url "fav" toot.id %}"
ic-indicator="#toot-spinner-{{toot.id}}"> ic-indicator="#toot-spinner-{{toot.id}}">
{% if toot.favourited %} {% if toot.favourited %}
<span class="fa fa-heart has-text-warning"> <span class="fa fa-heart has-text-warning">
<strong class="is-hidden-mobile" >Favorited</strong> <strong class="is-hidden-mobile" >Favorited</strong>
{% else %} {% else %}
<span class="fa fa-heart"> <span class="fa fa-heart">
<span class="is-hidden-mobile" >Favorite</span> <span class="is-hidden-mobile" >Favorite</span>
{% endif %} {% endif %}
</span> </span>
</span> </span>
</a> </a>
<i id="toot-spinner-{{toot.id}}" class="fa fa-spinner fa-spin" style="display:none"></i> <i id="toot-spinner-{{toot.id}}" class="fa fa-spinner fa-spin" style="display:none"></i>
</div> </div>
<div class="level-right"> <div class="level-right">
{% if toot.account.acct == own_acct.acct %} {% if toot.account.acct == own_acct.acct %}
<a class="level-item" href="{% url "redraft" toot.id %}"> <a class="level-item" href="{% url "redraft" toot.id %}">
redraft redraft
</a> </a>
@ -194,23 +206,23 @@
ic-action-target="#toot-{{ toot.id }}"> ic-action-target="#toot-{{ toot.id }}">
delete delete
</a> </a>
{% endif %} {% endif %}
{{ toot.visibility }} {{ toot.visibility }}
&nbsp;&nbsp; &nbsp;&nbsp;
{% if toot.in_reply_to_id or toot.replies_count > 0 %} {% if toot.in_reply_to_id or toot.replies_count > 0 %}
<a class="level-item" href="{% url "thread" toot.id %}#toot-{{ toot.id }}"> <a class="level-item" href="{% url "thread" toot.id %}#toot-{{ toot.id }}">
<span class="fa fa-comments"></span> <span class="fa fa-comments"></span>
<strong> thread</strong> <strong> thread</strong>
</a> </a>
{% else %} {% else %}
<a class="level-item" href="{% url "thread" toot.id %}#toot-{{ toot.id }}"> <a class="level-item" href="{% url "thread" toot.id %}#toot-{{ toot.id }}">
thread thread
</a> </a>
{% endif %} {% endif %}
</div> </div>
</nav> </nav>
{% endif %} {% endif %}
</div> </div>
<div class="media-right"></div> <div class="media-right"></div>
</article> </article>

View File

@ -0,0 +1,19 @@
{% load sanitizer %}
{% load taglinks %}
{% load static %}
<div class="columns is-multiline">
{% for option in toot.poll.options %}
<div class="column is-one-quarter">
<strong>{{ option.title }}</strong>
({{ option.votes_count}} vote{{ option.votes_count|pluralize }})
</div>
<div class="column is-three-quarters">
<progress class="progress is-primary"
value="{{ option.votes_count }}"
max="{{ toot.poll.votes_count }}"
{{ option.votes_count }}
</progress>
</div>
{% endfor %}
</div>