Extensions list: sort_by parameter #159

Merged
Márton Lente merged 36 commits from filter-sort into main 2024-06-03 12:57:45 +02:00
Showing only changes of commit 4ccddebb5f - Show all commits

View File

@ -7,24 +7,7 @@
<div class="row"> <div class="row">
<div class="col-md-12 my-4"> <div class="col-md-12 my-4">
{% if type %} {% if type %}
<div class="align-items-center d-flex justify-content-between mb-3"> <h2>{{ type }}</h2>
<h2>{{ type }}</h2>
{# TODO: @back-end add sort based on select options #}
<div class="box d-flex p-2">
<label class="align-items-center d-flex fs-sm mb-0 me-3 text-nowrap"><i class="i-repeat me-1"></i>Sort by</label>
<select class="form-control form-control-sm">
<option value="-date_approved">Newest First</option>
<option value="date_approved">Oldest First</option>
<option value="-date_modified">Recently Updated</option>
<option value="-total_ratings_count">Most Reviewed</option>
<option value="-average_score">Rating</option>
<option value="-download_count">Downloads</option>
<option value="-name">Title (A-Z)</option>
<option value="name">Title (Z-A)</option>
</select>
</div>
</div>
{% else %} {% else %}
{% if author %} {% if author %}
<h2>{% blocktranslate %}Extensions by{% endblocktranslate %} <em class="search-highlight">{{ author }}</em></h2> <h2>{% blocktranslate %}Extensions by{% endblocktranslate %} <em class="search-highlight">{{ author }}</em></h2>
@ -46,31 +29,50 @@
{% if tags %} {% if tags %}
<div class="mb-3 row"> <div class="mb-3 row">
<div class="col-md-12"> <div class="col-md-12">
<div class="box box-filter-sort overflow-hidden p-2"> <div class="d-flex flex-column flex-md-row">
<div class="box-filter-sort-start h-100 position-absolute start-0 top-0 w-5 z-1"></div> <div class="box box-filter-sort mb-2 mb-md-0 me-md-3 overflow-hidden p-2">
<div class="btn-row flex-nowrap overflow-x-auto"> {# TODO: add js hide box filter sort end and start before and after scroll #}
{# TODO: @back-end add conditional link to either Add-ons or Themes pages #} <div class="box-filter-sort-start h-100 position-absolute start-0 top-0 w-5 z-1"></div>
<a class="align-items-center btn btn-sm d-flex {% if not tag %}btn-primary{% endif %}" href="/add-ons" title="All"> <div class="btn-row flex-nowrap overflow-x-auto">
<div> {# TODO: @back-end add conditional link to either Add-ons or Themes pages #}
All <a class="align-items-center btn btn-sm d-flex {% if not tag %}btn-primary{% endif %}" href="/add-ons" title="All">
</div>
<div class="align-items-center bg-primary d-flex h-3 fs-xs justify-content-center ms-2 rounded-circle w-3">
1
</div>
</a>
{% for list_tag in tags %}
<a class="align-items-center btn btn-sm d-flex {% if tag == list_tag %}btn-primary{% endif %}" href="{% url "extensions:by-tag" tag_slug=list_tag.slug %}" title="{{ list_tag.name }}">
<div> <div>
{{ list_tag.name }} All
</div> </div>
{# TODO: @back-end add tags count dynamic #} <div class="align-items-center bg-primary d-flex h-3 fs-xs justify-content-center ms-2 rounded-circle w-3">
<div class="align-items-center bg-primary d-flex h-3 fs-xs justify-content-center ms-2 mw-3 px-1 rounded-2">
1 1
</div> </div>
</a> </a>
{% endfor %} {% for list_tag in tags %}
<a class="align-items-center btn btn-sm d-flex {% if tag == list_tag %}btn-primary{% endif %}" href="{% url "extensions:by-tag" tag_slug=list_tag.slug %}" title="{{ list_tag.name }}">
<div>
{{ list_tag.name }}
</div>
{# TODO: @back-end add tags count dynamic #}
<div class="align-items-center bg-primary d-flex h-3 fs-xs justify-content-center ms-2 mw-3 px-1 rounded-2">
1
</div>
</a>
{% endfor %}
</div>
<div class="box-filter-sort-end end-0 h-100 position-absolute top-0 w-5"></div>
</div>
<div class="align-items-center d-flex flex-shrink-0 justify-content-between">
{# TODO: @back-end add sort based on select options #}
<div class="box d-flex p-2 w-100">
<label class="align-items-center d-flex fs-sm mb-0 me-3 text-nowrap">Sort by</label>
<select class="form-control form-control-sm">
<option value="-date_approved">Newest First</option>
<option value="date_approved">Oldest First</option>
<option value="-date_modified">Recently Updated</option>
<option value="-total_ratings_count">Most Reviewed</option>
<option value="-average_score">Rating</option>
<option value="-download_count">Downloads</option>
<option value="-name">Title (A-Z)</option>
<option value="name">Title (Z-A)</option>
</select>
</div>
</div> </div>
<div class="box-filter-sort-end end-0 h-100 position-absolute top-0 w-5"></div>
</div> </div>
</div> </div>
</div> </div>
@ -79,7 +81,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
{% if object_list %} {% if object_list %}
<div class="cards cards cards-lg-4 cards-md-3 cards-sm-2 mt-3"> <div class="cards cards cards-lg-4 cards-md-3 cards-sm-2">
{% for extension in object_list %} {% for extension in object_list %}
{% include "extensions/components/card.html" with show_type=False %} {% include "extensions/components/card.html" with show_type=False %}
{% endfor %} {% endfor %}