Skip to content

Commit

Permalink
Add toggle button for file types on the sidebar (#739)
Browse files Browse the repository at this point in the history 
* Index the version field

* Fetched version number and display in schema tags

* show more toggle

* to do comment

* added test for the file type sidebar

* edited comment

* rubocop corrections

* eslint correction

* Adjusted the fixtures to have more than 10 file types

Co-authored-by: Claudia Lee <claudiawulee@users.noreply.github.com>

* Updated test for 10 file types

---------

Co-authored-by: Hector Correa <hector_correa@princeton.edu>
Co-authored-by: Claudia Lee <claudiawulee@users.noreply.github.com>
  • Loading branch information
@claudiawulee @hectorcorrea
3 people authored Jan 7, 2025
1 parent af0edb1 commit 3c2fb08
Show file tree
Hide file tree
Showing 4 changed files with 76 additions and 12 deletions.
4 changes: 4 additions & 0 deletions app/assets/stylesheets/components/show.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,3 +57,7 @@
}
}
}

#document-file-type-list-extra {
margin-top: -25px;
}
39 changes: 38 additions & 1 deletion app/views/catalog/_show_sidebar.html.erb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,48 @@
<div id="sidebar-keywords" class="sidebar">
<%= render_sidebar_licenses @document.license %>
<%= render_sidebar_subject_search_links "Keywords", @document.subject, "subject_all_ssim" %>

<% file_counts = @document.file_counts.map { |group| "#{group[:extension]}(#{group[:file_count]})" } %>
<%= render_sidebar_values "File Types: ", file_counts, ", " %>
<%if file_counts.count <= 10 %>
<%= render_sidebar_values "File Types: ", file_counts, ", " %>
<% else %>
<div id="document-file-type-list">
<%= render_sidebar_values "File Types: ", file_counts.first(10), ", " %>
</div>
<div id="document-file-type-list-extra" class="hidden-element">
<%= render_sidebar_values "", file_counts.drop(10), ", " %>
</div>
<a id="document-file-type-list-toggle" href="#">
<i class="bi bi-caret-down"></i><span>Show More</span>
</a>
<%end%>
<br>
<%= render_sidebar_doi_row @document.doi_url, @document.doi_value %>
<%= render_sidebar_related_identifiers "Related Identifiers", @document.related_identifiers %>
<% if @document.pdc_describe_record? %>
<%= render_sidebar_value("Total Size", number_to_human_size(@document.total_file_size))%>
<% end %>
</div>


<script>
var setupMoreLessToggle = function(linkId, extraId) {
$(linkId).click(function() {
if ($(linkId).text().includes("Show Less")) {
$(extraId).addClass("hidden-element");
$(linkId + " i").toggleClass("bi-caret-up bi-caret-down");
$(linkId + " span").text("Show More");
} else {
$(extraId).removeClass("hidden-element");
$(linkId + " i").toggleClass("bi-caret-up bi-caret-down");
$(linkId + " span").text("Show Less");
}
return false;
});
};

setupMoreLessToggle("#document-file-type-list-toggle", "#document-file-type-list-extra");

</script>


22 changes: 11 additions & 11 deletions spec/fixtures/files/pdc_describe_data/89.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -232,61 +232,61 @@
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig16a.hdf"
},
{
"filename": "10.34770/bm4s-t361/89/Fig16b.hdf",
"filename": "10.34770/bm4s-t361/89/Fig16b.ccc",
"size": 17264,
"display_size": "16.9 KB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig16b.hdf"
},
{
"filename": "10.34770/bm4s-t361/89/Fig1a.png",
"filename": "10.34770/bm4s-t361/89/Fig1a.bbb",
"size": 72628,
"display_size": "70.9 KB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig1a.png"
},
{
"filename": "10.34770/bm4s-t361/89/Fig1b.png",
"filename": "10.34770/bm4s-t361/89/Fig1b.aaa",
"size": 301258,
"display_size": "294 KB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig1b.png"
},
{
"filename": "10.34770/bm4s-t361/89/Fig2.png",
"filename": "10.34770/bm4s-t361/89/Fig2.pdf",
"size": 225329,
"display_size": "220 KB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig2.png"
},
{
"filename": "10.34770/bm4s-t361/89/Fig3a.png",
"filename": "10.34770/bm4s-t361/89/Fig3a.py",
"size": 669489,
"display_size": "654 KB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig3a.png"
},
{
"filename": "10.34770/bm4s-t361/89/Fig3b.png",
"filename": "10.34770/bm4s-t361/89/Fig3b.rb",
"size": 1524537,
"display_size": "1.45 MB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig3b.png"
},
{
"filename": "10.34770/bm4s-t361/89/Fig4.hdf",
"filename": "10.34770/bm4s-t361/89/Fig4.xls",
"size": 11307376,
"display_size": "10.8 MB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig4.hdf"
},
{
"filename": "10.34770/bm4s-t361/89/Fig5_7_8a.hdf",
"filename": "10.34770/bm4s-t361/89/Fig5_7_8a.doc",
"size": 40511960,
"display_size": "38.6 MB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig5_7_8a.hdf"
},
{
"filename": "10.34770/bm4s-t361/89/Fig6.hdf",
"filename": "10.34770/bm4s-t361/89/Fig6.tiff",
"size": 151856,
"display_size": "148 KB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig6.hdf"
},
{
"filename": "10.34770/bm4s-t361/89/Fig8b.hdf",
"filename": "10.34770/bm4s-t361/89/Fig8b.jpg",
"size": 32944056,
"display_size": "31.4 MB",
"url": "https://g-ef94ef.f0ad1.36fe.data.globus.org/10.34770/bm4s-t361/89/Fig8b.hdf"
Expand Down Expand Up @@ -320,4 +320,4 @@
"embargo_date": null,
"created_at": "2023-08-18T13:47:14Z",
"updated_at": "2024-02-23T11:05:11Z"
}
}
23 changes: 23 additions & 0 deletions spec/system/show_pdc_describe_record_spec.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,29 @@
third_filename_spot = find(:xpath, "//table[@id='files-table']/tbody/tr[3]/td[1]").text
expect(third_filename_spot).to eq("Fig10a.hdf")
end

it 'shows file types when there is more than 10 in sidebar' do
visit '/catalog/doi-10-34770-bm4s-t361'
# initially only first ten file types are shown
expect(page).to have_content("Show More")
expect(page).to have_selector('#document-file-type-list-toggle', visible: true)
inital_file_types = find(:xpath, "//*[@id='document-file-type-list']/div/span[2]").text
expect(inital_file_types).to eq("hdf(12), ccc(1), bbb(1), aaa(1), pdf(1), py(1), rb(1), xls(1), doc(1), tiff(1)")
expect(page).to have_selector('#document-file-type-list-extra', visible: false)
# clicks the Show More button to show the rest of the file types
find(:xpath, "//*[@id='document-file-type-list-toggle']/span").click
expect(page).to have_content("Show Less")
expect(inital_file_types).to eq("hdf(12), ccc(1), bbb(1), aaa(1), pdf(1), py(1), rb(1), xls(1), doc(1), tiff(1)")
rest_of_file_types = find(:xpath, "//*[@id='document-file-type-list-extra']/div/span[2]").text
expect(rest_of_file_types).to eq("jpg(1), txt(1)")
expect(page).to have_selector('#document-file-type-list-extra', visible: true)
# Clicks the Show Less button to hide the rest of the file types
find(:xpath, "//*[@id='document-file-type-list-toggle']/span").click
expect(page).to have_content("Show More")
expect(inital_file_types).to eq("hdf(12), ccc(1), bbb(1), aaa(1), pdf(1), py(1), rb(1), xls(1), doc(1), tiff(1)")
expect(page).to have_selector('#document-file-type-list-extra', visible: false)
end

it 'correctly sorts by file size' do
visit '/catalog/doi-10-34770-bm4s-t361'
sleep(0.1) # wait for the files to load via AJAX
Expand Down

0 comments on commit 3c2fb08

Please sign in to comment.