84 lines
2.7 KiB
HTML
84 lines
2.7 KiB
HTML
{% load i18n %}
|
|
{% block cell-content %}
|
|
{% if cell.title %}
|
|
<h2>{{ cell.title }}</h2>
|
|
{% endif %}
|
|
|
|
{% block search-form-pre %}
|
|
{% endblock %}
|
|
|
|
{% block search-form %}
|
|
<form id="combo-search-form-{{ cell.pk }}" class="combo-search-form">
|
|
<input type="search" name="q" autocomplete="off" id="combo-search-input-{{ cell.pk }}" class="combo-search-input" {% if cell.autofocus %}autofocus {% endif %}{% if cell.input_placeholder %}placeholder="{{ cell.input_placeholder }}" {% endif %}/>
|
|
<button class="submit-button combo-search--button" aria-label="{% trans 'Search' %}">
|
|
<span class="combo-search--button-label">{% block submit-content %}{% trans 'Search' %}{% endblock %}</span>
|
|
</button>
|
|
</form>
|
|
{% endblock %}
|
|
|
|
{% block search-results %}
|
|
{% for search_service in cell.search_services %}
|
|
<div id="combo-search-results-{{ cell.pk }}-{{ forloop.counter }}" class="combo-search-results combo-search-results-{{ search_service.slug }}"></div>
|
|
{% endfor %}
|
|
{% endblock %}
|
|
|
|
{% block search-js %}
|
|
<script>
|
|
$(function() {
|
|
var timeout;
|
|
var last_search = null;
|
|
var $form = $('#combo-search-form-{{ cell.pk }}');
|
|
var $input = $('#combo-search-input-{{ cell.pk }}');
|
|
{% for search_service in cell.search_services %}
|
|
var $results_{{ forloop.counter }} = $('#combo-search-results-{{ cell.pk }}-{{ forloop.counter }}');
|
|
var xhr_{{ forloop.counter }} = null;
|
|
var url_{{ forloop.counter }} = '{% url 'combo-search-ajax-results' cell_pk=cell.pk service_slug=search_service.slug %}{% if initial_query_string %}?{{ initial_query_string }}{% endif %}';
|
|
{% endfor %}
|
|
|
|
function update() {
|
|
var new_search = $input.val();
|
|
if (new_search == last_search) return;
|
|
last_search = new_search;
|
|
$form.addClass('searching');
|
|
var count = {{ cell.search_services|length }};
|
|
{% for search_service in cell.search_services %}
|
|
if (xhr_{{ forloop.counter }}) xhr_{{ forloop.counter }}.abort();
|
|
xhr_{{ forloop.counter }} = $.get(url_{{ forloop.counter }},
|
|
{'q': new_search},
|
|
function (response) {
|
|
xhr_{{ forloop.counter }} = null;
|
|
$results_{{ forloop.counter }}.html(response);
|
|
count--;
|
|
if (count == 0) {
|
|
$form.removeClass('searching');
|
|
}
|
|
}
|
|
);
|
|
{% endfor %}
|
|
};
|
|
|
|
$input.on('paste keyup', function() {
|
|
clearTimeout(timeout);
|
|
timeout = setTimeout(update, 300);
|
|
});
|
|
$input.on('change', function() {
|
|
clearTimeout(timeout);
|
|
update(this);
|
|
});
|
|
$form.on('submit', function() {
|
|
last_search = null; // make explicit submit search in all cases
|
|
clearTimeout(timeout);
|
|
update();
|
|
return false;
|
|
});
|
|
|
|
{% if initial_q %}
|
|
$input.val('{{ initial_q }}');
|
|
update();
|
|
{% endif %}
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|
|
{% endblock %}
|