Thumbnail insertion code

app/helpers/application_helper.rb

@@ -241,8 +241,9 @@ module ApplicationHelper
   end
 
   def user_avatar(post_id)
-    DeferredPosts.add(post_id) if post_id
-    tag.div (tag.img class: 'thumb-img placeholder', src: '/images/thumb-preview.png', height: 100, width: 100), class: 'thumbnail placeholder', id: "tp-#{post_id}"
+    return "" unless post_id
+    DeferredPosts.add(post_id)
+    tag.div (tag.img class: 'thumb-img placeholder', src: '/images/thumb-preview.png', height: 100, width: 100), class: 'post-thumb placeholder', id: "tp-#{post_id}", 'data-id': post_id
   end
   
 protected

app/javascript/packs/application.js

@@ -43,6 +43,7 @@ export { default as Shortcuts } from '../src/javascripts/shortcuts.js';
 export { default as Upload } from '../src/javascripts/uploads.js';
 export { default as Utility } from '../src/javascripts/utility.js';
 export { default as Ugoira } from '../src/javascripts/ugoira.js';
+export { default as Thumbnails } from '../src/javascripts/thumbnails.js';
 
 import Takedown from '../src/javascripts/takedowns.js';
 window.Takedown = Takedown;

app/javascript/src/javascripts/blacklists.js

@@ -137,7 +137,7 @@ Blacklist.apply = function () {
 }
 
 Blacklist.posts = function () {
-  return $(".post-preview, #image-container, #c-comments .post, .mod-queue-preview.post-preview, .user-avatar");
+  return $(".post-preview, #image-container, #c-comments .post, .mod-queue-preview.post-preview, .post-thumbnail");
 }
 
 Blacklist.post_match = function (post, entry) {

app/javascript/src/javascripts/thumbnails.js

@@ -0,0 +1,46 @@
+import Blacklist from './blacklists';
+
+const Thumbnails = {};
+
+Thumbnails.initialize = function () {
+  const postsData = window.___deferred_posts || {};
+  const posts = $('.post-thumb.placeholder');
+  $.each(posts, function (i, post) {
+    const p = $(post);
+    const postID = p.data('id');
+    if (!postID) {
+      p.empty();
+      return;
+    }
+    const postData = postsData[postID];
+    if (!postData) {
+      p.empty();
+      return;
+    }
+    let blacklist_hit_count = 0;
+    $.each(Blacklist.entries, function (j, entry) {
+      if (Blacklist.post_match_object(postData, entry)) {
+        entry.hits += 1;
+        blacklist_hit_count += 1;
+      }
+    });
+    const blacklisted = blacklist_hit_count > 0;
+    for (const key in postData) {
+      p.data(key.replace(/_/g, '-'), postData[key]);
+    }
+    p.attr('class', blacklisted ? "post-thumbnail blacklisted blacklisted-active" : "post-thumbnail");
+    const img = $('<img>');
+    img.attr('src', postData.preview_url);
+    img.attr({height: 100, width: 100, title: postData.tags, alt: postData.tags, class: 'post-thumbnail-img'});
+    const link = $('<a>');
+    link.attr('href', `/posts/${postData.id}`);
+    link.append(img);
+    p.empty().append(link);
+  });
+};
+
+$(document).ready(function () {
+  Thumbnails.initialize();
+});
+
+export default Thumbnails;

app/javascript/src/styles/common/blacklists.scss

@@ -45,6 +45,6 @@
   }
 }
 
-.post-preview.blacklisted-active, #image-container.blacklisted-active, #c-comments .post.blacklisted-active {
+.post-preview.blacklisted-active, #image-container.blacklisted-active, #c-comments .post.blacklisted-active, .post-thumbnail.blacklisted-active {
   display: none;
 }

app/models/post.rb

@@ -1559,6 +1559,7 @@ class Post < ApplicationRecord
       if visible?
         hash['md5'] = md5
         hash['preview_url'] = preview_file_url
+        hash['cropped_url'] = crop_file_url
       end
       hash
     end

app/views/comments/partials/show/_comment.html.erb

@@ -2,6 +2,7 @@
   <a name="comment-<%= comment.id %>"></a>
   <article class="comment <%= "below-threshold" if comment.below_threshold? %>" data-post-id="<%= comment.post_id %>" data-comment-id="<%= comment.id %>" data-score="<%= comment.score %>" data-creator="<%= comment.creator_name %>" data-is-sticky="<%= comment.is_sticky %>">
     <div class="author">
+      <%= user_avatar(comment.creator.avatar_id) %>
       <h1>
         <%= link_to_user comment.creator %>
         <% if comment.is_deleted? %>