consul/nairobi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Move image fields partial to a component

Browse Source
This commit is contained in:
Javi Martín
2021-06-20 13:37:25 +02:00
parent a7ed1f9a37
commit d58c2f8323
6 changed files with 94 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
app/components/images/fields_component.html.erb Normal file
View File

@@ -0,0 +1,32 @@
<div id="<%= dom_id(f.object) %>" class="image direct-upload nested-fields">
<%= f.hidden_field :id %>
<%= f.hidden_field :user_id, value: current_user.id %>
<%= f.hidden_field :cached_attachment %>
<div class="small-12 margin-top title">
<%= f.text_field :title, placeholder: t("images.form.title_placeholder") %>
</div>
<%= render_image(f.object, :thumb, false) if f.object.attachment.exists? %>
<div class="small-12 column attachment-actions">
<div class="small-9 column action-add attachment-errors image-attachment">
<%= render_image_attachment(f.object) %>
</div>
<div class="small-3 column action-remove text-right">
<%= render_destroy_image_link(f.object) %>
</div>
</div>
<div class="small-6 column">
<p class="file-name">
<%= image_attachment_file_name(f.object) %>
</p>
</div>
<div class="small-12 column">
<div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
</div>
<hr>
</div>

60
app/components/images/fields_component.rb Normal file
View File

@@ -0,0 +1,60 @@
class Images::FieldsComponent < ApplicationComponent
attr_reader :f, :imageable
delegate :current_user, :render_image, to: :helpers
def initialize(f, imageable:)
@f = f
@imageable = imageable
end
private
def image_attachment_file_name(image)
image.attachment_file_name
end
def render_destroy_image_link(image)
if !image.persisted? && image.cached_attachment.present?
link_to t("images.form.delete_button"),
direct_upload_destroy_path(
"direct_upload[resource_type]": image.imageable_type,
"direct_upload[resource_id]": image.imageable_id,
"direct_upload[resource_relation]": "image",
"direct_upload[cached_attachment]": image.cached_attachment
),
method: :delete,
remote: true,
class: "delete remove-cached-attachment"
else
link_to_remove_association t("images.form.delete_button"), f, class: "delete remove-image"
end
end
def render_image_attachment(image)
klass = image.persisted? || image.cached_attachment.present? ? " hide" : ""
f.file_field :attachment,
label_options: { class: "button hollow #{klass}" },
accept: imageable_accepted_content_types_extensions,
class: "js-image-attachment",
data: {
url: image_direct_upload_path,
nested_image: true
}
end
def image_direct_upload_path
direct_uploads_path("direct_upload[resource_type]": imageable.class.name,
"direct_upload[resource_id]": imageable.id,
"direct_upload[resource_relation]": "image")
end
def imageable_accepted_content_types_extensions
Setting.accepted_content_types_for("images").map do |content_type|
if content_type == "jpg"
".jpg,.jpeg"
else
".#{content_type}"
end
end.join(",")
end
end

10
app/helpers/imageables_helper.rb
View File

@@ -11,16 +11,6 @@ module ImageablesHelper
Setting["uploads.images.content_types"]&.split(" ") || ["image/jpeg"]
end
def imageable_accepted_content_types_extensions
Setting.accepted_content_types_for("images").map do |content_type|
if content_type == "jpg"
".jpg,.jpeg"
else
".#{content_type}"
end
end.join(",")
end
def imageable_humanized_accepted_content_types
Setting.accepted_content_types_for("images").join(", ")
end

39
app/helpers/images_helper.rb
View File

@@ -9,53 +9,14 @@ module ImagesHelper
end
end
def image_attachment_file_name(image)
image.attachment_file_name
end
def image_class(image)
image.persisted? ? "persisted-image" : "cached-image"
end
def render_destroy_image_link(builder, image)
if !image.persisted? && image.cached_attachment.present?
link_to t("images.form.delete_button"),
direct_upload_destroy_path(
"direct_upload[resource_type]": image.imageable_type,
"direct_upload[resource_id]": image.imageable_id,
"direct_upload[resource_relation]": "image",
"direct_upload[cached_attachment]": image.cached_attachment
),
method: :delete,
remote: true,
class: "delete remove-cached-attachment"
else
link_to_remove_association t("images.form.delete_button"), builder, class: "delete remove-image"
end
end
def render_image_attachment(builder, imageable, image)
klass = image.persisted? || image.cached_attachment.present? ? " hide" : ""
builder.file_field :attachment,
label_options: { class: "button hollow #{klass}" },
accept: imageable_accepted_content_types_extensions,
class: "js-image-attachment",
data: {
url: image_direct_upload_path(imageable),
nested_image: true
}
end
def render_image(image, version, show_caption = true)
version = image.persisted? ? version : :original
render "images/image", image: image,
version: version,
show_caption: show_caption
end
def image_direct_upload_path(imageable)
direct_uploads_path("direct_upload[resource_type]": imageable.class.name,
"direct_upload[resource_id]": imageable.id,
"direct_upload[resource_relation]": "image")
end
end

33
app/views/images/_image_fields.html.erb
View File

@@ -1,32 +1 @@
<div id="<%= dom_id(f.object) %>" class="image direct-upload nested-fields">
<%= f.hidden_field :id %>
<%= f.hidden_field :user_id, value: current_user.id %>
<%= f.hidden_field :cached_attachment %>
<div class="small-12 margin-top title">
<%= f.text_field :title, placeholder: t("images.form.title_placeholder") %>
</div>
<%= render_image(f.object, :thumb, false) if f.object.attachment.exists? %>
<div class="small-12 column attachment-actions">
<div class="small-9 column action-add attachment-errors image-attachment">
<%= render_image_attachment(f, imageable, f.object) %>
</div>
<div class="small-3 column action-remove text-right">
<%= render_destroy_image_link(f, f.object) %>
</div>
</div>
<div class="small-6 column">
<p class="file-name">
<%= image_attachment_file_name(f.object) %>
</p>
</div>
<div class="small-12 column">
<div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
</div>
<hr>
</div>
<%= render Images::FieldsComponent.new(f, imageable: imageable) %>

2
app/views/images/_nested_image.html.erb
View File

@@ -5,7 +5,7 @@
<div id="nested-image">
<%= f.fields_for image_fields do |image_builder| %>
<%= render "images/image_fields", f: image_builder, imageable: imageable %>
<%= render Images::FieldsComponent.new(image_builder, imageable: imageable) %>
<% end %>
</div>