Skip to content

Commit 01dec65

Browse files
jazairijazairi
authored
Merge pull request #249 from MITLibraries/use-127-refactor-search-form
Isolate search forms for visual design changes
2 parents 5d5ce9c + 6b3056b commit 01dec65

File tree

9 files changed

+346
-255
lines changed

9 files changed

+346
-255
lines changed

‎app/assets/stylesheets/partials/_search.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
// ------------------------
44

55
/* basic search bar */
6-
.basic-search {
6+
.search-form {
77
background-color: #989898;
88
margin-bottom: 0rem;
99
padding: 2.4rem 2rem 1.6rem 2rem;
@@ -114,7 +114,7 @@
114114
}
115115
}
116116

117-
.basic-search-submit {
117+
.geo-search-submit {
118118
width: 150px;
119119
margin-top: 0.8rem;
120120
.btn {

‎app/views/basic_search/index.html.erb‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,6 @@
22

33
<main class="space-wrap">
44
<%= render partial: "shared/site_title" %>
5-
<%= render partial: "search/form" %>
5+
<%= render partial: "search/form_geo" if Flipflop.enabled?(:gdt) %>
66
<%= render partial: "static/about" if ENV.fetch('ABOUT_APP', nil) %>
77
</main>

‎app/views/layouts/_site_header.html.erb‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,5 +26,6 @@
2626
<% end %>
2727
</nav>
2828
</header>
29+
<%= render partial: 'search/form' unless Flipflop.enabled?(:gdt) %>
2930
</div>
3031
</div>

‎app/views/search/_form.html.erb‎

Lines changed: 7 additions & 179 deletions
Original file line numberDiff line numberDiff line change
@@ -1,185 +1,13 @@
1-
<%
2-
# Initial form setup is determined by the advanced parameter. Thereafter it is altered by javascript.
3-
advanced_label = "Search by title, author, etc."
4-
search_required = true
5-
if params[:advanced] == "true"
6-
search_required = false
7-
end
8-
9-
geobox_label = "Geospatial bounding box search"
10-
if params[:geobox] == "true"
11-
geobox_required = true
12-
search_required = false
13-
end
14-
15-
geodistance_label = "Geospatial distance search"
16-
if params[:geodistance] == "true"
17-
geodistance_required = true
18-
search_required = false
19-
end
20-
21-
# Placeholder text for the keyword input changes if any of the search panels are open.
22-
keyword_placeholder = search_required ? "Enter your search" : "Keyword anywhere"
23-
%>
24-
25-
<form id="basic-search" class="form-horizontal basic-search" action="<%= results_path %>" method="get" role="search">
1+
<form id="search-form" class="form-horizontal search-form" action="<%= results_path %>" method="get" role="search">
262
<div class="form-group">
273
<input id="basic-search-main" type="search"
28-
class="field field-text basic-search-input <%= "required" if search_required %>" name="q"
29-
title="Keyword anywhere" placeholder="<%= keyword_placeholder %>"
30-
value="<%= params[:q] %>" <%= 'required' if search_required %>
31-
<%= 'aria-describedby=site-desc' if Flipflop.enabled?(:gdt) %>>
32-
33-
<% if Flipflop.enabled?(:gdt) %>
34-
<details id="geobox-search-panel" class="form-panel" <%= "open" if params[:geobox] == "true" %>>
35-
<summary class="btn button-secondary" id="geobox-summary">
36-
<span id="geobox-search-label"><%= geobox_label %></span>
37-
</summary>
38-
<input id="geobox-search-field" class="fieldset-toggle" type="hidden" name="geobox"
39-
value="<%= params[:geobox] %>">
40-
<fieldset>
41-
<legend>Search within a geospatial bounding box</legend>
42-
<p>* All fields in this section are required</p>
43-
<div class="gridband layout-2c">
44-
<div class="field-wrap grid-item">
45-
<label class="geo-label" for="geobox-minLongitude">Minimum longitude</label>
46-
<input type="number" step="0.000001" min="-180.0" max="180.0"
47-
class="field field-text <%= "required" if geobox_required %>"
48-
id="geobox-minLongitude" name="geoboxMinLongitude" value="<%= params[:geoboxMinLongitude] %>"
49-
<%= 'required' if geobox_required %>
50-
aria-describedby="minLong-desc">
51-
<span class="geo-desc" id="minLong-desc">
52-
A decimal between -180.0 and 180.0 (Ex: -73.507239)
53-
<span class="hint">Western Hemisphere is negative</span>
54-
</span>
55-
</div>
56-
<div class="field-wrap grid-item">
57-
<label class="geo-label" for="geobox-minLatitude">Minimum latitude</label>
58-
<input type="number" step="0.000001" min="-90.0" max="90.0"
59-
class="field field-text <%= "required" if geobox_required %>"
60-
id="geobox-minLatitude" name="geoboxMinLatitude" value="<%= params[:geoboxMinLatitude] %>"
61-
<%= 'required' if geobox_required %>
62-
aria-describedby="minLat-desc">
63-
<span class="geo-desc" id="minLat-desc">
64-
A decimal between -90.0 and 90.0 (Ex: 41.239083)
65-
<span class="hint">Southern Hemisphere is negative</span>
66-
</span>
67-
</div>
68-
<div class="field-wrap grid-item">
69-
<label class="geo-label" for="geobox-maxLongitude">Maximum longitude</label>
70-
<input type="number" step="0.000001" min="-180.0" max="180.0"
71-
class="field field-text <%= "required" if geobox_required %>"
72-
id="geobox-maxLongitude" name="geoboxMaxLongitude" value="<%= params[:geoboxMaxLongitude] %>"
73-
<%= 'required' if geobox_required %>
74-
aria-describedby="maxLong-desc">
75-
<span class="geo-desc" id="maxLong-desc">
76-
A decimal between -180.0 and 180.0 (Ex: -69.928713)
77-
<span class="hint">Western Hemisphere is negative</span>
78-
</span>
79-
</div>
80-
<div class="field-wrap grid-item">
81-
<label class="geo-label" for="geobox-maxLatitude">Maximum latitude</label>
82-
<input type="number" step="0.000001" min="-90.0" max="90.0"
83-
class="field field-text <%= "required" if geobox_required %>"
84-
id="geobox-maxLatitude" name="geoboxMaxLatitude" value="<%= params[:geoboxMaxLatitude] %>"
85-
<%= 'required' if geobox_required %>
86-
aria-describedby="maxLat-desc">
87-
<span class="geo-desc" id="maxLat-desc">
88-
A decimal between -90.0 and 90.0 (Ex: 42.886759)
89-
<span class="hint">Southern Hemisphere is negative</span>
90-
</span>
91-
</div>
92-
</div>
93-
</fieldset>
94-
</details>
95-
<details id="geodistance-search-panel" class="form-panel" <%= "open" if params[:geodistance] == "true" %>>
96-
<summary class="btn button-secondary" id="geodistance-summary">
97-
<span id="geodistance-search-label"><%= geodistance_label %></span>
98-
</summary>
99-
<input id="geodistance-search-field" class="fieldset-toggle" type="hidden" name="geodistance"
100-
value="<%= params[:geodistance] %>">
101-
<fieldset>
102-
<legend>Search within a distance of a geographic point</legend>
103-
<p>* All fields in this section are required</p>
104-
<div class="gridband layout-2c">
105-
<div class="field-wrap grid-item">
106-
<label class="geo-label" for="geodistance-latitude">Latitude</label>
107-
<input type="number" step="0.000001" min="-90.0" max="90.0"
108-
class="field field-text <%= "required" if geodistance_required %>"
109-
id="geodistance-latitude" name="geodistanceLatitude"
110-
value="<%= params[:geodistanceLatitude] %>" aria-describedby="lat-desc"
111-
<%= 'required' if geodistance_required %>
112-
aria-describedby="lat-desc">
113-
<span class="geo-desc" id="lat-desc">
114-
A decimal between -90.0 and 90.0 (Ex: 42.279594)
115-
<span class="hint">Southern Hemisphere is negative</span>
116-
</span>
117-
</div>
118-
<div class="field-wrap grid-item">
119-
<label class="geo-label" for="geodistance-longitude">Longitude</label>
120-
<input type="number" step="0.000001" min="-180.0" max="180.0"
121-
class="field field-text <%= "required" if geodistance_required %>"
122-
id="geodistance-longitude" name="geodistanceLongitude"
123-
value="<%= params[:geodistanceLongitude] %>" aria-describedby="long-desc"
124-
<%= 'required' if geodistance_required %>
125-
aria-describedby="long-desc">
126-
<span class="geo-desc" id="long-desc">
127-
A decimal between -180.0 and 180.0 (Ex: -83.732124)
128-
<span class="hint">Western Hemisphere is negative</span>
129-
</span>
130-
</div>
131-
<div class="field-wrap grid-item">
132-
<label class="geo-label" for="geodistance-distance">Distance from the location</label>
133-
<input type="text" class="field field-text <%= "required" if geodistance_required %>"
134-
id="geodistance-distance" name="geodistanceDistance"
135-
value="<%= params[:geodistanceDistance] %>" aria-describedby="distance-desc"
136-
<%= 'required' if geodistance_required %>
137-
aria-describedby="distance-desc">
138-
<span class="geo-desc" id="distance-desc">
139-
Distance is in meters by default; add other units if preferred (Ex: '100km' or '50mi')
140-
</span>
141-
</div>
142-
</div>
143-
</fieldset>
144-
</details>
145-
146-
<details id="advanced-search-panel" class="form-panel" <%= "open" if params[:advanced] == "true" %>>
147-
<summary class="btn button-secondary" id="advanced-summary">
148-
<span id="advanced-search-label"><%= advanced_label %></span>
149-
</summary>
150-
<input id="advanced-search-field" class="fieldset-toggle" type="hidden" name="advanced"
151-
value="<%= params[:advanced] %>">
152-
<div class="field-container">
153-
<div class="field-wrap">
154-
<label for="advanced-title" class="field-label">Title</label>
155-
<input type="text" class="field field-text wide" id="advanced-title" name="title"
156-
value="<%= params[:title] %>">
157-
</div>
4+
class="field field-text basic-search-input" name="q"
5+
title="Keyword anywhere" placeholder="Enter your search"
6+
value="<%= params[:q] %>" required>
1587

159-
<div class="field-wrap">
160-
<label for="advanced-contributors" class="field-label">Authors</label>
161-
<input type="text" class="field field-text wide" id="advanced-contributors" name="contributors"
162-
value="<%= params[:contributors] %>">
163-
</div>
164-
165-
<div class="field-wrap">
166-
<label for="advanced-subjects" class="field-label">Subjects</label>
167-
<input type="text" class="field field-text wide" id="advanced-subjects" name="subjects"
168-
value="<%= params[:subjects] %>">
169-
</div>
170-
171-
<div class="field-wrap">
172-
<label for="advanced-locations" class="field-label">Locations</label>
173-
<input type="text" class="field field-text wide" id="advanced-locations" name="locations"
174-
value="<%= params[:locations] %>">
175-
</div>
176-
</div>
177-
</details>
178-
<% end %>
179-
</div>
180-
181-
<div class="basic-search-submit">
182-
<button type="submit" class="btn button-primary">Search</button>
8+
<div class="basic-search-submit">
9+
<button type="submit" class="btn button-primary">Search</button>
10+
</div>
18311
</div>
18412
</form>
18513

0 commit comments

Comments
 (0)