Threaded-view on status pages

It's hideous though, sorry

fedireads/static/format.css

@@ -197,3 +197,27 @@ th, td {
     font-size: 0.8em;
     color: #FF1654;
 }
+
+.comment-thread .reply h2 {
+    background: none;
+}
+.post.main {
+    background-color: #F3FFBD;
+}
+.post {
+    margin-left: 4em;
+    border-left: 2px solid #247BA0;
+}
+.post.depth-1 {
+    margin-left: 0;
+    border: none;
+}
+.post.depth-2 {
+    margin-left: 1em;
+}
+.post.depth-3 {
+    margin-left: 2em;
+}
+.post.depth-4 {
+    margin-left: 3em;
+}

fedireads/templates/book.html

@@ -20,7 +20,7 @@
         </form>
 
         {% for review in user_reviews %}
-        {% include 'snippets/review.html' with review=review %}
+        {% include 'snippets/status.html' with status=review hide_book=True main=True depth=1 %}
         {% endfor %}
     </div>
 </div>
@@ -62,7 +62,7 @@
         </form>
         <p>Average rating: {{ rating | stars }}</p>
         {% for review in reviews %}
-        {% include 'snippets/review.html' with review=review %}
+        {% include 'snippets/status.html' with status=review hide_book=True main=True depth=1 %}
         {% endfor %}
     </div>
 </div>

fedireads/templates/feed.html

@@ -38,7 +38,7 @@
     {% include 'snippets/tabs.html' with tabs=feed_tabs active_tab=active_tab %}
 
     {% for activity in activities %}
-        {% include 'snippets/activity.html' with activity=activity %}
+        {% include 'snippets/status.html' with status=activity depth=1 %}
     {% endfor %}
 </div>
 

fedireads/templates/snippets/activity.html

@@ -1,28 +0,0 @@
-{% load fr_display %}
-<div class="update">
-    {% if activity.status_type == 'Review' %}
-        {% include 'snippets/activity_banner.html' with content="reviewed <i>"|add:activity.book.title|add:"</i>"  %}
-        <div class="book-preview review">
-            {% include 'snippets/book.html' with book=activity.book size=large %}
-
-            <h3>{{ activity.name }}</h3>
-            <p>{{ activity.rating | stars }}</p>
-            <p>{{ activity.content | safe }}</p>
-        </div>
-        {% include 'snippets/interaction.html' with activity=activity %}
-    {% elif activity.status_type == 'Note' %}
-        {% include 'snippets/activity_banner.html' %}
-        <span>{{ activity.content | safe }}</span>
-        {% for book in activity.mention_books.all %}
-        <div class="book-preview review">
-            {% include 'snippets/book.html' with book=book size=large description=True %}
-        </div>
-        {% endfor %}
-        {% include 'snippets/interaction.html' with activity=activity %}
-    {% else %}
-    {# generic handling for a misc activity, which perhaps should not be displayed at all #}
-        did {{ activity.activity_type }}
-    </h2>
-    {% endif %}
-</div>
-

fedireads/templates/snippets/activity_banner.html

@@ -0,0 +1,10 @@
+{% load humanize %}
+<h2>
+    {% include 'snippets/avatar.html' with user=activity.user %}
+    {% include 'snippets/username.html' with user=activity.user %}
+    {{ content | safe }}
+    <span class="time-ago">
+        <a href="{{ activity.absolute_id }}">{{ activity.published_date | naturaltime }}</a>
+    </span>
+</h2>
+

fedireads/templates/snippets/interaction.html

@@ -11,7 +11,7 @@
     <form name="comment" action="/comment" method="post">
         {% csrf_token %}
         <input type="hidden" name="parent" value="{{ activity.id }}"></input>
-        {{ comment_form.content }}
+        <textarea name="content" cols="40" rows="10" id="id_content"></textarea>
         <button type="submit">Comment</button>
     </form>
 </div>

fedireads/templates/snippets/status.html

@@ -0,0 +1,20 @@
+{% load fr_display %}
+<div class="post {{ status.status_type|lower }} depth-{{ depth }} {% if main %}main{% else %}reply{% endif %}">
+    {% include 'snippets/activity_banner.html' with activity=status %}
+    {% if not hide_book and status.mention_books.count %}
+    <div class="book-preview">
+        {% include 'snippets/book.html' with book=status.mention_books.first %}
+    </div>
+    {% endif %}
+    {% if not hide_book and status.book%}
+    <div class="book-preview">
+        {% include 'snippets/book.html' with book=status.book %}
+    </div>
+    {% endif %}
+    {% if status.status_type == 'Review' %}<h4>{{ status.name }}
+        <small>{{ status.rating | stars }} stars, by {% include 'snippets/username.html' with user=status.user %}</small>
+    </h4>{% endif %}
+    <blockquote>{{ status.content }}</blockquote>
+    {% include 'snippets/interaction.html' with activity=status %}
+</div>
+

fedireads/templates/snippets/thread.html

@@ -0,0 +1,18 @@
+{% load fr_display %}
+{% with depth=depth|add:1 %}
+    {% if depth <= max_depth and status.reply_parent and direction <= 0 %}
+        {% with direction=-1 %}
+        {% include 'snippets/thread.html' with status=status|parent is_root=False %}
+        {% endwith %}
+    {% endif %}
+
+{% include 'snippets/status.html' with status=status main=is_root %}
+
+{% if depth <= max_depth and direction >= 0 %}
+    {% for reply in status|replies  %}
+        {% with direction=1 %}
+            {% include 'snippets/thread.html' with status=reply is_root=False %}
+        {% endwith %}
+    {% endfor %}
+{% endif %}
+{% endwith %}

fedireads/templates/status.html

@@ -2,15 +2,9 @@
 {% block content %}
 
 <div id="content">
-    {% if status.reply_parent %}
-    {% include 'snippets/status.html' with status=status.reply_parent %}
-    {% endif %}
-
-    {% include 'snippets/status.html' with status=status main=True %}
-
-    {% for reply in replies %}
-    {% include 'snippets/status.html' with status=reply %}
-    {% endfor %}
+    <div class="comment-thread">
+        {% include 'snippets/thread.html' with status=status depth=0 max_depth=6 is_root=True direction=0 %}
+    </div>
 </div>
 
 {% endblock %}

fedireads/templatetags/fr_display.py

@@ -55,6 +55,16 @@ def get_notification_count(user):
     return user.notification_set.filter(read=False).count()
 
 
+@register.filter(name='replies')
+def get_replies(status):
+    return models.Status.objects.filter(reply_parent=status).select_subclasses().all()[:10]
+
+
+@register.filter(name='parent')
+def get_parent(status):
+    return models.Status.objects.filter(id=status.reply_parent_id).select_subclasses().get()
+
+
 @register.simple_tag(takes_context=True)
 def shelve_button_identifier(context, book):
     ''' check what shelf a user has a book on, if any '''

fedireads/views.py

@@ -56,9 +56,9 @@ def home_tab(request, tab):
         Q(followers=request.user) | Q(id=request.user.id)
     )
 
-    activities = models.Status.objects.select_subclasses().order_by(
+    activities = models.Status.objects.order_by(
         '-created_date'
-    )
+    ).select_subclasses()
 
     if tab == 'home':
         # people you follow and direct mentions
@@ -75,7 +75,6 @@ def home_tab(request, tab):
 
     activities = activities[:10]
 
-    comment_form = forms.CommentForm()
     data = {
         'user': request.user,
         'shelves': shelves,
@@ -84,7 +83,6 @@ def home_tab(request, tab):
         'activities': activities,
         'feed_tabs': ['home', 'local', 'federated'],
         'active_tab': tab,
-        'comment_form': comment_form,
     }
     return TemplateResponse(request, 'feed.html', data)
 
@@ -195,10 +193,8 @@ def status_page(request, username, status_id):
     if user != status.user:
         return HttpResponseNotFound()
 
-    replies = models.Status.objects.filter(reply_parent=status).select_subclasses().all()
     data = {
         'status': status,
-        'replies': replies,
     }
     return TemplateResponse(request, 'status.html', data)