jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

posts: increase default thumbnail size.

Browse Source 
* Increase the default thumbnail size from small (150x150) to medium (180x180).
* Change the mobile layout to use three posts per row instead of two for small thumbnails.

Parent/child posts are still 150x150 to avoid taking up even more space above posts.
This commit is contained in:
evazion
2021-12-13 03:22:57 -06:00
parent e04892fb38
commit 0997f5595e
7 changed files with 22 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/components/post_gallery_component.rb
View File

@@ -7,6 +7,10 @@
# seen in parent/child post sets.
#
class PostGalleryComponent < ApplicationComponent
# The default size of thumbnails in a gallery. See also PostPreviewComponent::DEFAULT_SIZE
# for the default size of standalone thumbnails.
DEFAULT_SIZE = "180"
attr_reader :inline, :size, :options
# The list of posts in the gallery.
@@ -20,7 +24,7 @@ class PostGalleryComponent < ApplicationComponent
# @param size [String] The size of thumbnails in the gallery. Can be "150",
# "180", "225", "225w", "270", "270w", or "360".
# @param options [Hash] A set of options given to the PostPreviewComponent.
def initialize(inline: false, size: PostPreviewComponent::DEFAULT_SIZE, **options)
def initialize(inline: false, size: DEFAULT_SIZE, **options)
super
@inline = inline
@options = options
@@ -28,7 +32,7 @@ class PostGalleryComponent < ApplicationComponent
if size.to_s.in?(PostPreviewComponent::SIZES)
@size = size
else
@size = PostPreviewComponent::DEFAULT_SIZE
@size = DEFAULT_SIZE
end
end

2
app/components/post_gallery_component/post_gallery_component.scss
View File

@@ -43,7 +43,7 @@
gap: 0.25rem;
}
&.post-gallery-150 .posts-container { grid-template-columns: repeat(2, auto); }
&.post-gallery-150 .posts-container { grid-template-columns: repeat(3, minmax(0, 150px)); }
&.post-gallery-180 .posts-container { grid-template-columns: repeat(2, auto); }
&.post-gallery-225 .posts-container { grid-template-columns: repeat(2, auto); }
&.post-gallery-225w .posts-container { grid-template-columns: repeat(2, auto); }

4
app/components/post_preview_component.rb
View File

@@ -1,7 +1,9 @@
# frozen_string_literal: true
class PostPreviewComponent < ApplicationComponent
DEFAULT_SIZE = "150"
# The default size of standalone thumbnails not in a gallery. See also
# PostGalleryComponent::DEFAULT_SIZE for the default size of thumbnails in a gallery.
DEFAULT_SIZE = "180"
SIZES = %w[150 180 225 225w 270 270w 360]

4
app/controllers/posts_controller.rb
View File

@@ -18,7 +18,7 @@ class PostsController < ApplicationController
tag_query = params[:tags] || params.dig(:post, :tags)
@show_votes = (params[:show_votes].presence || cookies[:post_preview_show_votes].presence || "false").truthy?
@post_set = PostSets::Post.new(tag_query, params[:page], params[:limit], format: request.format.symbol, show_votes: @show_votes)
@preview_size = params[:size].presence || cookies[:post_preview_size].presence || PostPreviewComponent::DEFAULT_SIZE
@preview_size = params[:size].presence || cookies[:post_preview_size].presence || PostGalleryComponent::DEFAULT_SIZE
@posts = authorize @post_set.posts, policy_class: PostPolicy
@post_set.log!
respond_with(@posts) do |format|
@@ -60,7 +60,7 @@ class PostsController < ApplicationController
@post = authorize Post.find(params[:id])
@post.update(permitted_attributes(@post))
@show_votes = (params[:show_votes].presence || cookies[:post_preview_show_votes].presence || "false").truthy?
@preview_size = params[:size].presence || cookies[:post_preview_size].presence || PostPreviewComponent::DEFAULT_SIZE
@preview_size = params[:size].presence || cookies[:post_preview_size].presence || PostGalleryComponent::DEFAULT_SIZE
respond_with_post_after_update(@post)
end

2
app/views/posts/partials/show/_child_notice.html.erb
View File

@@ -4,5 +4,5 @@ This post has <%= link_to pluralize(children.length, "child"), posts_path(tags:
<%= link_to("« hide", "#", id: "has-children-relationship-preview-link") %>
<div id="has-children-relationship-preview">
<%= render_post_gallery([parent, *children], tags: "parent:#{parent.id}", show_deleted: true, inline: true) %>
<%= render_post_gallery([parent, *children], tags: "parent:#{parent.id}", show_deleted: true, inline: true, size: "150") %>
</div>

2
app/views/posts/partials/show/_parent_notice.html.erb
View File

@@ -10,5 +10,5 @@ This post belongs to a <%= link_to "parent", posts_path(tags: "parent:#{parent.i
<%= link_to "« hide", "#", id: "has-parent-relationship-preview-link" %>
<div id="has-parent-relationship-preview">
<%= render_post_gallery([parent, *children], tags: "parent:#{parent.id}", show_deleted: true, inline: true) %>
<%= render_post_gallery([parent, *children], tags: "parent:#{parent.id}", show_deleted: true, inline: true, size: "150") %>
</div>

16
test/components/post_preview_component_test.rb
View File

@@ -14,7 +14,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: User.anonymous)
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
end
end
@@ -24,7 +24,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: User.anonymous)
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
assert_equal("0:01", node.css("article .post-duration").text.strip)
end
end
@@ -35,7 +35,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: User.anonymous)
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
assert(node.css("article .sound-icon").present?)
end
end
@@ -50,7 +50,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: create(:gold_user))
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
end
should "not be visible to Members" do
@@ -68,7 +68,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: create(:gold_user))
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
end
should "not be visible to Members" do
@@ -86,7 +86,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: create(:approver))
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
end
should "not be visible to Gold users" do
@@ -104,7 +104,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: User.anonymous)
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
end
should "not be visible to users with safe mode on" do
@@ -124,7 +124,7 @@ class PostPreviewComponentTest < ViewComponent::TestCase
node = render_preview(@post, current_user: User.anonymous, show_deleted: true)
assert_equal(post_path(@post), node.css("article a").attr("href").value)
assert_equal(@post.preview_file_url, node.css("article img").attr("src").value)
assert_equal(@post.media_asset.variant("180x180").file_url, node.css("article img").attr("src").value)
end
should "not be visible to users normally" do