Skip to content

Commit 77cd42f

Browse files
tvdeyentvdeyen
committed
Show usage info on attachment info
As with the picture we want to show the pages and elements a file is used on.
1 parent 3246400 commit 77cd42f

File tree

7 files changed

+113
-82
lines changed

7 files changed

+113
-82
lines changed

‎app/assets/builds/alchemy/admin.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎app/controllers/alchemy/admin/attachments_controller.rb

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ def index
3939

4040
# The resources controller renders the edit form as default for show actions.
4141
def show
42+
@assignments = @attachment.related_ingredients.joins(element: :page)
4243
render :show
4344
end
4445

‎app/helpers/alchemy/admin/attachments_helper.rb

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,12 @@ def mime_to_human(mime)
1212

1313
def attachment_preview_size(attachment)
1414
case attachment.file_mime_type
15-
when *IMAGE_FILE_TYPES then "600x475"
16-
when *AUDIO_FILE_TYPES then "600x190"
17-
when *VIDEO_FILE_TYPES then "600x485"
18-
when "application/pdf" then "600x600"
15+
when "application/pdf" then "850x600"
16+
when *IMAGE_FILE_TYPES then "850x280"
17+
when *AUDIO_FILE_TYPES then "850x190"
18+
when *VIDEO_FILE_TYPES then "900x280"
1919
else
20-
"600x145"
20+
"500x165"
2121
end
2222
end
2323
end

‎app/stylesheets/alchemy/admin/attachments.scss

Lines changed: 10 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,17 @@
11
.attachment_preview_container {
2-
background-color: var(--color-grey_light);
3-
margin-top: var(--spacing-3);
2+
display: flex;
3+
justify-content: center;
4+
align-content: center;
5+
height: 100%;
6+
background-color: var(--panel-background-color);
7+
margin-top: va r(--spacing-1);
48

9+
img,
510
audio,
611
video {
712
display: block;
13+
width: 100%;
14+
height: auto;
15+
max-width: 100%;
816
}
9-
10-
&.image-preview {
11-
height: 300px;
12-
text-align: center;
13-
padding: var(--spacing-2);
14-
white-space: nowrap;
15-
16-
&:before {
17-
content: "";
18-
display: inline-block;
19-
height: 100%;
20-
vertical-align: middle;
21-
margin-right: -0.25em;
22-
}
23-
24-
img.full_width {
25-
display: inline-block;
26-
width: auto;
27-
height: auto;
28-
max-width: 100%;
29-
max-height: 100%;
30-
vertical-align: middle;
31-
}
32-
}
33-
}
34-
35-
.full-iframe {
36-
width: 100%;
37-
background-color: white;
38-
min-height: 435px;
39-
margin-top: var(--spacing-3);
4017
}

‎app/views/alchemy/admin/attachments/show.html.erb

Lines changed: 55 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,45 +1,57 @@
1-
<div class="resource_info">
2-
<div class="value">
3-
<label>
4-
<%= render_icon @attachment.icon_css_class %>
5-
</label>
6-
<p><%= @attachment.file_name %></p>
7-
</div>
8-
<div class="value with-icon">
9-
<label><%= Alchemy::Attachment.human_attribute_name(:url) %></label>
10-
<p><%= @attachment.url %></p>
11-
<alchemy-clipboard-button
12-
content="<%= @attachment.url %>"
13-
success-text="<%= Alchemy.t("Copied to clipboard") %>"
14-
class="icon_button--right"
15-
></alchemy-clipboard-button>
16-
</div>
17-
<div class="value with-icon">
18-
<label><%= Alchemy::Attachment.human_attribute_name(:download_url) %></label>
19-
<p><%= @attachment.url(download: true) %></p>
20-
<alchemy-clipboard-button
21-
content="<%= @attachment.url(download: true) %>"
22-
success-text="<%= Alchemy.t("Copied to clipboard") %>"
23-
class="icon_button--right"
24-
></alchemy-clipboard-button>
25-
</div>
26-
</div>
1+
<div class="resource-details">
2+
<aside>
3+
<div class="resource_info">
4+
<div class="value">
5+
<label>
6+
<%= render_icon @attachment.icon_css_class %>
7+
</label>
8+
<p><%= @attachment.file_name %></p>
9+
</div>
10+
<div class="value with-icon">
11+
<label><%= Alchemy::Attachment.human_attribute_name(:url) %></label>
12+
<p><%= @attachment.url %></p>
13+
<alchemy-clipboard-button
14+
content="<%= @attachment.url %>"
15+
success-text="<%= Alchemy.t("Copied to clipboard") %>"
16+
class="icon_button--right"
17+
></alchemy-clipboard-button>
18+
</div>
19+
<div class="value with-icon">
20+
<label><%= Alchemy::Attachment.human_attribute_name(:download_url) %></label>
21+
<p><%= @attachment.url(download: true) %></p>
22+
<alchemy-clipboard-button
23+
content="<%= @attachment.url(download: true) %>"
24+
success-text="<%= Alchemy.t("Copied to clipboard") %>"
25+
class="icon_button--right"
26+
></alchemy-clipboard-button>
27+
</div>
28+
</div>
2729

28-
<% case @attachment.file_mime_type %>
29-
<% when *Alchemy::Filetypes::IMAGE_FILE_TYPES %>
30-
<div class="attachment_preview_container image-preview">
31-
<%= image_tag(@attachment.url, class: "full_width") %>
32-
</div>
33-
<% when *Alchemy::Filetypes::AUDIO_FILE_TYPES %>
34-
<div class="attachment_preview_container player-preview">
35-
<%= audio_tag(@attachment.url, preload: "none", controls: true, class: "full_width") %>
36-
</div>
37-
<% when *Alchemy::Filetypes::VIDEO_FILE_TYPES %>
38-
<div class="attachment_preview_container player-preview">
39-
<%= video_tag(@attachment.url, preload: "metadata", controls: true, class: "full_width") %>
30+
<hr>
31+
32+
<%= render "alchemy/admin/resources/resource_usage_info",
33+
assignments: @assignments,
34+
resource_name: :attachment %>
35+
</aside>
36+
37+
<%# We need to use the `tag` helper for the div to be really empty for
38+
the CSS `:empty` selector to work in order to hide this div if there is no preview %>
39+
<%= tag.div(class: "resource-preview") do %>
40+
<% case @attachment.file_mime_type %>
41+
<% when *Alchemy::Filetypes::IMAGE_FILE_TYPES %>
42+
<div class="attachment_preview_container">
43+
<%= image_tag(@attachment.url) %>
44+
</div>
45+
<% when *Alchemy::Filetypes::AUDIO_FILE_TYPES %>
46+
<div class="attachment_preview_container">
47+
<%= audio_tag(@attachment.url, preload: "metadata", controls: true) %>
48+
</div>
49+
<% when *Alchemy::Filetypes::VIDEO_FILE_TYPES %>
50+
<div class="attachment_preview_container">
51+
<%= video_tag(@attachment.url, preload: "metadata", controls: true) %>
52+
</div>
53+
<% when "application/pdf" %>
54+
<iframe src="<%= @attachment.url %>" frameborder="0"></iframe>
55+
<% end %>
56+
<% end %>
4057
</div>
41-
<% when "application/pdf" %>
42-
<iframe src="<%= @attachment.url %>" frameborder=0 class="full-iframe">
43-
Your browser does not support frames.
44-
</iframe>
45-
<% end %>

‎spec/helpers/alchemy/admin/attachments_helper_spec.rb

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,4 +14,44 @@
1414
expect(helper.mime_to_human("text/plain")).to eq("Plain Text Document")
1515
end
1616
end
17+
18+
describe "#attachment_preview_size" do
19+
subject { helper.attachment_preview_size(attachment) }
20+
21+
let(:attachment) { instance_double("Alchemy::Attachment") }
22+
23+
before do
24+
allow(attachment).to receive(:file_mime_type) { mime_type }
25+
end
26+
27+
context "for an audio attachment" do
28+
let(:mime_type) { "audio/mpeg" }
29+
30+
it { is_expected.to eq("850x190") }
31+
end
32+
33+
context "for an image attachment" do
34+
let(:mime_type) { "image/png" }
35+
36+
it { is_expected.to eq("850x280") }
37+
end
38+
39+
context "for an pdf attachment" do
40+
let(:mime_type) { "application/pdf" }
41+
42+
it { is_expected.to eq("850x600") }
43+
end
44+
45+
context "for an video attachment" do
46+
let(:mime_type) { "video/mp4" }
47+
48+
it { is_expected.to eq("900x280") }
49+
end
50+
51+
context "for any other file" do
52+
let(:mime_type) { "foo/bar" }
53+
54+
it { is_expected.to eq("500x165") }
55+
end
56+
end
1757
end

‎spec/views/admin/attachments/show_spec.rb

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99

1010
it "displays urls to file" do
1111
assign(:attachment, attachment)
12+
assign(:assignments, attachment.related_ingredients.joins(element: :page))
1213
render
1314
aggregate_failures do
1415
expect(rendered).to have_selector("label:contains('URL') + p:contains('/attachment/#{attachment.id}/show')")

0 commit comments

Comments
 (0)