1e418619f1
Add the ability to search for specific comments within posts.
Known issues:
- Just like on reddit, this does not work with comment sorting. The
sorting order is ignored during the search and changing the sorting
order after the search does not change anything. I do not think we
can fix this before reddit does, since in my understanding we rely
on them for the sorting. However we could implement a default
sorting method ourselves by taking the vector of comments returned
from the search and sorting it manually.
- The UI could be improved on mobile. On screens with a max width
inferior to 480 pixels, the comment search bar is displayed below
the comment sorting form. It would be great if we could make the
search bar have the same width as the whole comment sorting form
but I do not have the willpower to write any more css.
89 lines
3.4 KiB
HTML
89 lines
3.4 KiB
HTML
{% extends "base.html" %}
|
|
{% import "utils.html" as utils %}
|
|
|
|
{% block title %}{{ post.title }} - r/{{ post.community }}{% endblock %}
|
|
|
|
{% block search %}
|
|
{% call utils::search(["/r/", post.community.as_str()].concat(), "") %}
|
|
{% endblock %}
|
|
|
|
{% block root %}/r/{{ post.community }}{% endblock %}{% block location %}r/{{ post.community }}{% endblock %}
|
|
{% block head %}
|
|
{% call super() %}
|
|
<!-- Meta Tags -->
|
|
<meta name="author" content="u/{{ post.author.name }}">
|
|
<meta name="title" content="{{ post.title }} - r/{{ post.community }}">
|
|
<meta property="og:title" content="{{ post.title }} - r/{{ post.community }}">
|
|
<meta property="og:description" content="View on Libreddit, an alternative private front-end to Reddit.">
|
|
<meta property="og:url" content="{{ post.permalink }}">
|
|
<meta property="twitter:url" content="{{ post.permalink }}">
|
|
<meta property="twitter:title" content="{{ post.title }} - r/{{ post.community }}">
|
|
<meta property="twitter:description" content="View on Libreddit, an alternative private front-end to Reddit.">
|
|
{% if post.post_type == "image" %}
|
|
<meta property="og:type" content="image">
|
|
<meta property="og:image" content="{{ post.thumbnail.url }}">
|
|
<meta property="twitter:card" content="summary_large_image">
|
|
<meta property="twitter:image" content="{{ post.thumbnail.url }}">
|
|
{% else if post.post_type == "video" || post.post_type == "gif" %}
|
|
<meta property="twitter:card" content="video">
|
|
<meta property="og:type" content="video">
|
|
<meta property="og:video" content="{{ post.media.url }}">
|
|
<meta property="og:video:type" content="video/mp4">
|
|
{% else %}
|
|
<meta property="og:type" content="website">
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block subscriptions %}
|
|
{% call utils::sub_list(post.community.as_str()) %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div id="column_one">
|
|
{% call utils::post(post) %}
|
|
|
|
<!-- SORT FORM -->
|
|
<div id="commentQueryForms">
|
|
<form id="sort">
|
|
<p id="comment_count">{{post.comments.0}} {% if post.comments.0 == "1" %}comment{% else %}comments{% endif %} <span id="sorted_by">sorted by </span></p>
|
|
<select name="sort" title="Sort comments by" id="commentSortSelect">
|
|
{% call utils::options(sort, ["confidence", "top", "new", "controversial", "old"], "confidence") %}
|
|
</select>
|
|
<button id="sort_submit" class="submit">
|
|
<svg width="15" viewBox="0 0 110 100" fill="none" stroke-width="10" stroke-linecap="round">
|
|
<path d="M20 50 H100" />
|
|
<path d="M75 15 L100 50 L75 85" />
|
|
→
|
|
</svg>
|
|
</button>
|
|
</form>
|
|
<!-- SEARCH FORM -->
|
|
<form id="sort">
|
|
<input id="search" type="search" name="q" value="{{ comment_query }}" placeholder="Search comments">
|
|
<input type="hidden" name="type" value="comment">
|
|
</form>
|
|
</div>
|
|
|
|
<div>
|
|
{% if comment_query != "" %}
|
|
Comments containing "{{ comment_query }}" | <a id="allCommentsLink" href="{{ url_without_query }}">All comments</a>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<!-- COMMENTS -->
|
|
{% for c in comments -%}
|
|
<div class="thread">
|
|
{% if single_thread %}
|
|
<p class="thread_nav"><a href="{{ post.permalink }}">View all comments</a></p>
|
|
{% if c.parent_kind == "t1" %}
|
|
<p class="thread_nav"><a href="?context=9999">Show parent comments</a></p>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
{{ c.render().unwrap()|safe }}
|
|
</div>
|
|
{%- endfor %}
|
|
|
|
</div>
|
|
{% endblock %}
|