Handle filter form using some JS

Instead of displaying an ugly form
This commit is contained in:
Jeremy Benoist 2015-08-24 20:43:29 +02:00 committed by Nicolas Lœuillet
parent 19c283140e
commit d2fcbf5d84
3 changed files with 49 additions and 15 deletions

View file

@ -4,24 +4,34 @@
{% block content %}
{% block pager %}
{% if entries is not empty %}
<div class="results">
<div class="nb-results">{{ entries.count }} {% trans %}entries{% endtrans %}</div>
<div class="pagination">
{% for p in range(1, entries.nbPages) if entries.nbPages > 1 %}
<li>
<a href="{{ path(app.request.attributes.get('_route'), app.request.query.all|merge({'page': p})) }}" class="{{ currentPage == p ? 'current':''}}" >{{ p }}</a>
</li>
{% endfor %}
<div class="pagination">
<a href="#" id="filter">{% trans %}Filter{% endtrans %}</a>
{% if entries is not empty %}
{% for p in range(1, entries.nbPages) if entries.nbPages > 1 %}
<li>
<a href="{{ path(app.request.attributes.get('_route'), app.request.query.all|merge({'page': p})) }}" class="{{ currentPage == p ? 'current':''}}" >{{ p }}</a>
</li>
{% endfor %}
{% endif %}
</div>
</div>
{% endif %}
{% endblock %}
<div id="filter-form" class="messages info popup-form">
<form method="get" action="{{ path('all') }}">
<h2>{% trans %}Filter{% endtrans %}</h2>
<a href="javascript: void(null);" id="filter-form-close" class="close-button--popup close-button">&times;</a>
{{ form_rest(form) }}
<button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">{% trans %}Filter{% endtrans %}</button>
</form>
</div>
{% if entries is empty %}
<div class="messages warning"><p>{% trans %}No articles found.{% endtrans %}</p></div>
{% else %}
<div><form action="{{ path('all') }}">{{ form_rest(form) }}<button class="btn waves-effect waves-light" type="submit" id="submit-filter" value="filter">Filter</button></form></div>
{% for entry in entries %}
<div id="entry-{{ entry.id|e }}" class="entry">
<h2><a href="{{ path('view', { 'id': entry.id }) }}">{{ entry.title|raw }}</a></h2>

View file

@ -939,6 +939,19 @@ pre code {
font-size: 0.96em;
}
#filter-form {
margin-top: 30px !important;
width: 500px;
height: 370px;
right: 5em;
left: inherit;
}
#filter-form form {
width: 500px;
height: 370px;
}
/* ==========================================================================
6 = Media Queries

View file

@ -2,6 +2,7 @@ $(document).ready(function() {
$("#search-form").hide();
$("#bagit-form").hide();
$("#filter-form").hide();
//---------------------------------------------------------------------------
// Toggle the "Search" popup in the sidebar
@ -18,6 +19,13 @@ $(document).ready(function() {
}
}
//---------------------------------------------------------------------------
// Toggle the "Filter" popup on entries list
//---------------------------------------------------------------------------
function toggleFilter() {
$("#filter-form").toggle();
}
//---------------------------------------------------------------------------
// Toggle the "Save a Link" popup in the sidebar
//---------------------------------------------------------------------------
@ -50,6 +58,11 @@ $(document).ready(function() {
$("#searchfield").focus();
});
$("#filter").click(function(){
closePopups();
toggleFilter();
});
$("#bagit").click(function(){
closePopups();
toggleBagit();
@ -60,13 +73,11 @@ $(document).ready(function() {
toggleSearch();
});
$("#filter-form-close").click(function(){
toggleFilter();
});
$("#bagit-form-close").click(function(){
toggleBagit();
});
// $("#").click(function(){
// toggleSearch();
// });
});