Skip to content

Commit ad381ac

Browse files
briffbriff
committed
Add autocomplete to normal search form. Fixes #180.
1 parent fd993cf commit ad381ac

File tree

5 files changed

+115
-48
lines changed

5 files changed

+115
-48
lines changed

‎app/Http/Controllers/Search/SearchController.php

+14-5
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ public function suggestGreek()
9393
public function anySuggest()
9494
{
9595
$result = [];
96-
$term = Request::get('term');
96+
$term = Request::input('term');
9797
$refs = $this->searchService->findTranslatedRefs($term);
9898
if (!empty($refs)) {
9999
$labels = [];
@@ -108,11 +108,17 @@ public function anySuggest()
108108
'link' => "/{$concatenatedLabel}"
109109
];
110110
}
111-
$searchParamsForHit = new FullTextSearchParams();
112-
$searchParamsForHit->text = $term;
113-
$suggestions = $this->searchService->getSuggestionsFor($term);
111+
$searchParams = new FullTextSearchParams();
112+
$searchParams->text = $term;
113+
$searchParams->translationId = (int)(request()->input('translation') ?? null);
114+
$book = request()->input('book');
115+
if ($book) {
116+
$searchParams->usxCodes = $this->extractBookUsxCodes($book);
117+
}
118+
119+
$suggestions = $this->searchService->getSuggestionsFor($searchParams);
114120
if (!empty($suggestions)) {
115-
$translationHits = $this->retrieveTranslationHits($searchParamsForHit);
121+
$translationHits = $this->retrieveTranslationHits($searchParams);
116122
$hitCount = max(array_pluck($translationHits, 'hitCount'));
117123
$result = array_merge($result, $suggestions);
118124
$result[0]['hitCount'] = $hitCount;
@@ -334,6 +340,9 @@ private function addTranslationHits($view, $searchParams)
334340
private function retrieveTranslationHits($searchParams) {
335341
$translationHits = [];
336342
foreach ($this->translationRepository->getAll() as $translation) {
343+
if ($searchParams->translationId && $searchParams->translationId != $translation->id) {
344+
continue;
345+
}
337346
$params = clone $searchParams;
338347
$params->countOnly = true;
339348
$params->translationId = $translation->id;

‎app/Service/Search/SearchService.php

+1-4
Original file line numberDiff line numberDiff line change
@@ -46,12 +46,9 @@ function __construct(SearcherFactory $searcherFactory, VerseRepository $verseRep
4646
$this->referenceService = $referenceService;
4747
}
4848

49-
function getSuggestionsFor($term)
49+
function getSuggestionsFor($searchParams)
5050
{
5151
$result = [];
52-
53-
$searchParams = new FullTextSearchParams;
54-
$searchParams->text = $term;
5552
$searchParams->limit = 40; // increase the limit, as due to grouping there might be more
5653
$searchParams->grouping = 'verse';
5754
$searchParams->groupGepi = false; // at the moment I found no way to order the translations, so I need to this an other way

‎resources/assets/js/app.js

+55-4
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
1-
import('./quickSearch.js');
1+
import {itemRender} from './quickSearch.js';
22

3-
$('#searchForm').on('submit', function (event) {
3+
$('#textSearchForm').on('submit', function (event) {
44
event.preventDefault();
55
$('#interstitial').show();
6-
event.target.submit(); // Submit the form after showing the interstitial
6+
event.target.submit();
7+
});
8+
9+
$('#searchButton').on('click', function (event) {
10+
event.preventDefault();
11+
$('#textSearchForm').submit();
712
});
813

914
$('#semanticSearchForm').on('submit', function (event) {
1015
event.preventDefault();
1116
$('#interstitial').show();
12-
event.target.submit(); // Submit the form after showing the interstitial
17+
event.target.submit();
1318
});
1419

1520
$('.interstitial').on('click', () =>
@@ -22,4 +27,50 @@ window.addEventListener('pageshow', (event) => {
2227

2328
$("#greekTranslit").autocomplete({
2429
source: '/kereses/suggestGreek',
30+
});
31+
32+
$('#searchInput').autocomplete({
33+
source: function(request, response) {
34+
$.ajax({
35+
url: "/kereses/suggest",
36+
dataType: "json",
37+
data: {
38+
term: request.term,
39+
book: $('#text-search-book').val(),
40+
translation: $('#text-search-translation').val(),
41+
grouping: $('#text-search-grouping').val()
42+
},
43+
success: function(data) {
44+
response(data);
45+
}
46+
});
47+
48+
},
49+
minLength: 2,
50+
search: (event, ui) => {
51+
$("#searchHitsButtonContent").html('<span class="spinner-border-sm spinner-border"></span> Keresés');
52+
},
53+
select: (event, ui) => {
54+
window.location = ui.item.link;
55+
return false;
56+
},
57+
response: (event, ui) => {
58+
if (ui.content[0]) {
59+
const hitCount = ui.content[0].hitCount;
60+
$("#searchHitsButtonContent").html(`${hitCount} találat <i class="bi bi-chevron-right"></i>`);
61+
} else {
62+
$("#searchHitsButtonContent").html("Nincs találat");
63+
}
64+
}
65+
66+
}).data("ui-autocomplete")._renderItem = (ul, item) => {
67+
return itemRender(ul, item);
68+
};
69+
70+
$('#text-search-book').on('change', function(event) {
71+
$('#searchInput').autocomplete('search');
72+
});
73+
74+
$('#text-search-translation').on('change', function(event) {
75+
$('#searchInput').autocomplete('search');
2576
});

‎resources/assets/js/quickSearch.js

+38-28
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,40 @@
1-
$('#quickSearch').autocomplete({
1+
export function itemRender(ul, item) {
2+
if (item.cat === 'ref') {
3+
return $("<li>").append("<a><b>Igehely: </b>" + item.label + "</a>").appendTo(ul);
4+
} else {
5+
return $("<li>").append("<a>" + item.label + " <i>(" + item.linkLabel + ")</i></a>").appendTo(ul);
6+
}
7+
}
8+
9+
function quickSearch() {
10+
11+
$('#quickSearch').autocomplete({
212
source: '/kereses/suggest',
313
minLength: 2,
414
messages: {
515
noResults: '',
6-
results: () => {}
16+
results: () => { }
717
},
818
select: (event, ui) => {
919
window.location = ui.item.link;
1020
return false;
1121
},
1222
search: (event, ui) => {
1323
$("#quickSearchHitsButtonContent").html('<span class="spinner-border-sm spinner-border"></span>');
14-
},
15-
response: (event, ui) => {
16-
if (ui.content[0]) {
17-
const hitCount = ui.content[0].hitCount;
18-
$("#quickSearchHitsButtonContent").html(hitCount + " találat");
19-
} else {
20-
$("#quickSearchHitsButtonContent").html("Nincs találat");
24+
},
25+
response: (event, ui) => {
26+
if (ui.content[0]) {
27+
const hitCount = ui.content[0].hitCount;
28+
$("#quickSearchHitsButtonContent").html(hitCount + " találat");
29+
} else {
30+
$("#quickSearchHitsButtonContent").html("Nincs találat");
31+
}
2132
}
22-
}
2333

2434
}).data("ui-autocomplete")._renderItem = (ul, item) => {
25-
if (item.cat === 'ref') {
26-
return $("<li>").append("<a><b>Igehely: </b>" + item.label + "</a>").appendTo(ul);
27-
} else {
28-
return $("<li>").append("<a>" + item.label + " <i>(" + item.linkLabel + ")</i></a>").appendTo(ul);
29-
}
35+
return itemRender(ul, item);
3036
};
31-
37+
3238

3339
$('#quickSearch').on('input', (event) => {
3440
if (!event.target.value) {
@@ -46,19 +52,23 @@ $('#quickSearch').autocomplete({
4652
$('#quickSearchForm').trigger("submit");
4753
});
4854

49-
$(".translationHit").on('click', function() {
50-
$('#interstitial').show();
51-
$(this).closest('form').trigger("submit");
52-
});
55+
}
5356

54-
$('.searchResultTranslationSelector').on('click', function() {
55-
$(this).siblings().removeClass('active');
56-
$(this).addClass('active');
57-
const idToShow = $(this).data('target');
58-
const divToShow = $(idToShow);
59-
$(divToShow).siblings().hide();
60-
divToShow.show();
61-
});
57+
quickSearch();
58+
59+
$(".translationHit").on('click', function () {
60+
$('#interstitial').show();
61+
$(this).closest('form').trigger("submit");
62+
});
63+
64+
$('.searchResultTranslationSelector').on('click', function () {
65+
$(this).siblings().removeClass('active');
66+
$(this).addClass('active');
67+
const idToShow = $(this).data('target');
68+
const divToShow = $(idToShow);
69+
$(divToShow).siblings().hide();
70+
divToShow.show();
71+
});
6272

6373
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
6474
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {

‎resources/views/search/search.twig

+7-7
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
Keresés{% if form.textToSearch is defined %}: {{ form.textToSearch }}{% endif %} | Szentírás
55
{% endset %}
66

7-
{% macro filterRow(form, books, translations) %}
7+
{% macro filterRow(form, books, translations, idPrefix = '') %}
88
<div class="mb-2 row">
99
<div class="col">
10-
<select name="book" class="form-control" id="book">
10+
<select name="book" class="form-control" id="{{ idPrefix }}book">
1111
<option value="all" {{ 'all' == form.book ? 'selected' }}>könyv: mind</option>
1212
<option value="old_testament" {{ 'old_testament' == form.book ? 'selected' }}>Ószövetség</option>
1313
<option value="new_testament" {{ 'new_testament' == form.book ? 'selected' }}>Újszövetség</option>
@@ -17,15 +17,15 @@ Keresés{% if form.textToSearch is defined %}: {{ form.textToSearch }}{% endif %
1717
</select>
1818
</div>
1919
<div class="col">
20-
<select name="translation" class="form-control" id="translation">
20+
<select name="translation" class="form-control" id="{{ idPrefix }}translation">
2121
<option value="0" {{ form.translation is not defined ? 'selected' }}>fordítás: mind</option>
2222
{% for translation in translations %}
2323
<option value="{{ translation.id }}" {{ translation.id == form.translation.id ? 'selected' }}>{{ translation.name }}</option>
2424
{% endfor %}
2525
</select>
2626
</div>
2727
<div class="col">
28-
<select name="grouping" class="form-control" id="grouping">
28+
<select name="grouping" class="form-control" id="{{ idPrefix }}grouping">
2929
<option value="verse" {{ form.grouping == 'verse' ? 'selected' }}>versenként</option>
3030
<option value="chapter" {{ form.grouping == 'chapter' ? 'selected' }}>fejezetenként</option>
3131
<option value="book" {{ form.grouping == 'book' ? 'selected' }}>könyvenként</option>
@@ -45,10 +45,10 @@ Keresés{% if form.textToSearch is defined %}: {{ form.textToSearch }}{% endif %
4545
<form role="form" class="form-horizontal" method="post" action="{{ action('Search\\SearchController@anySearch') }}" id="textSearchForm">
4646
{{ csrf_field() }}
4747
<div class="input-group mb-2">
48-
<input type="text" autocomplete="off" name="textToSearch" id="textToSearch" value="{{ form.textToSearch }}" placeholder="Keresendő szöveg" class="form-control"/>
49-
<input type="submit" value="Keresés" class="btn btn-primary">
48+
<input type="text" autocomplete="off" name="textToSearch" id="searchInput" value="{{ form.textToSearch }}" placeholder="Keresendő szöveg" class="form-control"/>
49+
<a href="javascript:void(0)" id="searchButton" class="btn btn-default btn-primary"><span id="searchHitsButtonContent"><i class="bi-search"></i> Keresés</span></a>
5050
</div>
51-
{{ _self.filterRow(form, books, translations) }}
51+
{{ _self.filterRow(form, books, translations, 'text-search-') }}
5252
</form>
5353
</div>
5454
<div role="tabpanel" class="tab-pane {{ greekSearch ? 'active': ''}}" id="grc">

0 commit comments

Comments
 (0)