-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Why these changes are being introduced: The GeoData app needs to allow for geospatial searching. Relevant ticket(s): * [GDT-136](https://mitlibraries.atlassian.net/browse/GDT-136) How this addresses that need: This adds form elements for the geospatial fields we’ve added to TIMDEX: geobox and geodistance. Because these fields are relatively complex and all their arguments are non-nullable, each of them has its own drop-down that toggles a boolean param (`:geobox` and `:geodistance`, respectively) to pass the field’s arguments into the TIMDEX query. Certain client-side form validations have been added (e.g., range for lat/long entries), as well as corresponding controller validations in case a user bypasses the form. In order to achieve the multiple query permutations (no geo fields, both geo fields, one of either geo field), additional query objects have been added. This is based on the recommendation of the graphql-client gem, which suggests using statically declared heredocs as inputs. However, that gem also recommends making queries out of several smaller heredocs, using GraphQL conveniences like fragments, so our implementation may not be exactly what the gem maintainers intended. Side effects of this change: * Introducing an additional monolithic query object for each permutation doesn’t feel scalable or OO. We likely don’t have to time to investigate this now, but it would be interesting to consider alternative methods to constructing queries, and possibly also different GraphQL client gems. * The controller validations are an important failsafe, but they are not especially friendly. We may want to consider additional client-side validations to reduce the likelihood of encountering the controller validations in the wild. * Writing this feature revealed that the Enhancer and Query Builder models are functionally identical. This was intentional to prepare the app for additional query enhancements. As we’ve now abstracted that to TACOS, we should consider at some point whether we still need both of these models. * The form partial and corresponding JS are getting unwieldy. Refactoring these would be a good maintenance activity. Further, the interactive elements are becoming complex enough that E2E testing is worth considering. * The labels for the new form elements are grotesquely long, but they also need to convey a lot of information. I’m hoping that UXWS can help with this. * There are a lot of geo tests, so rather than switching the test strategy in each test, I isolated them to their own class to set the test strategy in a minitest lifecycle hook. * Most cassettes have been regenerated due to schema updates. Isolate test strategy to geo tests
- Loading branch information
Showing
43 changed files
with
2,397 additions
and
283 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,4 @@ | ||
TIMDEX_HOST=FAKE_TIMDEX_HOST | ||
TIMDEX_GRAPHQL=https://FAKE_TIMDEX_HOST/graphql | ||
TIMDEX_INDEX=FAKE_TIMDEX_INDEX | ||
GDT=false |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,36 +1,139 @@ | ||
function disableAdvanced() { | ||
advanced_field.setAttribute('value', ''); | ||
keyword_field.setAttribute('aria-required', true); | ||
if (geobox_label.classList.contains('closed') && geodistance_label.classList.contains('closed')) { | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
keyword_field.setAttribute('aria-required', true); | ||
keyword_field.setAttribute('placeholder', 'Enter your search'); | ||
} | ||
[...details_panel.getElementsByClassName('field')].forEach( | ||
field => field.value = '' | ||
); | ||
keyword_field.setAttribute('placeholder', 'Enter your search'); | ||
advanced_label.classList = 'closed'; | ||
advanced_label.innerText = 'Advanced search'; | ||
}; | ||
|
||
function enableAdvanced() { | ||
advanced_field.setAttribute('value', 'true'); | ||
keyword_field.setAttribute('aria-required', false); | ||
keyword_field.setAttribute('placeholder', 'Keyword anywhere'); | ||
if (geobox_label.classList.contains('closed') && geodistance_label.classList.contains('closed')) { | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
keyword_field.setAttribute('aria-required', false); | ||
keyword_field.setAttribute('placeholder', 'Keyword anywhere'); | ||
} | ||
advanced_label.classList = 'open'; | ||
advanced_label.innerText = 'Close advanced search'; | ||
}; | ||
|
||
function disableGeobox() { | ||
if (advanced_label.classList.contains('closed') && geodistance_label.classList.contains('closed')) { | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
keyword_field.setAttribute('aria-required', true); | ||
keyword_field.setAttribute('placeholder', 'Enter your search'); | ||
} | ||
geobox_field.setAttribute('value', ''); | ||
[...geobox_details_panel.getElementsByClassName('field')].forEach(function(field) { | ||
field.value = ''; | ||
field.classList.toggle('required'); | ||
field.toggleAttribute('required'); | ||
field.setAttribute('aria-required', false); | ||
}); | ||
geobox_label.classList = 'closed'; | ||
geobox_label.innerText = 'Bounding box search'; | ||
}; | ||
|
||
function enableGeobox() { | ||
if (advanced_label.classList.contains('closed') && geodistance_label.classList.contains('closed')) { | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
keyword_field.setAttribute('aria-required', false); | ||
keyword_field.setAttribute('placeholder', 'Keyword anywhere'); | ||
} | ||
geobox_field.setAttribute('value', 'true'); | ||
[...geobox_details_panel.getElementsByClassName('field')].forEach(function(field) { | ||
field.value = ''; | ||
field.classList.toggle('required'); | ||
field.toggleAttribute('required'); | ||
field.setAttribute('aria-required', true); | ||
}); | ||
geobox_label.classList = 'open'; | ||
geobox_label.innerText = 'Close bounding box search'; | ||
}; | ||
|
||
function disableGeodistance() { | ||
if (advanced_label.classList.contains('closed') && geobox_label.classList.contains('closed')) { | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
keyword_field.setAttribute('aria-required', true); | ||
keyword_field.setAttribute('placeholder', 'Enter your search'); | ||
} | ||
geodistance_field.setAttribute('value', ''); | ||
[...geodistance_details_panel.getElementsByClassName('field')].forEach(function(field) { | ||
field.value = ''; | ||
field.classList.toggle('required'); | ||
field.toggleAttribute('required'); | ||
field.setAttribute('aria-required', false); | ||
}); | ||
geodistance_label.classList = 'closed'; | ||
geodistance_label.innerText = 'Geospatial distance search'; | ||
}; | ||
|
||
function enableGeodistance() { | ||
if (advanced_label.classList.contains('closed') && geobox_label.classList.contains('closed')) { | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
keyword_field.setAttribute('aria-required', false); | ||
keyword_field.setAttribute('placeholder', 'Keyword anywhere'); | ||
} | ||
geodistance_field.setAttribute('value', 'true'); | ||
[...geodistance_details_panel.getElementsByClassName('field')].forEach(function(field) { | ||
field.value = ''; | ||
field.classList.toggle('required'); | ||
field.toggleAttribute('required'); | ||
field.setAttribute('aria-required', true); | ||
}); | ||
geodistance_label.classList = 'open'; | ||
geodistance_label.innerText = 'Close geospatial distance search'; | ||
}; | ||
|
||
|
||
var advanced_field = document.getElementById('advanced-search-field'); | ||
var advanced_label = document.getElementById('advanced-search-label'); | ||
var advanced_toggle = document.querySelector('summary'); | ||
var advanced_toggle = document.getElementById('advanced-summary'); | ||
var details_panel = document.getElementById('advanced-search-panel'); | ||
var keyword_field = document.getElementById('basic-search-main'); | ||
var geobox_field = document.getElementById('geobox-search-field'); | ||
var geobox_label = document.getElementById('geobox-search-label'); | ||
var geobox_toggle = document.getElementById('geobox-summary'); | ||
var geobox_details_panel = document.getElementById('geobox-search-panel'); | ||
var geodistance_field = document.getElementById('geodistance-search-field'); | ||
var geodistance_label = document.getElementById('geodistance-search-label'); | ||
var geodistance_toggle = document.getElementById('geodistance-summary'); | ||
var geodistance_details_panel = document.getElementById('geodistance-search-panel'); | ||
|
||
geobox_toggle.addEventListener('click', event => { | ||
if (geobox_details_panel.attributes.hasOwnProperty('open')) { | ||
disableGeobox(); | ||
} else { | ||
enableGeobox(); | ||
} | ||
}); | ||
|
||
geodistance_toggle.addEventListener('click', event => { | ||
if (geodistance_details_panel.attributes.hasOwnProperty('open')) { | ||
disableGeodistance(); | ||
} else { | ||
enableGeodistance(); | ||
} | ||
}); | ||
|
||
advanced_toggle.addEventListener('click', event => { | ||
if (details_panel.attributes.hasOwnProperty('open')) { | ||
disableAdvanced(); | ||
} else { | ||
enableAdvanced(); | ||
} | ||
keyword_field.toggleAttribute('required'); | ||
keyword_field.classList.toggle('required'); | ||
}); | ||
|
||
console.log('search_form.js loaded'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.