Skip to content

Isolate search forms for visual design changes #249

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Oct 23, 2025
Merged

Isolate search forms for visual design changes #249

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions app/assets/stylesheets/partials/_search.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
// ------------------------

/* basic search bar */
.basic-search {
.search-form {
background-color: #989898;
margin-bottom: 0rem;
padding: 2.4rem 2rem 1.6rem 2rem;
Expand Down Expand Up @@ -114,7 +114,7 @@
}
}

.basic-search-submit {
.geo-search-submit {
width: 150px;
margin-top: 0.8rem;
.btn {
Expand Down
2 changes: 1 addition & 1 deletion app/views/basic_search/index.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@

<main class="space-wrap">
<%= render partial: "shared/site_title" %>
<%= render partial: "search/form" %>
<%= render partial: "search/form_geo" if Flipflop.enabled?(:gdt) %>
<%= render partial: "static/about" if ENV.fetch('ABOUT_APP', nil) %>
</main>
1 change: 1 addition & 0 deletions app/views/layouts/_site_header.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,5 +29,6 @@
<% end %>
</nav>
</header>
<%= render partial: 'search/form' unless Flipflop.enabled?(:gdt) %>
</div>
</div>
186 changes: 7 additions & 179 deletions app/views/search/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,185 +1,13 @@
<%
# Initial form setup is determined by the advanced parameter. Thereafter it is altered by javascript.
advanced_label = "Search by title, author, etc."
search_required = true
if params[:advanced] == "true"
search_required = false
end

geobox_label = "Geospatial bounding box search"
if params[:geobox] == "true"
geobox_required = true
search_required = false
end

geodistance_label = "Geospatial distance search"
if params[:geodistance] == "true"
geodistance_required = true
search_required = false
end

# Placeholder text for the keyword input changes if any of the search panels are open.
keyword_placeholder = search_required ? "Enter your search" : "Keyword anywhere"
%>

<form id="basic-search" class="form-horizontal basic-search" action="<%= results_path %>" method="get" role="search">
<form id="search-form" class="form-horizontal search-form" action="<%= results_path %>" method="get" role="search">
<div class="form-group">
<input id="basic-search-main" type="search"
class="field field-text basic-search-input <%= "required" if search_required %>" name="q"
title="Keyword anywhere" placeholder="<%= keyword_placeholder %>"
value="<%= params[:q] %>" <%= 'required' if search_required %>
<%= 'aria-describedby=site-desc' if Flipflop.enabled?(:gdt) %>>

<% if Flipflop.enabled?(:gdt) %>
<details id="geobox-search-panel" class="form-panel" <%= "open" if params[:geobox] == "true" %>>
<summary class="btn button-secondary" id="geobox-summary">
<span id="geobox-search-label"><%= geobox_label %></span>
</summary>
<input id="geobox-search-field" class="fieldset-toggle" type="hidden" name="geobox"
value="<%= params[:geobox] %>">
<fieldset>
<legend>Search within a geospatial bounding box</legend>
<p>* All fields in this section are required</p>
<div class="gridband layout-2c">
<div class="field-wrap grid-item">
<label class="geo-label" for="geobox-minLongitude">Minimum longitude</label>
<input type="number" step="0.000001" min="-180.0" max="180.0"
class="field field-text <%= "required" if geobox_required %>"
id="geobox-minLongitude" name="geoboxMinLongitude" value="<%= params[:geoboxMinLongitude] %>"
<%= 'required' if geobox_required %>
aria-describedby="minLong-desc">
<span class="geo-desc" id="minLong-desc">
A decimal between -180.0 and 180.0 (Ex: -73.507239)
<span class="hint">Western Hemisphere is negative</span>
</span>
</div>
<div class="field-wrap grid-item">
<label class="geo-label" for="geobox-minLatitude">Minimum latitude</label>
<input type="number" step="0.000001" min="-90.0" max="90.0"
class="field field-text <%= "required" if geobox_required %>"
id="geobox-minLatitude" name="geoboxMinLatitude" value="<%= params[:geoboxMinLatitude] %>"
<%= 'required' if geobox_required %>
aria-describedby="minLat-desc">
<span class="geo-desc" id="minLat-desc">
A decimal between -90.0 and 90.0 (Ex: 41.239083)
<span class="hint">Southern Hemisphere is negative</span>
</span>
</div>
<div class="field-wrap grid-item">
<label class="geo-label" for="geobox-maxLongitude">Maximum longitude</label>
<input type="number" step="0.000001" min="-180.0" max="180.0"
class="field field-text <%= "required" if geobox_required %>"
id="geobox-maxLongitude" name="geoboxMaxLongitude" value="<%= params[:geoboxMaxLongitude] %>"
<%= 'required' if geobox_required %>
aria-describedby="maxLong-desc">
<span class="geo-desc" id="maxLong-desc">
A decimal between -180.0 and 180.0 (Ex: -69.928713)
<span class="hint">Western Hemisphere is negative</span>
</span>
</div>
<div class="field-wrap grid-item">
<label class="geo-label" for="geobox-maxLatitude">Maximum latitude</label>
<input type="number" step="0.000001" min="-90.0" max="90.0"
class="field field-text <%= "required" if geobox_required %>"
id="geobox-maxLatitude" name="geoboxMaxLatitude" value="<%= params[:geoboxMaxLatitude] %>"
<%= 'required' if geobox_required %>
aria-describedby="maxLat-desc">
<span class="geo-desc" id="maxLat-desc">
A decimal between -90.0 and 90.0 (Ex: 42.886759)
<span class="hint">Southern Hemisphere is negative</span>
</span>
</div>
</div>
</fieldset>
</details>
<details id="geodistance-search-panel" class="form-panel" <%= "open" if params[:geodistance] == "true" %>>
<summary class="btn button-secondary" id="geodistance-summary">
<span id="geodistance-search-label"><%= geodistance_label %></span>
</summary>
<input id="geodistance-search-field" class="fieldset-toggle" type="hidden" name="geodistance"
value="<%= params[:geodistance] %>">
<fieldset>
<legend>Search within a distance of a geographic point</legend>
<p>* All fields in this section are required</p>
<div class="gridband layout-2c">
<div class="field-wrap grid-item">
<label class="geo-label" for="geodistance-latitude">Latitude</label>
<input type="number" step="0.000001" min="-90.0" max="90.0"
class="field field-text <%= "required" if geodistance_required %>"
id="geodistance-latitude" name="geodistanceLatitude"
value="<%= params[:geodistanceLatitude] %>" aria-describedby="lat-desc"
<%= 'required' if geodistance_required %>
aria-describedby="lat-desc">
<span class="geo-desc" id="lat-desc">
A decimal between -90.0 and 90.0 (Ex: 42.279594)
<span class="hint">Southern Hemisphere is negative</span>
</span>
</div>
<div class="field-wrap grid-item">
<label class="geo-label" for="geodistance-longitude">Longitude</label>
<input type="number" step="0.000001" min="-180.0" max="180.0"
class="field field-text <%= "required" if geodistance_required %>"
id="geodistance-longitude" name="geodistanceLongitude"
value="<%= params[:geodistanceLongitude] %>" aria-describedby="long-desc"
<%= 'required' if geodistance_required %>
aria-describedby="long-desc">
<span class="geo-desc" id="long-desc">
A decimal between -180.0 and 180.0 (Ex: -83.732124)
<span class="hint">Western Hemisphere is negative</span>
</span>
</div>
<div class="field-wrap grid-item">
<label class="geo-label" for="geodistance-distance">Distance from the location</label>
<input type="text" class="field field-text <%= "required" if geodistance_required %>"
id="geodistance-distance" name="geodistanceDistance"
value="<%= params[:geodistanceDistance] %>" aria-describedby="distance-desc"
<%= 'required' if geodistance_required %>
aria-describedby="distance-desc">
<span class="geo-desc" id="distance-desc">
Distance is in meters by default; add other units if preferred (Ex: '100km' or '50mi')
</span>
</div>
</div>
</fieldset>
</details>

<details id="advanced-search-panel" class="form-panel" <%= "open" if params[:advanced] == "true" %>>
<summary class="btn button-secondary" id="advanced-summary">
<span id="advanced-search-label"><%= advanced_label %></span>
</summary>
<input id="advanced-search-field" class="fieldset-toggle" type="hidden" name="advanced"
value="<%= params[:advanced] %>">
<div class="field-container">
<div class="field-wrap">
<label for="advanced-title" class="field-label">Title</label>
<input type="text" class="field field-text wide" id="advanced-title" name="title"
value="<%= params[:title] %>">
</div>
class="field field-text basic-search-input" name="q"
title="Keyword anywhere" placeholder="Enter your search"
value="<%= params[:q] %>" required>

<div class="field-wrap">
<label for="advanced-contributors" class="field-label">Authors</label>
<input type="text" class="field field-text wide" id="advanced-contributors" name="contributors"
value="<%= params[:contributors] %>">
</div>

<div class="field-wrap">
<label for="advanced-subjects" class="field-label">Subjects</label>
<input type="text" class="field field-text wide" id="advanced-subjects" name="subjects"
value="<%= params[:subjects] %>">
</div>

<div class="field-wrap">
<label for="advanced-locations" class="field-label">Locations</label>
<input type="text" class="field field-text wide" id="advanced-locations" name="locations"
value="<%= params[:locations] %>">
</div>
</div>
</details>
<% end %>
</div>

<div class="basic-search-submit">
<button type="submit" class="btn button-primary">Search</button>
<div class="basic-search-submit">
<button type="submit" class="btn button-primary">Search</button>
</div>
</div>
</form>

Expand Down
Loading