From 23e37732e6c2ebc8d7d9da6b701fefeb158383ac Mon Sep 17 00:00:00 2001 From: Jonas Linde Date: Tue, 6 Dec 2022 14:49:53 +0100 Subject: [PATCH 1/2] Add filter instead of submitting form when pressing enter in the filtering expression field --- pywb/static/search.js | 35 +++++++++++++++++++++++++++-------- 1 file changed, 27 insertions(+), 8 deletions(-) diff --git a/pywb/static/search.js b/pywb/static/search.js index dd189bb9a..f0a1e0b61 100644 --- a/pywb/static/search.js +++ b/pywb/static/search.js @@ -78,6 +78,11 @@ function addFilter(event) { if (!expr) return; var filterExpr = 'filter' + modifier + by + ':' + expr; var filterList = document.getElementById(elemIds.filtering.list); + var previousFilters = filterList.children; + for (var i = 0; i < previousFilters.length; ++i) { + var filterData = previousFilters[i].dataset; + if (filterData && filterData.filter && filterData.filter == filterExpr) return; + } var filterNothing = document.getElementById(elemIds.filtering.nothing); if (filterNothing) { filterList.removeChild(filterNothing); @@ -110,6 +115,7 @@ function addFilter(event) { }; li.appendChild(nukeButton); filterList.appendChild(li); + return true; } function clearFilters(event) { @@ -166,6 +172,17 @@ function validateFields(form) { } } +function submitForm(event, form, searchURLInput) { + event.preventDefault(); + event.stopPropagation(); + var url = searchURLInput.value; + if (!url) { + validateFields(form); + return; + } + performQuery(url); +} + $(document).ready(function() { $('[data-toggle="tooltip"]').tooltip({ container: 'body', @@ -184,16 +201,18 @@ $(document).ready(function() { var searchURLInput = document.getElementById(elemIds.url); var form = document.getElementById(elemIds.form); form.addEventListener('submit', function(event) { - event.preventDefault(); - event.stopPropagation(); - var url = searchURLInput.value; - if (!url) { - validateFields(form); - return; - } - performQuery(url); + submitForm(event, form, searchURLInput); }); document.getElementById(elemIds.advancedOptions).onclick = function() { validateFields(form); } + var filteringExpression = document.getElementById(elemIds.filtering.expression); + filteringExpression.addEventListener("keypress", function(event) { + if (event.key === "Enter") { + event.preventDefault(); + if (! addFilter()) { + submitForm(event, form, searchURLInput); + } + } + }); }); From 0d2abc15a0521c44c38fcdff2377c5db45cc68dd Mon Sep 17 00:00:00 2001 From: Jonas Linde Date: Tue, 6 Dec 2022 14:51:29 +0100 Subject: [PATCH 2/2] Make filter expressions translatable --- pywb/static/query.js | 13 ++----------- pywb/static/search.js | 16 ++++------------ pywb/templates/query.html | 10 ++++++++++ pywb/templates/search.html | 20 +++++++++++++++----- 4 files changed, 31 insertions(+), 28 deletions(-) diff --git a/pywb/static/query.js b/pywb/static/query.js index cae02cae7..fd0a04502 100644 --- a/pywb/static/query.js +++ b/pywb/static/query.js @@ -57,14 +57,6 @@ function RenderCalendar(init) { }; // regex for extracting the filter constraints and filter mods to human explanation this.filterRE = /filter([^a-z]+)([a-z]+):(.+)/i; - this.filterMods = { - '=': 'Contains', - '==': 'Matches Exactly', - '=~': 'Matches Regex', - '=!': 'Does Not Contains', - '=!=': 'Is Not', - '=!~': 'Does Not Begins With' - }; this.text = init.text; this.versionString = null; } @@ -433,7 +425,6 @@ RenderCalendar.prototype.createContainers = function() { return; } // create the advanced results query info DOM structure - var forString = ' for '; var forElems; if (this.queryInfo.searchParams.matchType) { @@ -503,7 +494,7 @@ RenderCalendar.prototype.createContainers = function() { { tag: 'p', className: 'text-center mb-0 mt-1', - innerText: 'Filtering by' + innerText: filteringBy }, { tag: 'ul', @@ -950,7 +941,7 @@ RenderCalendar.prototype.niceFilterDisplay = function() { filterList.push({ tag: 'li', className: 'list-group-item', - innerText: match[2] + ' ' + this.filterMods[match[1]] + ' ' + match[3] + innerText: match[2] + ' ' + filterMods[match[1]] + ' "' + match[3] + '"' }); } } diff --git a/pywb/static/search.js b/pywb/static/search.js index f0a1e0b61..eafa0023d 100644 --- a/pywb/static/search.js +++ b/pywb/static/search.js @@ -1,14 +1,6 @@ var dtRE = /^\d{4,14}$/; var didSetWasValidated = false; var showBadDateTimeClass = 'show-optional-bad-input'; -var filterMods = { - '=': 'Contains', - '==': 'Matches Exactly', - '=~': 'Matches Regex', - '=!': 'Does Not Contains', - '=!=': 'Is Not', - '=!~': 'Does Not Begins With' -}; var elemIds = { filtering: { @@ -65,7 +57,7 @@ function makeCheckDateRangeChecker(dtInputId, dtBadNotice) { function createAndAddNoFilter(filterList) { var nothing = document.createElement('li'); - nothing.innerText = 'No Filter'; + nothing.innerText = noFilter; nothing.id = elemIds.filtering.nothing; filterList.appendChild(nothing); } @@ -89,13 +81,13 @@ function addFilter(event) { } var li = document.createElement('li'); li.innerText = - 'By ' + by[0].toUpperCase() + by.substr(1) + ' ' + filterMods[modifier] + - ' ' + - expr; + ' "' + + expr + + '"'; li.dataset.filter = filterExpr; var nukeButton = document.createElement('button'); nukeButton.type = 'button'; diff --git a/pywb/templates/query.html b/pywb/templates/query.html index d9482836e..e60614aed 100644 --- a/pywb/templates/query.html +++ b/pywb/templates/query.html @@ -71,6 +71,16 @@

{{ _('Search Results') }}

diff --git a/pywb/templates/search.html b/pywb/templates/search.html index e5b0ecba6..a781fb004 100644 --- a/pywb/templates/search.html +++ b/pywb/templates/search.html @@ -3,8 +3,18 @@ {% block head %} {{ super() }} {% endblock %} @@ -24,14 +34,14 @@

- {% trans %}'Please enter a URL{% endtrans %} + {% trans %}Please enter a URL{% endtrans %}
@@ -131,7 +141,7 @@

- +