fiou

incubateur-ademe · Oct 31, 2024 · b6ad3d8 · b6ad3d8
1 parent 5758ebc
commit b6ad3d8
Show file tree

Hide file tree

Showing 16 changed files with 228 additions and 159 deletions.
diff --git a/.secrets.baseline b/.secrets.baseline
@@ -178,7 +178,7 @@
         "filename": "jinja2/layout/base.html",
         "hashed_secret": "057dece35d736a3ae1e710a9cba3f080bd101cde",
         "is_verified": false,
-        "line_number": 71
+        "line_number": 75
       }
     ],
     "static/to_compile/src/analytics.ts": [
@@ -207,5 +207,5 @@
       }
     ]
   },
-  "generated_at": "2024-10-29T12:10:27Z"
+  "generated_at": "2024-10-31T14:52:03Z"
 }
diff --git a/jinja2/layout/base.html b/jinja2/layout/base.html
@@ -32,14 +32,15 @@
     </head>
 
     <body
-        class="qfdmo-flex qfdmo-flex-col"
+        class="qfdmo-flex qfdmo-flex-col {% if is_iframe %}max-h-screen{% endif %} {% if not is_carte %}formulaire{% endif %}"
         data-controller="analytics"
     >
         {% if not is_embedded %}
             {% block header %}
                 {% include "layout/header.html" %}
             {% endblock %}
         {% endif %}
+
         <main id="solutions">
             <noscript>
                 <div class="fr-container fr-my-3w">
@@ -58,13 +59,16 @@ <h3 class="fr-alert__title">Une mise à jour de votre navigateur est nécessaire
             </div>
             {% block content %}{% endblock %}
         </main>
+
         {% if not is_embedded %}
             {% block footer %}
                 {% include "layout/footer.html" %}
             {% endblock %}
         {% endif %}
+
         {% block js %}
-        {% endblock %}
+        {% endblock js %}
+
         {% if is_embedded %}
             <script
                 src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.6/iframeResizer.contentWindow.js"
@@ -76,19 +80,19 @@ <h3 class="fr-alert__title">Une mise à jour de votre navigateur est nécessaire
         {% endif %}
 
         {% if request.user.is_authenticated %}
-            <script id="posthog-user">
+            <script type="applicaton/json" id="posthog-user">
                 {
                     "username": "{{ request.user.username }}",
                     "email": "{{ request.user.email }}",
                     "admin": "{{ request.user.is_superuser|tojson }}"
                 }
             </script>
         {% endif %}
-        <script id="posthog-infos">
+
+        <script type="application/json" id="posthog-infos">
             {
                 "iframe": "{{ is_embedded|tojson }}"
             }
         </script>
-
     </body>
 </html>
diff --git a/jinja2/qfdmo/carte.html b/jinja2/qfdmo/carte.html
@@ -6,11 +6,6 @@
     {% include 'qfdmo/carte/header.html' %}
 {% endblock content_header %}
 
-{% block result %}
-    {# Panel Result #}
-    {% include 'qfdmo/carte/result.html' %}
-{% endblock result %}
-
 {% block everything_else %}
     {# Panel «Filtres» #}
     {% include 'qfdmo/carte/modals/filters.html' %}
@@ -20,9 +15,11 @@
     {% include 'qfdmo/carte/panels/legend_mobile.html' %}
 
     {# Panel À propos #}
-
     {# TODO: refacto turbo, should be moved outside of form #}
     {% include 'qfdmo/carte/modals/a_propos.html' %}
+{% endblock everything_else %}
 
+{% block form %}
+    {{ super() }}
     {{ form.epci_codes }}
-{% endblock everything_else %}
+{% endblock form %}
diff --git a/jinja2/qfdmo/carte/panels/acteur_detail.html b/jinja2/qfdmo/carte/panels/acteur_detail.html
@@ -3,34 +3,33 @@
     tabindex="0"
     id="acteurDetailsPanel"
     class="
-        md:qfdmo-absolute
-        qfdmo-right-0 qfdmo-top-0 qfdmo-bottom-0 qfdmo-z-[3000] qfdmo-left-auto
         qfdmo-bg-white qfdmo-drop-shadow-xl qfdmo-rounded-tl-sm qfdmo-rounded-bl-sm
         qfdmo-px-2w
-        max-md:qfdmo-h-screen
-        md:qfdmo-w-[400px] qfdmo-w-full
+        qfdmo-w-full
+        qfdmo-h-full
         qfdmo-flex qfdmo-flex-col
         md:qfdmo-fill-mode-forwards
+        qfdmo-transition-all
+        data-[visible=false]:qfdmo-w-0
         data-[visible=false]:qfdmo-hidden
         data-[visible=true]:qfdmo-flex
-        md:data-[visible=true]:qfdmo-animate-in
-        md:data-[visible=true]:qfdmo-ease-in
-        md:data-[visible=true]:qfdmo-slide-in-from-right-[400px]
-        md:data-[visible=exit]:qfdmo-animate-out
-        md:data-[visible=exit]:qfdmo-ease-out
-        md:data-[visible=exit]:qfdmo-slide-out-to-right-[400px]
+        data-[visible=true]:qfdmo-w-[400px]
+
     "
     data-search-solution-form-target="acteurDetailsPanel"
     data-visible="false"
 >
-        {# Action buttons : open, close, minimize #}
-        <span class="md:qfdmo-hidden qfdmo-rounded-full qfdmo-w-12w qfdmo-h-1v qfdmo-bg-[#DFDFDF] qfdmo-my-2w qfdmo-mx-auto"></span>
+        {# Barre visible en mobile uniquement #}
+        <span
+            class="md:qfdmo-hidden qfdmo-rounded-full qfdmo-w-12w qfdmo-h-1v qfdmo-bg-[#DFDFDF] qfdmo-my-2w qfdmo-mx-auto"
+        ></span>
         {# Content #}
         <div class="qfdmo-flex-grow qfdmo-relative">
             <div class="qfdmo-absolute qfdmo-inset-0 qfdmo-overflow-y-scroll">
+                {# Close button #}
                 <span
-                    class="fr-icon fr-icon-close-line qfdmo-absolute qfdmo-top-0 qfdmo-right-0 qfdmo-text-blue-france-sun-113q"
-                    data-action="click -> search-solution-form#hideActeurDetailsPanel"
+                    class="qfdmo-cursor-pointer fr-icon fr-icon-close-line qfdmo-absolute qfdmo-top-0 qfdmo-right-0 qfdmo-text-blue-france-sun-113"
+                    data-action="click->search-solution-form#hideActeurDetailsPanel"
                 >
                 </span>
                 <turbo-frame id="acteur-detail"></turbo-frame>

diff --git a/jinja2/qfdmo/carte/result.html b/jinja2/qfdmo/carte/result.html
diff --git a/jinja2/qfdmo/formulaire.html b/jinja2/qfdmo/formulaire.html
@@ -3,19 +3,31 @@
 {% include "qfdmo/partials/featureflip_inputs.html" %}
 
 {% block content_header %}
-{# Panel Filtres avancés et modifier ma recherche #}
-{% include 'qfdmo/formulaire/header.html' %}
+    {# Panel Filtres avancés et modifier ma recherche #}
+    {% include 'qfdmo/formulaire/header.html' %}
 {% endblock content_header %}
 
-
-{% block result %}
-{# Panel «Résultats de la recherche» #}
-{% include 'qfdmo/shared/_result.html' %}
-{% endblock result %}
-
 {% block everything_else %}
-{# Panel «Formulaire de recherche» #}
-{% include 'qfdmo/formulaire/search_form.html' %}
-{# Liens de pieds de page pour iframe #}
-{% include 'qfdmo/_addresses_partials/iframe_footer_links.html' %}
+    {# Panel «Formulaire de recherche» #}
+    {% include 'qfdmo/formulaire/search_form.html' %}
+
 {% endblock everything_else %}
+
+{% block content_footer %}
+    <div
+        class="qfdmo-px-2w sm:qfdmo-px-0 qfdmo-duration-300 sm:qfdmo-h-fit sm:qfdmo-mr-1w qfdmo-flex qfdmo-flex-row-reverse"
+        data-search-solution-form-target="proposeAddressPanel"
+    >
+        <a class="fr-my-1w fr-btn fr-btn--tertiary qfdmo-whitespace-nowrap qfdmo-w-full sm:qfdmo-w-max qfdmo-flex qfdmo-justify-center"
+            href="{{ url('qfdmo:address-suggestion-form') }}"
+            target="_blank"
+            rel="noreferrer"
+            aria-label="Proposer une adresse - Nouvelle fenêtre"
+        >
+            Proposer une adresse
+        </a>
+    </div>
+
+    {# Liens de pieds de page pour iframe #}
+    {% include 'qfdmo/_addresses_partials/iframe_footer_links.html' %}
+{% endblock content_footer %}
diff --git a/jinja2/qfdmo/formulaire/header.html b/jinja2/qfdmo/formulaire/header.html
@@ -1,9 +1,25 @@
 {% extends "qfdmo/shared/_header.html" %}
 
 {% block content %}
-{# Panel «Filtres avancés» #}
-{% include 'qfdmo/formulaire/advanced_filters.html' %}
+<div>
+    {# Panel «Filtres avancés» #}
+    {% include 'qfdmo/formulaire/advanced_filters.html' %}
 
-{# Panel «Modifier ma recherche» #}
-{% include 'qfdmo/formulaire/update_search.html' %}
+    {# Panel «Modifier ma recherche» #}
+    {% include 'qfdmo/formulaire/update_search.html' %}
+
+    <div data-search-solution-form-target="headerAddressPanel">
+        {# Digital #}
+        <fieldset class="fr-segmented fr-segmented--sm qfdmo-w-full ">
+            <legend class="fr-segmented__legend qfdmo-hidden">
+                {{ form.digital.label_tag() }}
+            </legend>
+            {{ form.digital }}
+        </fieldset>
+
+        <h4 class="fr-my-1w fr-h6">
+            Vos {% if form.digital.value() == "1" %}résultats{% else %}adresses{% endif %} {% if form.sous_categorie_objet.value() %}pour «{{ form.sous_categorie_objet.value() }}»{% endif %}&nbsp;:
+        </h4>
+    </div>
+</div>
 {% endblock content %}
diff --git a/jinja2/qfdmo/formulaire/search_form.html b/jinja2/qfdmo/formulaire/search_form.html
@@ -1,13 +1,15 @@
 {# Panel «Formulaire de recherche» #}
-<div class="fr-container qfdmo-duration-300 qfdmo-overflow-hidden
-            qfdmo-flex-grow"
-     data-search-solution-form-target="searchFormPanel"
+<div
+    class="
+    qfdmo-absolute qfdmo-bottom-6w qfdmo-top-0 qfdmo-left-0 qfdmo-right-0 qfdmo-bg-white
+    qfdmo-flex-grow
+    qfdmo-px-1v
+    "
+    data-search-solution-form-target="searchFormPanel"
 >
-    <h1 class="qfdmo-hidden">Longue vie aux objets</h1>
-
-    <div class="qfdmo-h-full qfdmo-flex qfdmo-flex-row" id='boo'>
-
-        <div class="qfdmo-flex qfdmo-flex-col qfdmo-w-full sm:qfdmo-w-[604px] qfdmo-h-full" data-test-id="form-content">
+    <h1 class="qfdmo-sr-only">Longue vie aux objets</h1>
+    <div class="qfdmo-h-full qfdmo-flex qfdmo-flex-row">
+        <div class="qfdmo-flex qfdmo-flex-col qfdmo-w-full sm:qfdmo-max-w-[604px] qfdmo-h-full" data-test-id="form-content">
             {# TODO: REFACTO OVERFLOW : supprimer les overflow et le padding left #}
             <div class="qfdmo-flex-grow qfdmo-overflow-y-auto qfdmo-overflow-x-hidden qfdmo-pl-3v">
                 {# Direction #}
@@ -40,7 +42,7 @@ <h1 class="qfdmo-hidden">Longue vie aux objets</h1>
                     {% endwith %}
                 </div>
             </div>
-            <div class="fr-my-1w qfdmo-w-full qfdmo-flex qfdmo-flex-col sm:qfdmo-max-w-[604px] qfdmo-mx-auto">
+            <div class="fr-my-1w qfdmo-w-full qfdmo-flex qfdmo-flex-col sm:qfdmo-max-w-[604px] qfdmo-mx-auto qfdmo-pl-3v">
 
                 {# Advanced filters #}
                 <button

diff --git a/jinja2/qfdmo/partials/featureflip_inputs.html b/jinja2/qfdmo/partials/featureflip_inputs.html
@@ -1,16 +1,21 @@
 {% if is_iframe %}
     <input type="hidden" name="iframe">
 {% endif %}
+
 {% if is_carte %}
     <input type="hidden" name="carte" data-search-solution-form-target='carte'>
 {% endif %}
+
 {% if request.GET.get('limit') %}
     <input type="hidden" name="limit" value="{{ request.GET.get('limit') }}">
 {% endif %}
+
 {% if request.GET.get('address_placeholder') %}
     <input type="hidden" name="address_placeholder" value="{{ request.GET.get('address_placeholder') }}">
 {% endif %}
+
 <input type="hidden" name="r" value="{{ range(1000) | random }}">
+
 {% if request.GET.get("first_dir") %}
     <input type="hidden" name="first_dir" value="{{ request.GET.get("first_dir") }}">
 {% endif %}
diff --git a/jinja2/qfdmo/shared/_layout.html b/jinja2/qfdmo/shared/_layout.html
@@ -1,45 +1,46 @@
 {% extends base_template %}
 
  {% block content %}
-     <turbo-frame id="turboForm">
+     <turbo-frame id="mapContainer">
          {# Controleur général de gestion de la navigation et du formulaire #}
 
          <form
             {% include "qfdmo/shared/_search_form_data-attributes.html" %}
             class="
-            qfdmo-min-h-screen
             qfdmo-flex qfdmo-flex-col qfdmo-flex-auto
-            qfdmo-relative"
+            qfdmo-relative
+            "
          >
-             {% include "qfdmo/partials/featureflip_inputs.html" %}
-
-             {% block content_header %}
-                {# Panel Header #}
-                {# TODO: refacto turbo, should be moved outside of form #}
-                {% include 'qfdmo/carte/header.html' %}
-             {% endblock content_header %}
-
-             {% block result %}
-             {# Panel Result #}
-             {% include 'qfdmo/carte/result.html' %}
-             {% endblock result %}
-
-             {% block everything_else %}
-             {# Panel «Filtres» #}
-             {% include 'qfdmo/carte/modals/filters.html' %}
-
-             {# Panel «Legend» #}
-             {# TODO: refacto turbo, should be moved outside of form #}
-             {% include 'qfdmo/carte/panels/legend_mobile.html' %}
-
-             {# Panel À propos #}
-
-             {# TODO: refacto turbo, should be moved outside of form #}
-             {% include 'qfdmo/carte/modals/a_propos.html' %}
-
-             {{ form.epci_codes }}
-             {% endblock %}
-
+             <section class="map-grid">
+                <header>
+                    {% block content_header %}
+                    {% endblock content_header %}
+                </header>
+
+                <main>
+                    {% block result %}
+                        {% include 'qfdmo/shared/_result.html' %}
+                    {% endblock result %}
+
+
+                    {% block everything_else %}
+                    {% endblock everything_else %}
+
+                    {% block form %}
+                        {% include "qfdmo/partials/featureflip_inputs.html" %}
+                        {{ form.bounding_box }}
+                    {% endblock form %}
+                </main>
+                <aside>
+                    {% include "qfdmo/carte/panels/acteur_detail.html" %}
+                </aside>
+
+                <footer>
+                {% block content_footer %}
+                {% endblock content_footer %}
+                </footer>
+
+             </section>
          </form>
      </turbo-frame>