diff --git a/app/controllers/posts_controller.rb b/app/controllers/posts_controller.rb index cde44f0d8..e7ed29203 100644 --- a/app/controllers/posts_controller.rb +++ b/app/controllers/posts_controller.rb @@ -15,6 +15,7 @@ class PostsController < ApplicationController else tag_query = params[:tags] || params.dig(:post, :tags) @post_set = PostSets::Post.new(tag_query, params[:page], params[:limit], format: request.format.symbol, view: params[:view]) + @preview_size = params[:size].presence || cookies[:post_preview_size].presence || PostPreviewComponent::DEFAULT_SIZE @posts = authorize @post_set.posts, policy_class: PostPolicy @post_set.log! respond_with(@posts) do |format| @@ -55,6 +56,7 @@ class PostsController < ApplicationController def update @post = authorize Post.find(params[:id]) @post.update(permitted_attributes(@post)) + @preview_size = params[:size].presence || cookies[:post_preview_size].presence || PostPreviewComponent::DEFAULT_SIZE respond_with_post_after_update(@post) end diff --git a/app/javascript/src/javascripts/posts.js b/app/javascript/src/javascripts/posts.js index 5eafeb1a4..e95004eb8 100644 --- a/app/javascript/src/javascripts/posts.js +++ b/app/javascript/src/javascripts/posts.js @@ -25,6 +25,7 @@ Post.initialize_all = function() { if ($("#c-posts").length && $("#a-index").length) { this.initialize_excerpt(); this.initialize_gestures(); + this.initialize_post_preview_size_menu(); } if ($("#c-posts").length && $("#a-show").length) { @@ -241,6 +242,19 @@ Post.toggle_relationship_preview = function(preview, preview_link) { } } +Post.initialize_post_preview_size_menu = function() { + $(document).on("click.danbooru", ".post-preview-size-menu .popup-menu-content a", (e) => { + let url = new URL($(e.target).get(0).href); + let size = url.searchParams.get("size"); + + Cookie.put("post_preview_size", size); + url.searchParams.delete("size"); + location.replace(url); + + e.preventDefault(); + }); +} + Post.view_original = function(e = null) { if (Utility.test_max_width(660)) { // Do the default behavior (navigate to image) diff --git a/app/views/posts/index.html.erb b/app/views/posts/index.html.erb index 5cd071257..013a54cda 100644 --- a/app/views/posts/index.html.erb +++ b/app/views/posts/index.html.erb @@ -75,13 +75,13 @@ Search » - <%= render PopupMenuComponent.new(classes: "hidden") do |menu| %> + <%= render PopupMenuComponent.new(classes: "hidden post-preview-size-menu") do |menu| %> <% menu.button do %> Size <%= caret_down_icon %> <% end %> <% menu.item do %> - <% if params.fetch(:size, PostPreviewComponent::DEFAULT_SIZE) == "150" %> + <% if @preview_size == "150" %> <%= link_to "Small", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "150"), class: "font-bold", rel: "nofollow" %> <% else %> <%= link_to "Small", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "150"), rel: "nofollow" %> @@ -89,7 +89,7 @@ <% end %> <% menu.item do %> - <% if params.fetch(:size, PostPreviewComponent::DEFAULT_SIZE) == "180" %> + <% if @preview_size == "180" %> <%= link_to "Medium", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "180"), class: "font-bold", rel: "nofollow" %> <% else %> <%= link_to "Medium", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "180"), rel: "nofollow" %> @@ -97,7 +97,7 @@ <% end %> <% menu.item do %> - <% if params.fetch(:size, PostPreviewComponent::DEFAULT_SIZE) == "225" %> + <% if @preview_size == "225" %> <%= link_to "Large", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "225"), class: "font-bold", rel: "nofollow" %> <% else %> <%= link_to "Large", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "225"), rel: "nofollow" %> @@ -106,7 +106,7 @@ <%# Mobile only %> <% menu.item do %> - <% if params.fetch(:size, PostPreviewComponent::DEFAULT_SIZE) == "360" %> + <% if @preview_size == "360" %> <%= link_to "Huge", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "360"), class: "mobile-only font-bold", rel: "nofollow" %> <% else %> <%= link_to "Huge", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "360"), class: "mobile-only", rel: "nofollow" %> @@ -115,7 +115,7 @@ <%# Desktop only %> <% menu.item do %> - <% if params.fetch(:size, PostPreviewComponent::DEFAULT_SIZE) == "270" %> + <% if @preview_size == "270" %> <%= link_to "Huge", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "270"), class: "desktop-only font-bold", rel: "nofollow" %> <% else %> <%= link_to "Huge", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "270"), class: "desktop-only", rel: "nofollow" %> @@ -124,7 +124,7 @@ <%# Desktop only %> <% menu.item do %> - <% if params.fetch(:size, PostPreviewComponent::DEFAULT_SIZE) == "360" %> + <% if @preview_size == "360" %> <%= link_to "Gigantic", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "360"), class: "desktop-only font-bold", rel: "nofollow" %> <% else %> <%= link_to "Gigantic", posts_path(tags: params[:tags], page: params[:page], limit: params[:limit], view: params[:view], size: "360"), class: "desktop-only", rel: "nofollow" %> @@ -226,7 +226,7 @@ <% if @post_set.shown_posts.empty? %> <%= render "post_sets/blank" %> <% else %> - <%= render_post_gallery(@post_set.posts, show_deleted: @post_set.show_deleted?, tags: @post_set.tag_string, show_votes: @post_set.show_votes?, size: params[:size]) do |gallery, posts| %> + <%= render_post_gallery(@post_set.posts, show_deleted: @post_set.show_deleted?, tags: @post_set.tag_string, show_votes: @post_set.show_votes?, size: @preview_size) do |gallery, posts| %> <% gallery.footer do %> <% if @post_set.hidden_posts.present? %>