Add support for viewing comments without js

Improve stylings

assets/css/default.css

@@ -397,6 +397,14 @@ p.video-data   { margin: 0; font-weight: bold; font-size: 80%; }
   margin: auto;
 }
 
+/*
+ * We don't want the top and bottom margin on the post page.
+ */
+.comments.post-comments {
+  margin-bottom: 0;
+  margin-top: 0;
+}
+
 .video-iframe-wrapper {
   position: relative;
   height: 0;

src/invidious/routes/channels.cr

@@ -200,11 +200,15 @@ module Invidious::Routes::Channels
     prefs = env.get("preferences").as(Preferences)
 
     locale = prefs.locale
-    region = env.params.query["region"]? || prefs.region
 
     thin_mode = env.params.query["thin_mode"]? || prefs.thin_mode
     thin_mode = thin_mode == "true"
 
+    nojs = env.params.query["nojs"]?
+
+    nojs ||= "0"
+    nojs = nojs == "1"
+
     if !ucid.nil?
       ucid = ucid.to_s
       post_response = fetch_channel_community_post(ucid, id, locale, "json", thin_mode)
@@ -218,6 +222,11 @@ module Invidious::Routes::Channels
     end
 
     post_response = JSON.parse(post_response)
+
+    if nojs
+      comments = Comments.fetch_community_post_comments(ucid, id)
+      comment_html = JSON.parse(Comments.parse_youtube(id, comments, "html", locale, thin_mode, isPost: true))["contentHtml"]
+    end
     templated "post"
   end
 

src/invidious/views/post.ecr

@@ -2,10 +2,27 @@
 <title>Invidious</title>
 <% end %>
 
-<div id="post" class="comments">
+<div>
+    <div id="post" class="comments post-comments">
         <%= IV::Frontend::Comments.template_youtube(post_response.not_nil!, locale, thin_mode) %>
-</div>
-<div id="comments" class="comments">
+    </div>
+
+    <% if nojs %>
+        <hr>
+    <% end %>
+    <br />
+
+    <div id="comments" class="comments post-comments">
+        <% if nojs %>
+            <%= comment_html %>
+        <% else %>
+            <noscript>
+                <a href="/post/<%= id %>?ucid=<%= ucid %>&nojs=1">
+                    <%= translate(locale, "Hi! Looks like you have JavaScript turned off. Click here to view comments, keep in mind they may take a bit longer to load.") %>
+                </a>
+            </noscript>
+        <% end %>
+    </div>
 </div>
 
 <script id="video_data" type="application/json">