From 6f33ecb0ae00f3bfffed04ee0d8bcc14c657b0aa Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 12:30:44 +0200 Subject: [PATCH 01/68] Rework HTML headers --- app/templates/app/document_detail.html | 1 + app/templates/app/institution_detail.html | 1 + app/templates/app/project_detail.html | 1 + app/templates/base.html | 8 ++++---- 4 files changed, 7 insertions(+), 4 deletions(-) diff --git a/app/templates/app/document_detail.html b/app/templates/app/document_detail.html index d0f90b5c..713a9685 100644 --- a/app/templates/app/document_detail.html +++ b/app/templates/app/document_detail.html @@ -2,6 +2,7 @@ {% load static %} {% load i18n %} +{% block title %}{{ document.title }}{% endblock %} {% block content %}
diff --git a/app/templates/app/institution_detail.html b/app/templates/app/institution_detail.html index 23fab35b..11c7a677 100644 --- a/app/templates/app/institution_detail.html +++ b/app/templates/app/institution_detail.html @@ -2,6 +2,7 @@ {% load static %} {% load i18n %} +{% block title %}{{ institution.name }}{% endblock %} {% block content %}
diff --git a/app/templates/app/project_detail.html b/app/templates/app/project_detail.html index 140e1d3b..0fc83390 100644 --- a/app/templates/app/project_detail.html +++ b/app/templates/app/project_detail.html @@ -2,6 +2,7 @@ {% load static %} {% load i18n %} +{% block title %}{{ project.name }}{% endblock %} {% block content %}
diff --git a/app/templates/base.html b/app/templates/base.html index 30cd53fd..03693d6a 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -4,10 +4,10 @@ - {% trans "SADiLaR" %} - - - + {% block title %}{% trans "SADiLaR" %}{% endblock %} + + + From 6b2b08c1b9109c7699db673826e0ba78864015dd Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 12:33:41 +0200 Subject: [PATCH 02/68] +templatetag for a Bootstrap icon Repetative with too much room to get this wrong. --- app/general/templatetags/bs_icons.py | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 app/general/templatetags/bs_icons.py diff --git a/app/general/templatetags/bs_icons.py b/app/general/templatetags/bs_icons.py new file mode 100644 index 00000000..9695f978 --- /dev/null +++ b/app/general/templatetags/bs_icons.py @@ -0,0 +1,21 @@ +import re + +from django import template +from django.utils.safestring import mark_safe + +"""A simple template tag to add a single Bootstrap icon. + +If our needs grow, we should probably switch to something like +django-bootstrap-icons: +https://pypi.org/project/django-bootstrap-icons/ +""" + + +register = template.Library() +icon_name_re = re.compile(r"[a-z0-9\-]+") + + +@register.simple_tag +def bs_icon(name): + assert icon_name_re.fullmatch(name) + return mark_safe(f'') From ae4246f46b39a5f8a3c1fc43fa31004563514c3e Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 12:45:20 +0200 Subject: [PATCH 03/68] Factor out pagination Also improved some layout bugs (particularly at small sizes), added ellipsis (...), and improved accessibility. --- app/templates/app/_pagination.html | 44 ++++++++++++++++++++++++++++++ app/templates/app/documents.html | 24 +--------------- app/templates/app/subjects.html | 30 ++------------------ 3 files changed, 48 insertions(+), 50 deletions(-) create mode 100644 app/templates/app/_pagination.html diff --git a/app/templates/app/_pagination.html b/app/templates/app/_pagination.html new file mode 100644 index 00000000..2d71c847 --- /dev/null +++ b/app/templates/app/_pagination.html @@ -0,0 +1,44 @@ +{% load i18n %} +{% if page_obj.has_previous or page_obj.has_next %} + +{% endif %} diff --git a/app/templates/app/documents.html b/app/templates/app/documents.html index b1e7fd4e..88478034 100644 --- a/app/templates/app/documents.html +++ b/app/templates/app/documents.html @@ -82,31 +82,9 @@

{% endfor %}

-
-
{% endblock content %} diff --git a/app/templates/app/subjects.html b/app/templates/app/subjects.html index f2b25e77..7cd842fb 100644 --- a/app/templates/app/subjects.html +++ b/app/templates/app/subjects.html @@ -50,34 +50,10 @@
{% trans "Projects" %}
{% endfor %}
- {% if page_obj.has_other_pages %} -
-
+ + {% include "app/_pagination.html" %} - {% if page_obj.has_next %} -
  • {% trans "Next" %} ›
    • -
  • {% trans "Last" %} »
    • - {% else %} -
  • {% trans "Next" %} ›
    • -
  • {% trans "Last" %} »
    • - {% endif %} - -
    - {% endif %} {% endblock content %} From ea4de0ac765945d529354e0314addcc08b310d17 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 12:48:07 +0200 Subject: [PATCH 04/68] Rework header This fixes duplicate class attributes, and gives a hamburger icon. --- app/templates/app/_nav_item.html | 9 ++++ app/templates/base.html | 82 ++++++++++---------------------- 2 files changed, 33 insertions(+), 58 deletions(-) create mode 100644 app/templates/app/_nav_item.html diff --git a/app/templates/app/_nav_item.html b/app/templates/app/_nav_item.html new file mode 100644 index 00000000..956cc824 --- /dev/null +++ b/app/templates/app/_nav_item.html @@ -0,0 +1,9 @@ +
  • + + {{ label }} + +
    • + diff --git a/app/templates/base.html b/app/templates/base.html index 03693d6a..142548ad 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -16,68 +16,34 @@ - -{% block app_header %}
    -
    - -
    -
    + +{% endblock header %}
    -{% endblock app_header %} -
    {% block content %} From 36e153b5e16940989646ca12ca31b0446e90c7ea Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 12:50:50 +0200 Subject: [PATCH 05/68] Rework footer Fixes lack of label for select (as reported by Lighthouse). This has a slightly different layout, but is expandable to more links, and uses less height on wide screen sizes. --- app/templates/base.html | 27 ++++++++++++++------------- 1 file changed, 14 insertions(+), 13 deletions(-) diff --git a/app/templates/base.html b/app/templates/base.html index 142548ad..16004684 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -51,21 +51,22 @@ {% endblock content %}

    - -
    -
    -
    -

    {% trans "Developed by" %} SADiLaR

    -
    - {% trans "Legal Notices" %} - {% trans "Contact Us" %} +
    +
    +
    +
    +

    {% trans "Developed by " %} SADiLaR

    +
    +
    {% trans "Legal Notices" %}
    +
    {% trans "Contact Us" %}
    +
    -
    -
    +
    {% csrf_token %} - {% get_current_language as LANGUAGE_CODE %} {% get_available_languages as LANGUAGES %} {% for lang in LANGUAGES %} @@ -74,13 +75,13 @@ {% endfor %} - +
    +
    - From ba93407a662820b8840e518cc8498ad88b34af94 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 13:01:54 +0200 Subject: [PATCH 06/68] Factor out filters This fixes the bug where the generic form-control was used instead of form-select, so now it looks like a dropdown. On the project page the selection was forgotten when filtering. --- .../app/_subj_lang_institution_filter.html | 45 +++++++++++++++++++ app/templates/app/documents.html | 37 --------------- app/templates/app/projects.html | 38 +--------------- 3 files changed, 46 insertions(+), 74 deletions(-) create mode 100644 app/templates/app/_subj_lang_institution_filter.html diff --git a/app/templates/app/_subj_lang_institution_filter.html b/app/templates/app/_subj_lang_institution_filter.html new file mode 100644 index 00000000..7bcc6bb4 --- /dev/null +++ b/app/templates/app/_subj_lang_institution_filter.html @@ -0,0 +1,45 @@ +{% load i18n %} +
    +
    +
    + + +
    +
    + + +
    +
    + + +
    +
    +
    + + {% trans "Reset" %} +
    +
    diff --git a/app/templates/app/documents.html b/app/templates/app/documents.html index 88478034..b8337079 100644 --- a/app/templates/app/documents.html +++ b/app/templates/app/documents.html @@ -3,43 +3,6 @@ {% load i18n %} {% block content %} -
    -
    -
    -
    - - -
    -
    - - -
    -
    - - -
    -
    -
    - - {% trans "Reset" %} -
    -
    -

    diff --git a/app/templates/app/projects.html b/app/templates/app/projects.html index ef155fcc..f2c915a2 100644 --- a/app/templates/app/projects.html +++ b/app/templates/app/projects.html @@ -3,44 +3,8 @@ {% load i18n %} {% block content %} -
    -
    -
    -
    - - -
    -
    - - -
    -
    - - -
    -
    -
    - - {% trans "Reset" %} -
    -
    -
    + {% include "app/_subj_lang_institution_filter.html" %}
    From da2efd0b8c895b84af64a0d965685386a5c345eb Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Mon, 29 Jul 2024 13:08:28 +0200 Subject: [PATCH 07/68] Drop profile completion Might get back to this, but we probably need something with a bit more sofistication. --- app/templates/app/institutions.html | 34 ----------------------------- 1 file changed, 34 deletions(-) diff --git a/app/templates/app/institutions.html b/app/templates/app/institutions.html index 8a002a7f..66776758 100644 --- a/app/templates/app/institutions.html +++ b/app/templates/app/institutions.html @@ -22,40 +22,6 @@
    {

    -

    {% trans "Profile completion:" %}

    -
    - {% if institution.rating <= 20 %} - - - - - - {% elif institution.rating <= 40 %} - - - - - - {% elif institution.rating <= 60 %} - - - - - - {% elif institution.rating <= 80 %} - - - - - - {% else %} - - - - - - {% endif %} -
    - + From a47080d484722fba0bbe7fb6d257e48f7627d8e9 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 20:25:53 +0200 Subject: [PATCH 17/68] Reduce "no info available" messages On wide screens (two columns) these are maintained for layout, but we reduce it on smaller screens where it doesn't serve enough of a purpose. --- app/templates/app/languages.html | 16 ++++++++++++---- app/templates/app/subjects.html | 16 ++++++++++++---- 2 files changed, 24 insertions(+), 8 deletions(-) diff --git a/app/templates/app/languages.html b/app/templates/app/languages.html index bcb20cb7..a9417b94 100644 --- a/app/templates/app/languages.html +++ b/app/templates/app/languages.html @@ -10,8 +10,8 @@

    {% trans "Information by language" %}

    {% for item in language_data %}

    {{ item.language.name }}

    -

    {% trans "Documents" %}

    {% if item.documents.exists %} +

    {% trans "Documents" %}

      {% for document in item.documents %} @@ -25,12 +25,16 @@

      {% trans "Documents" %}

    {% else %} -

    {% trans "No documents available for this language." %}

    + {# Only show this in two-column mode to ensure consistent layout and placement #} +
    +

    {% trans "Documents" %}

    +

    {% trans "No documents available for this language." %}

    +
    {% endif %}
    -

    {% trans "Projects" %}

    {% if item.projects.exists %} +

    {% trans "Projects" %}

      {% for project in item.projects %} @@ -44,7 +48,11 @@

      {% trans "Projects" %}

    {% else %} -

    {% trans "No projects available for this language." %}

    + {# Only show this in two-column mode to ensure consistent layout and placement #} +
    +

    {% trans "Projects" %}

    +

    {% trans "No projects available for this language." %}

    +
    {% endif %}
    diff --git a/app/templates/app/subjects.html b/app/templates/app/subjects.html index 8a11cb8f..3a0c5eec 100644 --- a/app/templates/app/subjects.html +++ b/app/templates/app/subjects.html @@ -10,8 +10,8 @@

    {% trans "Information by subject" %}

    {% for item in subject_data %}

    {{ item.subject.name }}

    -

    {% trans "Documents" %}

    {% if item.documents.exists %} +

    {% trans "Documents" %}

      {% for document in item.documents %} @@ -25,12 +25,16 @@

      {% trans "Documents" %}

    {% else %} -

    {% trans "No documents available for this subject." %}

    + {# Only show this in two-column mode to ensure consistent layout and placement #} +
    +

    {% trans "Documents" %}

    +

    {% trans "No documents available for this subject." %}

    +
    {% endif %}
    -

    {% trans "Projects" %}

    {% if item.projects.exists %} +

    {% trans "Projects" %}

      {% for project in item.projects %} @@ -44,7 +48,11 @@

      {% trans "Projects" %}

    {% else %} -

    {% trans "No projects available for this subject." %}

    + {# Only show this in two-column mode to ensure consistent layout and placement #} +
    + {% trans "Projects" %} +

    {% trans "No projects available for this subject." %}

    +
    {% endif %}
    From 375d9b563cdfbe112306d620b0b7b15b56901c40 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 20:47:23 +0200 Subject: [PATCH 18/68] Make icons and their spacing more consistent The layout of text after {% icon %} would affect the layout, which would require discipline in spacing around the tag. This relies on a space after the icon span. --- app/general/templatetags/bs_icons.py | 9 ++++++++- app/templates/app/document_detail.html | 6 +++--- app/templates/app/institution_detail.html | 4 ++-- app/templates/app/project_detail.html | 4 ++-- 4 files changed, 15 insertions(+), 8 deletions(-) diff --git a/app/general/templatetags/bs_icons.py b/app/general/templatetags/bs_icons.py index d2cc20e9..4a7653ff 100644 --- a/app/general/templatetags/bs_icons.py +++ b/app/general/templatetags/bs_icons.py @@ -17,7 +17,14 @@ def _bs_icon(name): assert icon_name_re.fullmatch(name) - return mark_safe(f'') + return mark_safe(f' ') + # The trailing space is intentional: Since this is an inline element + # usually followed by text, the absence/presence of a space is significant, + # and usually wanted for layout. That's too hard to remember, so we always + # add it. Multiple spaces are equal to one. That way the exact layout of + # code in the templates doesn't matter. Beware of using {% spaceless %} + # which will negate this. A pure CSS solution escaped me thus far, since a + # space will take additional space in addition to a margin. @register.simple_tag diff --git a/app/templates/app/document_detail.html b/app/templates/app/document_detail.html index bac29de2..11e84c1c 100644 --- a/app/templates/app/document_detail.html +++ b/app/templates/app/document_detail.html @@ -23,7 +23,7 @@

    {{ document.title }}

    @@ -50,7 +50,7 @@

    {{ document.title }}

    {% trans "Subjects" %}

      {% for subject in document.subjects.all %} -
    • {% icon "subject" %}{{ subject.name }}
      • +
    • {% icon "subject" %}{{ subject.name }}
      • {% endfor %}
    @@ -61,7 +61,7 @@

    {% trans "Subjects" %}

    {% trans "Languages" %}

      {% for language in document.languages.all %} -
    • {% icon "language" %}{{ language.name }}
      • +
    • {% icon "language" %}{{ language.name }}
      • {% endfor %}
    diff --git a/app/templates/app/institution_detail.html b/app/templates/app/institution_detail.html index 439f0bc5..e3f2ba15 100644 --- a/app/templates/app/institution_detail.html +++ b/app/templates/app/institution_detail.html @@ -32,7 +32,7 @@

    {% trans "Projects" %}

    {% if projects %}
      {% for project in projects %} -
    • +
    • {% icon "project" %} {{ project.name }}
      • @@ -47,7 +47,7 @@

      {% trans "Documents" %}

      {% if documents %}
        {% for document in documents %} -
      • +
      • {% icon "document" %} {{ document.title }}
        • diff --git a/app/templates/app/project_detail.html b/app/templates/app/project_detail.html index 13874630..9ce68844 100644 --- a/app/templates/app/project_detail.html +++ b/app/templates/app/project_detail.html @@ -60,7 +60,7 @@

        {{ project.name }}

        {% trans "Subjects" %}

          {% for subject in subjects %} -
        • {% icon "subject" %}{{ subject.name }}
          • +
        • {% icon "subject" %}{{ subject.name }}
          • {% endfor %}
        @@ -71,7 +71,7 @@

        {% trans "Subjects" %}

        {% trans "Languages" %}

          {% for language in languages %} -
        • {% icon "language" %}{{ language.name }}
          • +
        • {% icon "language" %}{{ language.name }}
          • {% endfor %}
        From 895b8ce03bae94fc9c5dd96307d3aeb834bb59a1 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 20:49:42 +0200 Subject: [PATCH 19/68] Implement more page titles --- app/templates/app/document_detail.html | 1 + app/templates/app/documents.html | 2 ++ app/templates/app/institution_detail.html | 1 + app/templates/app/institutions.html | 2 ++ app/templates/app/languages.html | 2 ++ app/templates/app/project_detail.html | 1 + app/templates/app/projects.html | 4 +++- app/templates/app/subjects.html | 2 ++ app/templates/base_error.html | 1 + 9 files changed, 15 insertions(+), 1 deletion(-) diff --git a/app/templates/app/document_detail.html b/app/templates/app/document_detail.html index 11e84c1c..6f25709a 100644 --- a/app/templates/app/document_detail.html +++ b/app/templates/app/document_detail.html @@ -4,6 +4,7 @@ {% load bs_icons %} {% block title %}{{ document.title }}{% endblock %} + {% block content %}

        {% trans "Documents" %} > {{ document.title }}

        diff --git a/app/templates/app/documents.html b/app/templates/app/documents.html index e4d79fde..e29b4825 100644 --- a/app/templates/app/documents.html +++ b/app/templates/app/documents.html @@ -3,6 +3,8 @@ {% load i18n %} {% load bs_icons %} +{% block title %}{% trans "Documents" %}{% endblock %} + {% block content %}

        {% trans "Documents" %}

        diff --git a/app/templates/app/institution_detail.html b/app/templates/app/institution_detail.html index e3f2ba15..2f6944b1 100644 --- a/app/templates/app/institution_detail.html +++ b/app/templates/app/institution_detail.html @@ -4,6 +4,7 @@ {% load bs_icons %} {% block title %}{{ institution.name }}{% endblock %} + {% block content %}

        {% trans "Institutions" %} > {{ institution.name }}

        diff --git a/app/templates/app/institutions.html b/app/templates/app/institutions.html index 68ff9119..c4594fa2 100644 --- a/app/templates/app/institutions.html +++ b/app/templates/app/institutions.html @@ -3,6 +3,8 @@ {% load i18n %} {% load bs_icons %} +{% block title %}{% trans "Institutions" %}{% endblock %} + {% block content %}
        {# row has unwanted margin #} {% for institution in institutions %} diff --git a/app/templates/app/languages.html b/app/templates/app/languages.html index a9417b94..c82c141f 100644 --- a/app/templates/app/languages.html +++ b/app/templates/app/languages.html @@ -3,6 +3,8 @@ {% load i18n %} {% load bs_icons %} +{% block title %}{% trans "Languages" %}{% endblock %} + {% block content %}

        {% trans "Information by language" %}

        diff --git a/app/templates/app/project_detail.html b/app/templates/app/project_detail.html index 9ce68844..1a95ead9 100644 --- a/app/templates/app/project_detail.html +++ b/app/templates/app/project_detail.html @@ -4,6 +4,7 @@ {% load bs_icons %} {% block title %}{{ project.name }}{% endblock %} + {% block content %}

        {% trans "Projects" %} > {{ project.name }}

        diff --git a/app/templates/app/projects.html b/app/templates/app/projects.html index fc9c65d2..2cfc4568 100644 --- a/app/templates/app/projects.html +++ b/app/templates/app/projects.html @@ -3,9 +3,11 @@ {% load i18n %} {% load bs_icons %} +{% block title %}{% trans "Projects" %}{% endblock %} + {% block content %}
        -

        {%trans "Projects" %}

        +

        {% trans "Projects" %}

        {% include "app/_subj_lang_institution_filter.html" %} diff --git a/app/templates/app/subjects.html b/app/templates/app/subjects.html index 3a0c5eec..83ea3290 100644 --- a/app/templates/app/subjects.html +++ b/app/templates/app/subjects.html @@ -3,6 +3,8 @@ {% load i18n %} {% load bs_icons %} +{% block title %}{% trans "Subjects" %}{% endblock %} + {% block content %}

        {% trans "Information by subject" %}

        diff --git a/app/templates/base_error.html b/app/templates/base_error.html index 84ad432f..0eda3258 100644 --- a/app/templates/base_error.html +++ b/app/templates/base_error.html @@ -2,6 +2,7 @@ {% load i18n %} {% block title %}{% trans "Error" %}{% endblock %} + {% block content %}
        From 95dd02a9e998ae26120df33a27ee2808de13f4bc Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 20:53:27 +0200 Subject: [PATCH 20/68] Reduce size of h3 --- app/templates/app/languages.html | 8 ++++---- app/templates/app/subjects.html | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/app/templates/app/languages.html b/app/templates/app/languages.html index c82c141f..747dc47b 100644 --- a/app/templates/app/languages.html +++ b/app/templates/app/languages.html @@ -13,7 +13,7 @@

        {% trans "Information by language" %}

        {{ item.language.name }}

        {% if item.documents.exists %} -

        {% trans "Documents" %}

        +

        {% trans "Documents" %}

          {% for document in item.documents %} @@ -29,14 +29,14 @@

          {% trans "Documents" %}

          {% else %} {# Only show this in two-column mode to ensure consistent layout and placement #}
          -

          {% trans "Documents" %}

          +

          {% trans "Documents" %}

          {% trans "No documents available for this language." %}

          {% endif %}
        {% if item.projects.exists %} -

        {% trans "Projects" %}

        +

        {% trans "Projects" %}

          {% for project in item.projects %} @@ -52,7 +52,7 @@

          {% trans "Projects" %}

          {% else %} {# Only show this in two-column mode to ensure consistent layout and placement #}
          -

          {% trans "Projects" %}

          +

          {% trans "Projects" %}

          {% trans "No projects available for this language." %}

          {% endif %} diff --git a/app/templates/app/subjects.html b/app/templates/app/subjects.html index 83ea3290..adbaa16a 100644 --- a/app/templates/app/subjects.html +++ b/app/templates/app/subjects.html @@ -13,7 +13,7 @@

          {% trans "Information by subject" %}

          {{ item.subject.name }}

          {% if item.documents.exists %} -

          {% trans "Documents" %}

          +

          {% trans "Documents" %}

            {% for document in item.documents %} @@ -29,14 +29,14 @@

            {% trans "Documents" %}

            {% else %} {# Only show this in two-column mode to ensure consistent layout and placement #}
            -

            {% trans "Documents" %}

            +

            {% trans "Documents" %}

            {% trans "No documents available for this subject." %}

            {% endif %}
          {% if item.projects.exists %} -

          {% trans "Projects" %}

          +

          {% trans "Projects" %}

            {% for project in item.projects %} @@ -52,7 +52,7 @@

            {% trans "Projects" %}

            {% else %} {# Only show this in two-column mode to ensure consistent layout and placement #}
            - {% trans "Projects" %} +

            {% trans "Projects" %}

            {% trans "No projects available for this subject." %}

            {% endif %} From c592a3def87b99f7cd92ac26a20fa2a0e58623c8 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 21:09:00 +0200 Subject: [PATCH 21/68] Cosmetic changes that reduce HTML output charset="utf-8" is supurfluous in HTML 5. {% spaceless %} is not used in
            due to issues it might cause with icons. See commit 375d9b5. --- app/general/templatetags/bs_icons.py | 2 +- app/templates/app/_subj_lang_institution_filter.html | 2 ++ app/templates/app/languages.html | 8 ++------ app/templates/app/subjects.html | 8 ++------ app/templates/base.html | 6 ++++-- 5 files changed, 11 insertions(+), 15 deletions(-) diff --git a/app/general/templatetags/bs_icons.py b/app/general/templatetags/bs_icons.py index 4a7653ff..c508dca5 100644 --- a/app/general/templatetags/bs_icons.py +++ b/app/general/templatetags/bs_icons.py @@ -17,7 +17,7 @@ def _bs_icon(name): assert icon_name_re.fullmatch(name) - return mark_safe(f' ') + return mark_safe(f' ') # The trailing space is intentional: Since this is an inline element # usually followed by text, the absence/presence of a space is significant, # and usually wanted for layout. That's too hard to remember, so we always diff --git a/app/templates/app/_subj_lang_institution_filter.html b/app/templates/app/_subj_lang_institution_filter.html index 7bcc6bb4..6f78106e 100644 --- a/app/templates/app/_subj_lang_institution_filter.html +++ b/app/templates/app/_subj_lang_institution_filter.html @@ -1,4 +1,5 @@ {% load i18n %} +{% spaceless %}
            @@ -43,3 +44,4 @@ {% trans "Reset" %}
            +{% endspaceless %} diff --git a/app/templates/app/languages.html b/app/templates/app/languages.html index 747dc47b..a7609fb7 100644 --- a/app/templates/app/languages.html +++ b/app/templates/app/languages.html @@ -19,9 +19,7 @@

            {% trans "Documents" %}

            {% for document in item.documents %}
          • {% icon "document" %} - - {{ document.title }} - + {{ document.title }}
            • {% endfor %}
          @@ -42,9 +40,7 @@

          {% trans "Projects" %}

          {% for project in item.projects %}
        • {% icon "project" %} - - {{ project.name }} - + {{ project.name }}
          • {% endfor %}
        diff --git a/app/templates/app/subjects.html b/app/templates/app/subjects.html index adbaa16a..c645ff3b 100644 --- a/app/templates/app/subjects.html +++ b/app/templates/app/subjects.html @@ -19,9 +19,7 @@

        {% trans "Documents" %}

        {% for document in item.documents %}
      • {% icon "document" %} - - {{ document.title }} - + {{ document.title }}
        • {% endfor %}
      @@ -42,9 +40,7 @@

      {% trans "Projects" %}

      {% for project in item.projects %}
    • {% icon "project" %} - - {{ project.name }} - + {{ project.name }}
      • {% endfor %}
    diff --git a/app/templates/base.html b/app/templates/base.html index ece3155b..50a96779 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -1,13 +1,12 @@ {% load static %} {% load i18n %} - +{% spaceless %} {% block title %}{% trans "SADiLaR" %}{% endblock %} - @@ -83,12 +82,14 @@ {% endblock header %} +{% endspaceless %}
    {% block content %} {% endblock content %}
    +{% spaceless %}
    @@ -120,6 +121,7 @@
    +{% endspaceless %} From 656a6f35aade827ea2d299178120053e55d6df31 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 21:11:24 +0200 Subject: [PATCH 22/68] Use repr(institution) in filter dropdown --- app/templates/app/_subj_lang_institution_filter.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/templates/app/_subj_lang_institution_filter.html b/app/templates/app/_subj_lang_institution_filter.html index 6f78106e..de3e81ce 100644 --- a/app/templates/app/_subj_lang_institution_filter.html +++ b/app/templates/app/_subj_lang_institution_filter.html @@ -33,7 +33,7 @@ {% for institution in institutions %} {% endfor %} From 182460bd43486295a540c1e25d3f78a9545c37c9 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 31 Jul 2024 21:11:46 +0200 Subject: [PATCH 23/68] Pass view name to template for search page --- app/app/views.py | 1 + 1 file changed, 1 insertion(+) diff --git a/app/app/views.py b/app/app/views.py index 67249f37..c7110c4e 100644 --- a/app/app/views.py +++ b/app/app/views.py @@ -413,6 +413,7 @@ def search(request): page_obj = paginator.page(paginator.num_pages) context = { + "current_page": "search", "search_results": paginator.page(page_obj.number), "filter": f, "documents": page_obj, From f7e6c2cae7767f9c97d8461ba8304aa575e8e6ae Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Sat, 3 Aug 2024 22:31:04 +0200 Subject: [PATCH 24/68] Rework search page Several things needed attention, such as broken pagination, code duplication and general complexity. The tag soup "worked", but was obviously not tennable. This tries to solve all of that, gets rid of almost all custom CSS classes in favour of bootstrap, and moves to more semantic HTML and a few usability and accessibility improvements, e.g. - blockquote, section, etc. - larger checkboxes - Show message when there are no results - aria-label here and there This moves the filters to the right, which hopefully ensures more attention on the results. The second search input is removed in favour of links that assist users on small screens to go to the "other" part of the page. The assumption is that enough context is visible on larger screens. And the page is down from 220kB to under 50kB. --- app/app/views.py | 7 +- app/general/filters.py | 15 +- app/general/tests/test_view_search.py | 10 +- app/templates/app/_search_filter.html | 13 ++ app/templates/app/search.html | 313 +++++++------------------- app/templates/base.html | 6 + 6 files changed, 116 insertions(+), 248 deletions(-) create mode 100644 app/templates/app/_search_filter.html diff --git a/app/app/views.py b/app/app/views.py index c7110c4e..d81e0033 100644 --- a/app/app/views.py +++ b/app/app/views.py @@ -414,10 +414,9 @@ def search(request): context = { "current_page": "search", - "search_results": paginator.page(page_obj.number), "filter": f, - "documents": page_obj, - "search_params": pagination_url(request), + "page_obj": page_obj, + "url_params": pagination_url(request), } return render(request, template_name=template, context=context) @@ -432,4 +431,4 @@ def pagination_url(request): "languages": request.GET.getlist("languages", []), } - return "?" + urlencode(url_params, doseq=True) + return urlencode(url_params, doseq=True) diff --git a/app/general/filters.py b/app/general/filters.py index 72fe7ef9..5e6f875c 100644 --- a/app/general/filters.py +++ b/app/general/filters.py @@ -8,22 +8,29 @@ ) from django.db.models import F, Value from django.db.models.functions import Greatest, Left +from django.utils.translation import gettext_lazy as _ from django_filters import ModelMultipleChoiceFilter, MultipleChoiceFilter from general.models import DocumentFile, Institution, Language, Project, Subject class DocumentFileFilter(django_filters.FilterSet): - search = django_filters.CharFilter(method="ignore", label="Search") + search = django_filters.CharFilter(method="ignore", label=_("Search")) institution = ModelMultipleChoiceFilter( - queryset=Institution.objects.all(), widget=forms.CheckboxSelectMultiple + label=_("Institution"), + queryset=Institution.objects.all().order_by("name"), + widget=forms.CheckboxSelectMultiple(attrs={"class": "form-check-input"}), ) subjects = ModelMultipleChoiceFilter( - queryset=Subject.objects.all(), widget=forms.CheckboxSelectMultiple + label=_("Subjects"), + queryset=Subject.objects.all().order_by("name"), + widget=forms.CheckboxSelectMultiple(attrs={"class": "form-check-input"}), ) languages = ModelMultipleChoiceFilter( - queryset=Language.objects.all(), widget=forms.CheckboxSelectMultiple + label=_("Languages"), + queryset=Language.objects.all().order_by("name"), + widget=forms.CheckboxSelectMultiple(attrs={"class": "form-check-input"}), ) class Meta: diff --git a/app/general/tests/test_view_search.py b/app/general/tests/test_view_search.py index 21ab0c42..57b2807d 100644 --- a/app/general/tests/test_view_search.py +++ b/app/general/tests/test_view_search.py @@ -35,11 +35,11 @@ def test_search_pagination(self): client = Client() response = client.get(reverse("search"), {"page": "1"}) self.assertEqual(response.status_code, 200) - self.assertEqual(len(response.context["documents"]), 5) + self.assertEqual(len(response.context["page_obj"]), 5) response = client.get(reverse("search"), {"page": "2"}) self.assertEqual(response.status_code, 200) - self.assertEqual(len(response.context["documents"]), 5) + self.assertEqual(len(response.context["page_obj"]), 5) response = client.get(reverse("search"), {"page": "3"}) self.assertEqual(response.status_code, 200) @@ -48,13 +48,13 @@ def test_search_filtering(self): client = Client() response = client.get(reverse("search"), {"search": "Document 1"}) self.assertEqual(response.status_code, 200) - self.assertEqual(response.context["documents"][0]["heading"], "Document 1") + self.assertEqual(response.context["page_obj"][0]["heading"], "Document 1") def test_invalid_page_number(self): client = Client() response = client.get(reverse("search"), {"page": "invalid"}) self.assertEqual(response.status_code, 200) - self.assertEqual(len(response.context["documents"]), 5) + self.assertEqual(len(response.context["page_obj"]), 5) def test_combined_filters(self): client = Client() @@ -68,7 +68,7 @@ def test_combined_filters(self): }, ) self.assertEqual(response.status_code, 200) - self.assertEqual(len(response.context["documents"]), 5) + self.assertEqual(len(response.context["page_obj"]), 5) if __name__ == "__main__": diff --git a/app/templates/app/_search_filter.html b/app/templates/app/_search_filter.html new file mode 100644 index 00000000..b3c0ff4d --- /dev/null +++ b/app/templates/app/_search_filter.html @@ -0,0 +1,13 @@ +{% spaceless %} +

    {{ field.label }}

    +
    + {% for checkbox in field %} +
    + +
    + {% endfor %} +
    +{% endspaceless %} diff --git a/app/templates/app/search.html b/app/templates/app/search.html index 7bb40e30..68110cb0 100644 --- a/app/templates/app/search.html +++ b/app/templates/app/search.html @@ -3,247 +3,90 @@ {% load i18n %} {% block content %} -
    -
    -
    -
    -
    - -
    - - - -
    -
    - -
    - -
    - {% for checkbox in filter.form.institution %} -
    - -
    -
    - {% endfor %} -
    -
    - - -
    - -
    - {% for checkbox in filter.form.subjects %} -
    - -
    -
    - {% endfor %} -
    -
    - - -
    - -
    - {% for checkbox in filter.form.languages %} -
    - -
    -
    - {% endfor %} -
    -
    -
    - - -
    - - -
    -
    - - -
    - -
    -
    -
    {% trans "Search a term" %}
    -
    -
    - -
    -
    - - {% trans 'Reset' %} -
    -
    - - - - -
    -
    - - -
    - {% for result in search_results %} - -
    -
    -

    - - {{ result.heading }} - -

    -
    - - {{ result.associated_url }} - -
    -
    - {{ result.description|truncatewords:20 }} {% trans "Read more" %} -
    -

    - {% trans "Excerpt:" %} - {{ result.search_headline|safe }} -

    - {% comment %} -

    - {{ result.rank }} -

    - {% endcomment %} -
    -
    -

    - {% if result.logo_url %} - {{ result.name }} logo - {% endif %} -

    -
    -
    - {% endfor %} -
    - - - -
    -
    -
    - -
    -
    + {# Results #} +
    + {% for result in page_obj %} +
    +
    +

    + + {{ result.heading }} + +

    + + {{ result.associated_url }} + +

    {{ result.description|truncatewords:20 }}

    + {% if result.search_headline.strip %} +
    +

    … {{ result.search_headline|safe }} …

    +
    + {% endif %} + {% comment "Left for debugging of search ranking" %} +

    {{ result.rank }}

    + {% endcomment %}
    - - - -
    - - -
    -
    -
    - -
    - {% for checkbox in filter.form.institution %} -
    - -
    -
    - {% endfor %} -
    -
    -
    - -
    - {% for checkbox in filter.form.subjects %} -
    - -
    -
    - {% endfor %} -
    -
    -
    - -
    - {% for checkbox in filter.form.languages %} -
    - -
    -
    - {% endfor %} -
    -
    -
    -
    - - {% trans 'Reset' %} -
    - + {% if result.logo_url %} +
    +
    - -
    - - + {% endif %}
    - + {% empty %} +

    {% trans "No results." %}

    + {% endfor %} +
    -
    -
    -
    + {# Pagination #} + {% include "app/_pagination.html" %} -
    -
    -
    -
    -
    + {# Filters #} +
    {# target for link at the top #} +

    {% trans "Filter results" %}

    +
    + {% include "app/_search_filter.html" with field=filter.form.institution %} + {% include "app/_search_filter.html" with field=filter.form.subjects %} + {% include "app/_search_filter.html" with field=filter.form.languages %} +
    + {% trans "Alter search terms above" %} +
    +
    + + {% trans 'Reset' %} +
    + + +
    +{% endspaceless %} {% endblock content %} diff --git a/app/templates/base.html b/app/templates/base.html index 50a96779..c349f7cb 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -41,6 +41,12 @@ aspect-ratio: auto; } +.checkbox-container { + max-height: 150px; + max-width: 600px; + overflow-y: auto; +} + {# The following two are needed for correct footer placement #} body { min-height: 100vh; From b694f279af3a1c08338673dc1a057a9162c5daa3 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Sat, 3 Aug 2024 22:49:20 +0200 Subject: [PATCH 25/68] Layout refinement of pagination --- app/templates/app/_pagination.html | 49 ++++++++++++++++++++---------- 1 file changed, 33 insertions(+), 16 deletions(-) diff --git a/app/templates/app/_pagination.html b/app/templates/app/_pagination.html index 2d71c847..b1112138 100644 --- a/app/templates/app/_pagination.html +++ b/app/templates/app/_pagination.html @@ -1,44 +1,61 @@ {% load i18n %} {% if page_obj.has_previous or page_obj.has_next %} - {% endblock header %} + +{% block error %} +{# Render the error block hidden, so that it can be updated on the front-end. #} +
    +
    + {% trans "Error" %} +
    +
    +

    {% block error_title %}Error{% endblock %}

    +

    {% block error_message %}An error occured{% endblock %}

    +     {% trans "Go to home" %} +
    +
    +{% endblock error %} + {% endspaceless %} -
    {% block content %} diff --git a/app/templates/base_error.html b/app/templates/base_error.html index 3bd861f9..1a18e526 100644 --- a/app/templates/base_error.html +++ b/app/templates/base_error.html @@ -4,17 +4,8 @@ {% block title %}{% trans "Error" %}{% endblock %} -{% block content %} - -
    -
    - {% trans "Error" %} -
    -
    -

    {% block error_title %}Error{% endblock %}

    -

    {% block error_message %}An error occured{% endblock %}

    - {% trans "Go to home" %} -
    -
    - -{% endblock content %} +{% block error %} +{% with show_error=True%} + {{ block.super }} +{% endwith %} +{% endblock %} diff --git a/app/templates/base_htmx.html b/app/templates/base_htmx.html index b156b42a..ed8628cf 100644 --- a/app/templates/base_htmx.html +++ b/app/templates/base_htmx.html @@ -5,9 +5,22 @@ {% block title %}{% trans "SADiLaR" %}{% endblock %} -{# The marking of the active/current page is done outside
    , so we repeat it here: #} +{% comment %} +Some elements outside of
    might need to be updated. + - Navbar with indication of active/current page. + - Error messages +These use hx-swap-oob so that they are swapped in from the HTMX response. +{% endcomment %} + {% include "app/_navbar_items.html" %} +{% block error %} + {% if show_error %} +

    {% block error_title %}{% endblock %}

    +

    {% block error_message %}{% endblock %}

    + {% endif %} +{% endblock %} + {% endspaceless %}
    {% block content %}{% endblock content %}
    {% spaceless %} From c3697547857641f01f1233fcb2443128c38c95e9 Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 7 Aug 2024 15:01:47 +0200 Subject: [PATCH 37/68] Avoid unnecessary spaces in HTML output --- app/templates/app/_pagination.html | 2 ++ app/templates/app/_search_filter.html | 5 +---- app/templates/app/home.html | 2 ++ app/templates/app/search.html | 13 +++++++++++++ 4 files changed, 18 insertions(+), 4 deletions(-) diff --git a/app/templates/app/_pagination.html b/app/templates/app/_pagination.html index b1112138..a8fcf67c 100644 --- a/app/templates/app/_pagination.html +++ b/app/templates/app/_pagination.html @@ -1,4 +1,5 @@ {% load i18n %} +{% spaceless %} {% if page_obj.has_previous or page_obj.has_next %} {% endif %} +{% endspaceless %} diff --git a/app/templates/app/_search_filter.html b/app/templates/app/_search_filter.html index b3c0ff4d..1330e48b 100644 --- a/app/templates/app/_search_filter.html +++ b/app/templates/app/_search_filter.html @@ -3,10 +3,7 @@

    {{ field.label }}

    {% for checkbox in field %}
    - +
    {% endfor %}
    diff --git a/app/templates/app/home.html b/app/templates/app/home.html index 74f37a4b..96bd822d 100644 --- a/app/templates/app/home.html +++ b/app/templates/app/home.html @@ -3,6 +3,7 @@ {% load i18n %} {% block content %} +{% spaceless %}
    {% trans "Welcome" %}
    @@ -87,4 +88,5 @@
    {% trans "Explore" %}
    +{% endspaceless %} {% endblock content %} diff --git a/app/templates/app/search.html b/app/templates/app/search.html index 24c62603..e6bbdb22 100644 --- a/app/templates/app/search.html +++ b/app/templates/app/search.html @@ -1,4 +1,13 @@ {% extends BASE_TEMPLATE %} +{% comment %} + +This page is bigger due to forms, etc. "{% spaceless %}" reduces unnecessary +spaces in a few places, but there are places where it can't be used. The spaces +in the headline can be relevant, e.g. term1 term2. + +The spaceless tags are kept on the left since they don't take part in the HTML +structure. +{% endcomment %} {% load static %} {% load i18n %} @@ -29,10 +38,12 @@

    {% trans "Search a term" %}

    {% endif %}
    +{% endspaceless %} {# Results #}
    {% for result in page_obj %} +{% spaceless %}

    @@ -45,6 +56,7 @@

    {{ result.associated_url }}

    {{ result.description|truncatewords:20 }}

    +{% endspaceless %} {% if result.search_headline.strip %}

    … {{ result.search_headline|safe }} …

    @@ -72,6 +84,7 @@

    {# Filters #} +{% spaceless %}
    {# target for link at the top #}

    {% trans "Filter results" %}

    From 6b40e91219329c051861e0aed8b8f046c9386adb Mon Sep 17 00:00:00 2001 From: Friedel Wolff Date: Wed, 7 Aug 2024 15:06:54 +0200 Subject: [PATCH 38/68] Improve reliability of back-forward after HTMX requests This seems to work well now, with the exception of Django (debug) error pages and the debug toolbar. This might be related to https://github.com/bigskysoftware/htmx/issues/854 --- app/templates/base.html | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/app/templates/base.html b/app/templates/base.html index c778f9f9..aee213b3 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -11,11 +11,13 @@ + {# htmx JS at the end of body seems to create problems when navigating through browser history #} + - +
    {% block header %}