mirror of
https://github.com/wallabag/wallabag.git
synced 2025-02-02 12:02:23 +00:00
Handle filter form using some JS
Instead of displaying an ugly form
This commit is contained in:
parent
19c283140e
commit
d2fcbf5d84
3 changed files with 49 additions and 15 deletions
|
@ -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">×</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>
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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();
|
||||
// });
|
||||
|
||||
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue