Remove unused parts and add new smaller components

slapp/explorer/urls.py

@@ -10,16 +10,14 @@
     path("map/", views.MapGLView.as_view(), name="map"),
     path("details/", views.details_list, name="details"),
     path("details/csv/", views.details_csv, name="details-csv"),
-    path("esm_mode/<int:robustness>/", views.choose_esm_mode, name="esm_mode"),
+    path("esm_mode/", views.choose_esm_mode, name="esm_mode"),
     path("parameters_variation/", views.optimization_parameters, name="parameters_variation"),
     path("results_variation/", views.optimization_results, name="results_variation"),
     path("results_robustness/", views.robustness, name="results_robustness"),
     path("parameters_robustness/", views.robustness_parameters, name="parameters_robustness"),
     path("added_value/", views.added_value, name="added_value"),
 ]
 
-htmx_urlpatterns = [
-    path("search-municipality/", views.search_municipality, name="search-municipality"),
-]
+htmx_urlpatterns = []
 
 urlpatterns += htmx_urlpatterns

slapp/explorer/views.py

@@ -29,11 +29,13 @@ def start_page(request: HttpRequest) -> HttpResponse:
     next_url = reverse("explorer:map")
     prev_url = None
     active_tab = "step_1_start"
+    sidepanel = False
 
     context = {
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
     return render(request, "pages/home.html", context)
 
@@ -45,10 +47,12 @@ class MapGLView(TemplateView, views.MapEngineMixin):
     next_url = reverse_lazy("explorer:details")
     prev_url = reverse_lazy("explorer:home")
     active_tab = "step_2_today"
+    sidepanel = True
     extra_context = {
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
 
     def get_context_data(self, **kwargs) -> dict[str, Any]:
@@ -99,38 +103,22 @@ def details_list(request: HttpRequest) -> HttpResponse:
     else:
         municipalities = None
 
-    next_url = reverse("explorer:esm_mode", args=[0])
+    next_url = reverse("explorer:esm_mode")
     prev_url = reverse("explorer:map")
     active_tab = "step_3_details"
+    sidepanel = True
 
     context = {
         "municipalities": municipalities,
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
 
     return render(request, "pages/details.html", context)
 
 
-def search_municipality(request: HttpRequest) -> HttpResponse:
-    """Return list of municipalities for given search text."""
-    search_text = request.POST.get("search")
-    param_string = request.POST.get("param_string")
-
-    first_item = param_string in ["/explorer/details/", "/explorer/parameters_variation/"]
-
-    new_param_string = param_string + "?id=" if first_item else param_string + "&id="
-
-    # look up all municipalities that contain the text
-    results = Municipality.objects.filter(name__icontains=search_text)
-    return render(
-        request,
-        "pages/partials/search-results.html",
-        {"results": results, "new_param_string": new_param_string},
-    )
-
-
 def details_csv(request: HttpRequest) -> HttpResponse:
     """Return details as CSV for given municipalities."""
     ids = request.GET.getlist("id")
@@ -157,21 +145,31 @@ def details_csv(request: HttpRequest) -> HttpResponse:
     return response
 
 
-def choose_esm_mode(request: HttpRequest, robustness: int) -> HttpResponse:
+def choose_esm_mode(request: HttpRequest) -> HttpResponse:
     """Render page for choosing esm mode (robust or variation)."""
-    next_url = reverse("explorer:parameters_variation")
+    next_url = None
     prev_url = reverse("explorer:details")
     active_tab = "step_4_mode"
-
-    if robustness == 1:
+    sidepanel = True
+    render_template = "pages/esm_mode.html"
+    radio_button_value = int(request.GET.get("esm_choice_radio", 0))
+    variation_chosen = 1
+    robustness_chosen = 2
+
+    if radio_button_value == variation_chosen:
+        next_url = reverse("explorer:parameters_variation")
+        render_template = "pages/partials/next_wizard.html"
+    if radio_button_value == robustness_chosen:
         next_url = reverse("explorer:parameters_robustness")
+        render_template = "pages/partials/next_wizard.html"
 
     context = {
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
-    return render(request, "pages/esm_mode.html", context)
+    return render(request, render_template, context)
 
 
 def optimization_parameters(request: HttpRequest) -> HttpResponse:
@@ -186,14 +184,16 @@ def optimization_parameters(request: HttpRequest) -> HttpResponse:
         municipalities = None
 
     next_url = reverse("explorer:results_variation")
-    prev_url = reverse("explorer:esm_mode", args=[0])
+    prev_url = reverse("explorer:esm_mode")
     active_tab = "step_5_parameters"
+    sidepanel = True
 
     context = {
         "municipalities": municipalities,
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
     return render(request, "pages/parameters_variation.html", context)
 
@@ -237,13 +237,15 @@ def optimization_results(request: HttpRequest) -> HttpResponse:
     next_url = reverse("explorer:added_value")
     prev_url = reverse("explorer:parameters_variation")
     active_tab = "step_6_results"
+    sidepanel = True
     request.session["prev_before_added_value"] = "variation"
 
     context = {
         "municipalities": municipalities,
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
 
     return render(request, "pages/results_variation.html", context)
@@ -252,13 +254,15 @@ def optimization_results(request: HttpRequest) -> HttpResponse:
 def robustness_parameters(request: HttpRequest) -> HttpResponse:
     """Render page for robustness parameters."""
     next_url = reverse("explorer:results_robustness")
-    prev_url = reverse("explorer:esm_mode", args=[1])
+    prev_url = reverse("explorer:esm_mode")
     active_tab = "step_5_parameters"
+    sidepanel = True
 
     context = {
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
     return render(request, "pages/parameters_robustness.html", context)
 
@@ -321,13 +325,15 @@ def robustness(request: HttpRequest) -> HttpResponse:
     next_url = reverse("explorer:added_value")
     prev_url = reverse("explorer:parameters_robustness")
     active_tab = "step_6_results"
+    sidepanel = True
     request.session["prev_before_added_value"] = "robustness"
 
     context = {
         "municipalities": municipalities,
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
 
     return render(request, "pages/results_robustness.html", context)
@@ -338,6 +344,7 @@ def added_value(request: HttpRequest) -> HttpResponse:
     next_url = None
     prev_url = reverse("explorer:results_variation")
     active_tab = "step_7_added_value"
+    sidepanel = True
 
     if request.session.get("prev_before_added_value") == "robustness":
         prev_url = reverse("explorer:results_robustness")
@@ -346,5 +353,6 @@ def added_value(request: HttpRequest) -> HttpResponse:
         "next_url": next_url,
         "prev_url": prev_url,
         "active_tab": active_tab,
+        "has_sidepanel": sidepanel,
     }
     return render(request, "pages/added_value.html", context)

slapp/static/scss/app.scss

@@ -3,6 +3,7 @@
 @import "../vendors/bootstrap/scss/bootstrap";
 
 
+@import 'components/navbar.scss';
 @import 'components/link_buttons';
 @import 'components/sliders';
 @import 'components/wizard';

slapp/static/scss/components/_navbar.scss

@@ -0,0 +1,14 @@
+.navbar {
+
+    &__wrap {
+        @extend .container-fluid;
+        @extend .w-100;
+        @extend .position-fixed;
+        @extend .bg-white;
+        top: 0px;
+        height: 3.75rem;
+        box-shadow: $box-shadow-sm;
+        z-index: 1000;
+    }
+
+}

slapp/static/scss/components/_wizard.scss

@@ -1,15 +1,19 @@
 .wizard {
-    @extend .w-100;
-    @extend .position-relative;
-    height: 3.75rem;
-    box-shadow: $box-shadow-sm;
-    z-index: 1000;
+    padding-top: 7.5rem;
 
     &__wrap {
       @extend .container-fluid;
       @extend .d-flex;
       @extend .flex-row;
       @extend .justify-content-between;
+      @extend .bg-white;
+      @extend .position-fixed;
+      @extend .w-100;
+
+    height: 3.75rem;
+    box-shadow: $box-shadow-sm;
+    z-index: 1000;
+    top: 56px;
     }
 
     &__back,

slapp/templates/base.html

@@ -51,7 +51,7 @@
         hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'>
     <div class="mb-1">
       <nav class="navbar navbar-expand-md navbar-light bg-light">
-        <div class="container-fluid">
+        <div class="navbar__wrap">
           <button class="navbar-toggler navbar-toggler-right"
                   type="button"
                   data-bs-toggle="collapse"
@@ -214,8 +214,23 @@
         </div>
       </div>
     </header>
-    {% block content %}
-    {% endblock content %}
+    <div class="container-fluid h-100">
+      {% if has_sidepanel %}
+        <div class="row h-100">
+          <div class="col-3 sidebar pt-3 border-end border-2">
+            {% block sidebar_content %}
+            {% endblock sidebar_content %}
+          </div>
+          <div class="col-9">
+            {% block content %}
+            {% endblock content %}
+          </div>
+        </div>
+      {% else %}
+        {% block content_no_sidebar %}
+        {% endblock content_no_sidebar %}
+      {% endif %}
+    </div>
     <!-- /container -->
     {% block modal %}
     {% endblock modal %}

slapp/templates/pages/added_value.html

@@ -2,6 +2,10 @@
 
 {% load humanize %}
 
+{% block sidebar_content %}
+  <h4 class="text-center">Informationen zur Wertschöpfung</h4>
+  <p class="text-center">{% lorem %}</p>
+{% endblock sidebar_content %}
 {% block content %}
   <div class="container">
     <h1 mt-3>Wertschöpfung</h1>

slapp/templates/pages/details.html

@@ -2,24 +2,13 @@
 
 {% load humanize %}
 
+{% block sidebar_content %}
+  <h4 class="text-center">Informationen zu den Details</h4>
+  <p class="text-center">{% lorem %}</p>
+{% endblock sidebar_content %}
 {% block content %}
   <div class="container">
     <h1 class="mt-4">Detailansicht</h1>
-    <div class="row mt-4">
-      <div class="col-4">
-        <form autocomplete="off">
-          <input type="text"
-                 hx-post="{% url 'explorer:search-municipality' %}"
-                 hx-target='#results'
-                 hx-trigger="keyup changed delay:500ms"
-                 hx-vals='{"param_string": "{{ request.get_full_path }}"}'
-                 name="search"
-                 class="form-control mr-2"
-                 placeholder="Gemeinden suchen & hinzufügen" />
-        </form>
-        <div id="results"></div>
-      </div>
-    </div>
     {% if municipalities %}
       <div class="row mt-4 g-0" id="municipality-results">
         <div class="col-3">
@@ -45,20 +34,7 @@ <h1 class="mt-4">Detailansicht</h1>
         {% for municipality in municipalities %}
           <div class="col-2 text-truncate">
             <ul class="list-group rounded-0">
-              <li class="list-group-item text-end fw-bold bg-secondary text-white">
-                {{ municipality.name }}
-                <a class="icon-link text-white"
-                   href="{% url 'explorer:details' %}?{% for municipality_ids in municipalities %}{% if municipality_ids.id != municipality.id %}id={{ municipality_ids.id }}&{% endif %}{% endfor %}">
-                  <svg xmlns="http://www.w3.org/2000/svg"
-                       width="16"
-                       height="16"
-                       fill="currentColor"
-                       class="bi bi-x-circle-fill"
-                       viewBox="0 0 16 16">
-                    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293z" />
-                  </svg>
-                </a>
-              </li>
+              <li class="list-group-item text-end fw-bold bg-secondary text-white">{{ municipality.name }}</li>
               <li class="list-group-item text-end">{{ municipality.area_rounded|intcomma }}</li>
               <li class="list-group-item text-end fw-bold">{{ municipality.total_net|intcomma }}</li>
               <li class="list-group-item text-end">{{ municipality.pvground_net|intcomma }}</li>
@@ -99,14 +75,6 @@ <h1 class="mt-4">Detailansicht</h1>
         </div>
       </div>
       <a href="{% url 'explorer:details-csv' %}?{% for municipality_ids in municipalities %}id={{ municipality_ids.id }}&{% endfor %}">Als CSV herunterladen</a>
-      <div class="mt-4">
-        <a class="btn btn-primary"
-           href="{% url 'explorer:esm_mode' robustness=0 %}"
-           role="button">Mit Energiesystemoptimierung für diese
-        Gemeinden beginnen</a>
-      </div>
-    {% else %}
-      <div class="mt-3">Fügen Sie zunächst Gemeinden für die Optimierung hinzu.</div>
     {% endif %}
   </div>
 {% endblock content %}