WP6
/
expub_compendium
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

working filtering as dropdowns

joel
Joel Galvez 1 year ago
parent
4cfa33b5c9
commit
dd9ed360d1
3 changed files with 67 additions and 48 deletions
Unified View Show Diff Stats
  1. +4
    -0
      web/app/static/styles/main.css
  2. +2
    -1
      web/app/templates/base.html
  3. +61
    -47
      web/app/templates/resources.html

+ 4
- 0
web/app/static/styles/main.css View File

--tw-bg-opacity: 1; --tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity)); background-color: rgb(255 255 255 / var(--tw-bg-opacity));
} }
.bg-red-400 {
--tw-bg-opacity: 1;
background-color: rgb(248 113 113 / var(--tw-bg-opacity));
}
.object-contain { .object-contain {
-o-object-fit: contain; -o-object-fit: contain;
object-fit: contain; object-fit: contain;

+ 2
- 1
web/app/templates/base.html View File

<body <body
class="text-base overflow-y-scroll" class="text-base overflow-y-scroll"
x-data="base()" x-data="base()"

hx-boost="true"
hx-select="#all" hx-select="#all"
hx-target="#all" hx-target="#all"
hx-swap="outerHTML" hx-swap="outerHTML"

+ 61
- 47
web/app/templates/resources.html View File



{% macro filter_dropdown(id, filter, plural='') %} {% macro filter_dropdown(id, filter, plural='') %}
<select name="{{ id }}" hx-trigger="change"> <select name="{{ id }}" hx-trigger="change">
<option value="all" {% if request.args.get(id, '' ) == '' %} selected {% endif %}
<option
value="" {% if request.args.get(id, '' )=='' %} selected {% endif %}
hx-get="{{ request.base_url }}?{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}" hx-get="{{ request.base_url }}?{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
hx-push-url="true">
hx-push-url="true"

>
{% if plural != '' %} {% if plural != '' %}
All {{ plural }}
{{ plural }}
{% else %} {% else %}
All {{ id }}s
<span class="capitalize bg-red-400">{{ id }}s</span>
{% endif%} {% endif%}
</option> </option>
{% for thing in filter %} {% for thing in filter %}
<option value="{{ thing[0] }}" {% if request.args.get(id)==thing[0]|string %} selected {% endif %}
<option
value="{{ thing[0] }}" {% if request.args.get(id)==thing[0]|string %} selected {% endif %}
hx-get="{{ request.base_url }}?{{ id }}={{ thing[0] }}{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}" hx-get="{{ request.base_url }}?{{ id }}={{ thing[0] }}{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
hx-push-url="true">
hx-push-url="true"
>
{{ thing[1] }} {{ thing[1] }}
</option> </option>
{% endfor %} {% endfor %}
{% endmacro%} {% endmacro%}


{% macro filter_dropdown_nokey(id, filter, plural='') %} {% macro filter_dropdown_nokey(id, filter, plural='') %}
<select name="{{ id }}" hx-trigger="change">
<option value="all" {% if request.args.get(id, '' ) == '' %} selected {% endif %}
<select name="{{ id }}" hx-trigger="changed">
<option value="" {% if request.args.get(id, '' ) == '' %} selected {% endif %}
hx-get="{{ request.base_url }}?{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}" hx-get="{{ request.base_url }}?{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
hx-push-url="true">
hx-push-url="true"
>
{% if plural != '' %} {% if plural != '' %}
All {{ plural }}
{{ plural }}
{% else %} {% else %}
All {{ id }}s
<span class="capitalize">{{ id }}s</span>
{% endif%} {% endif%}
</option> </option>
{% for thing in filter %} {% for thing in filter %}
<option value="{{ thing }}" {% if request.args.get(id)==thing|string %} selected {% endif %} <option value="{{ thing }}" {% if request.args.get(id)==thing|string %} selected {% endif %}
hx-get="{{ request.base_url }}?{{ id }}={{ thing }}{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}" hx-get="{{ request.base_url }}?{{ id }}={{ thing }}{% for key in request.args %}{% if key != id %}&{{ key }}={{ request.args.get(key) }}{% endif %}{% endfor %}"
hx-push-url="true">
hx-push-url="true"
>
{{ thing }} {{ thing }}
</option> </option>
{% endfor %} {% endfor %}
commodo nec est et, interdum varius risus. Curabitur vehicula consequat auctor. commodo nec est et, interdum varius risus. Curabitur vehicula consequat auctor.
</div> </div>
</div> </div>
<div class="" >
<div id="resources" >


{{ view_switch() }}
<div class="" >
<div
id="resources"
hx-boost="false"
>


<div class="flex gap-8">
{% if practices_filter %}
{{ filter_dropdown('practice', practices_filter) }}
{% endif %}
{% if year_filter %}
{{ filter_dropdown_nokey('year', year_filter) }}
{% endif %}
{% if typology_filter %}
{{ filter_dropdown_nokey('typology', typology_filter, 'typologies') }}
{% endif %}
{% if languages_filter %}
{{ filter_dropdown_nokey('scriptingLanguage', languages_filter, 'scripting languages') }}
{% endif %}
{% if licenses_filter %}
{{ filter_dropdown_nokey('license', licenses_filter) }}
{% endif %}
{% if status_filter %}
{{ filter_dropdown_nokey('status', status_filter, 'statuses') }}
{% endif %}
</div>
{{ view_switch() }}


<div>
{% if view == 'list' %}
{% for resource in resources %}
{{ resource_list(resource, loop) }}
{% endfor %}
{% else %}
{% for resource in resources %}
{{ resource_with_related(resource, loop) }}
{% endfor %}
{% endif %}
</div>
<div class="flex gap-8">
{% if practices_filter%}
{{ filter_dropdown('practice', practices_filter, 'Practices') }}
{% endif %}
{% if year_filter %}
{{ filter_dropdown_nokey('year', year_filter, 'Year') }}
{% endif %}
{% if typology_filter %}
{{ filter_dropdown_nokey('typology', typology_filter, 'Typologies') }}
{% endif %}
{% if languages_filter %}
{{ filter_dropdown_nokey('scriptingLanguage', languages_filter, 'Scripting languages') }}
{% endif %}
{% if licenses_filter %}
{{ filter_dropdown_nokey('license', licenses_filter, 'Licenses') }}
{% endif %}
{% if status_filter %}
{{ filter_dropdown_nokey('status', status_filter, 'Maintenance status') }}
{% endif %}
</div>

<div>
{% if view == 'list' %}
{% for resource in resources %}
{{ resource_list(resource, loop) }}
{% endfor %}
{% else %}
{% for resource in resources %}
{{ resource_with_related(resource, loop) }}
{% endfor %}
{% endif %}
</div>
</div>
</div> </div>
</div>




{% endblock %} {% endblock %}

Write Preview
Loading…
Cancel
Save