From 32cec2e7313e7d716d455d9b4d4f8c89f489ad99 Mon Sep 17 00:00:00 2001
From: janphilippweinsheimer <janorga.weinsheimer@web.de>
Date: Thu, 7 Mar 2024 14:20:45 +0100
Subject: [PATCH] times errors and cards

---
 app.py                                | 17 ++++-
 templates/components/habit_lists.html | 19 ++++--
 templates/edit-habit.html             | 93 ++++++++++++++-------------
 3 files changed, 76 insertions(+), 53 deletions(-)

diff --git a/app.py b/app.py
index 75dd599..5b5798d 100644
--- a/app.py
+++ b/app.py
@@ -208,9 +208,15 @@ def habit_create():
     except ValueError:
         errors['list_query'] = 'Die Anzahl muss eine Zahl sein.'
 
-    # Check if unit is day and times is one
+    # Check if times is possible to achieve
     if unit == 'Tag' and times != 1:
         errors['times'] = 'Die Anzahl muss 1 sein, wenn das Habit täglich ist.'
+    if unit == 'Woche' and times > 7:
+        errors['times'] = 'Die Anzahl darf höchstens 7 sein, wenn das Habit wöchentlich ist.'
+    if unit == 'Monat' and times > 31:
+        errors['times'] = 'Die Anzahl darf höchstens 31 sein, wenn das Habit monatlich ist.'
+    if unit == 'Jahr' and times > 365:
+        errors['times'] = 'Die Anzahl darf höchstens 365 sein, wenn das Habit jährlich ist.'
 
     if errors:
         return render_template(
@@ -384,8 +390,15 @@ def edit_habit_change():
     except ValueError:
         errors['list_query'] = 'Die Anzahl muss eine Zahl sein.'
 
+    # Check if times is possible to achieve
     if unit == 'Tag' and times != 1:
         errors['times'] = 'Die Anzahl muss 1 sein, wenn das Habit täglich ist.'
+    if unit == 'Woche' and times > 7:
+        errors['times'] = 'Die Anzahl darf höchstens 7 sein, wenn das Habit wöchentlich ist.'
+    if unit == 'Monat' and times > 31:
+        errors['times'] = 'Die Anzahl darf höchstens 31 sein, wenn das Habit monatlich ist.'
+    if unit == 'Jahr' and times > 365:
+        errors['times'] = 'Die Anzahl darf höchstens 365 sein, wenn das Habit jährlich ist.'
 
     if errors:
         return render_template(
@@ -396,7 +409,7 @@ def edit_habit_change():
             note=habit.note,
             times=habit.times,
             unit=units[habit.unit],
-            errors={}
+            errors=errors
         )
 
     # Map unit to integer
diff --git a/templates/components/habit_lists.html b/templates/components/habit_lists.html
index 56a4017..867d2df 100644
--- a/templates/components/habit_lists.html
+++ b/templates/components/habit_lists.html
@@ -70,13 +70,13 @@
                     {{ habit_list.description }}
                 </div>
 
-                <div class="col-2">
+                <div class="col-1">
                     <button type="button" class="btn btn-xs me-3" data-bs-toggle="modal"
                             data-bs-target="#listenModal" style="width: 40px; height: 40px"
                             onclick="{
                                 localStorage.setItem('selectedListId', {{ habit_list.id }});
                             }">
-                            <!---onclick="setSelectedListId({{ habit_list.id }})"-->
+                        <!---onclick="setSelectedListId({{ habit_list.id }})"-->
                         <i class="bi bi-trash3"></i>
                     </button>
                 </div>
@@ -91,7 +91,8 @@
                     <div class="avatar-stack">
                         {% for user in habit_list.get_users() %}
                         {% if current_user.id != user.id %}
-                        <img class="avatar" src="/{{user.profile_image}}" data-toggle="tooltip" data-placement="top" title="{{user.name}}"/>
+                        <img class="avatar" src="/{{user.profile_image}}" data-toggle="tooltip" data-placement="top"
+                             title="{{user.name}}"/>
                         {% endif %}
                         {% endfor %}
                     </div>
@@ -100,7 +101,8 @@
 
                 <!-- Knopf für das Hinzufügen einer Person zur gemeinsamen Liste -->
                 <div class="col">
-                    <a href="/users?habit_list={{habit_list.id}}" style="width: 40px; height: 40px; min-height: 3em;" data-toggle="tooltip" data-placement="top" title="Benutzer einladen">
+                    <a href="/users?habit_list={{habit_list.id}}" style="width: 40px; height: 40px; min-height: 3em;"
+                       data-toggle="tooltip" data-placement="top" title="Benutzer einladen">
 
                         <i class="bi bi-plus-circle"></i>
 
@@ -146,7 +148,8 @@
                     </div>
 
                     <!-- Streak -->
-                    <div class="col-2" id="streak-{{ habit.id }}" style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
+                    <div class="col-2" id="streak-{{ habit.id }}"
+                         style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis">
                         {% if not habit.streak == 0 %}
                         {{ habit.streak }} 🔥
                         {% endif %}
@@ -160,8 +163,9 @@
                     </button>
 
                     <!-- Knopf für das Bearbeiten der Gewohnheit -->
-                    <a type="button" class="btn" href="{{ url_for('edit_habit') }}?habit={{ habit.id }}" aria-current="page"
-                            style="width: 40px; height: 40px; min-height: 3em;">
+                    <a type="button" class="btn" href="{{ url_for('edit_habit') }}?habit={{ habit.id }}"
+                       aria-current="page"
+                       style="width: 40px; height: 40px; min-height: 3em;">
 
                         <i class="bi bi-pencil"></i>
                     </a>
@@ -196,4 +200,5 @@
             function setSelectedListId(listId) {
                 selectedlistId = listId;
             }
+
 </script>
diff --git a/templates/edit-habit.html b/templates/edit-habit.html
index ccf95ac..d258e75 100644
--- a/templates/edit-habit.html
+++ b/templates/edit-habit.html
@@ -1,42 +1,45 @@
 {% extends 'index.html' %}
 
 {% block content %}
+<div class="card bg-light p-5 mt-5">
+    <h1>Habit Bearbeiten📋</h1>
 
-<h1 class="mt-5">Habit Bearbeiten📋</h1>
-
-<form action="/edit-habit" method="POST">
-    <div class="mb-3">
-        <label for="name" class="form-label">Name der Gewohnheit</label>
-        <input type="text" class="form-control {% if errors.get('name') %} is-invalid {% endif %}" id="name" name="name" value="{{name}}">
-        <div class="invalid-feedback">
-            {{ errors.get('name', '') }}
-        </div>
-    </div>
-    <div class="mb-3">
-        <label for="note" class="form-label">Beschreibung</label>
-        <input type="text" class="form-control {% if errors.get('note') %} is-invalid {% endif %}" id="note" name="note" value="{{note}}">
-        <div class="invalid-feedback">
-            {{ errors.get('note', '') }}
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="mb-3 col-2">
-            <label for="times" class="form-label">Häufigkeit</label>
-            <input type="number" min="1" class="form-control {% if errors.get('times') %} is-invalid {% endif %}" id="times" name="times" value="{{times}}">
+    <form action="/edit-habit" method="POST">
+        <div class="mb-3">
+            <label for="name" class="form-label">Name der Gewohnheit</label>
+            <input type="text" class="form-control {% if errors.get('name') %} is-invalid {% endif %}" id="name"
+                   name="name" value="{{name}}">
             <div class="invalid-feedback">
-                {{ errors.get('times', '') }}
+                {{ errors.get('name', '') }}
             </div>
         </div>
-        <div class="mb-3 col-10">
-            <label for="unit" class="form-label">Im Zeitraum</label>
-            <select class="form-select {% if errors.get('unit') %} is-invalid {% endif %}" id="unit" name="unit">
-                <option value="Tag">Tag</option>
-                <option value="Woche">Woche</option>
-                <option value="Monat">Monat</option>
-                <option value="Jahr">Jahr</option>
-            </select>
-            <script>
+        <div class="mb-3">
+            <label for="note" class="form-label">Beschreibung</label>
+            <input type="text" class="form-control {% if errors.get('note') %} is-invalid {% endif %}" id="note"
+                   name="note" value="{{note}}">
+            <div class="invalid-feedback">
+                {{ errors.get('note', '') }}
+            </div>
+        </div>
+
+        <div class="row">
+            <div class="mb-3 col-2">
+                <label for="times" class="form-label">Häufigkeit</label>
+                <input type="number" min="1" class="form-control {% if errors.get('times') %} is-invalid {% endif %}"
+                       id="times" name="times" value="{{times}}">
+                <div class="invalid-feedback">
+                    {{ errors.get('times', '') }}
+                </div>
+            </div>
+            <div class="mb-3 col-10">
+                <label for="unit" class="form-label">Im Zeitraum</label>
+                <select class="form-select {% if errors.get('unit') %} is-invalid {% endif %}" id="unit" name="unit">
+                    <option value="Tag">Tag</option>
+                    <option value="Woche">Woche</option>
+                    <option value="Monat">Monat</option>
+                    <option value="Jahr">Jahr</option>
+                </select>
+                <script>
                 document.addEventListener('DOMContentLoaded', (event) => {
                     let selectedElement = document.getElementById('unit');
 
@@ -47,18 +50,19 @@
                         }
                     }
                 });
-            </script>
-            <div class="invalid-feedback">
-                {{ errors.get('unit', '') }}
+
+                </script>
+                <div class="invalid-feedback">
+                    {{ errors.get('unit', '') }}
+                </div>
             </div>
         </div>
-    </div>
 
-    <input type="hidden" name="habit" id="habit" class="{% if errors.get('habit') %} is-invalid {% endif %}">
-    <div class="invalid-feedback">
-        {{ errors.get('list_query', '') }}
-    </div>
-    <script>
+        <input type="hidden" name="habit" id="habit" class="{% if errors.get('habit') %} is-invalid {% endif %}">
+        <div class="invalid-feedback">
+            {{ errors.get('list_query', '') }}
+        </div>
+        <script>
         document.addEventListener('DOMContentLoaded', function() {
             // Extracting the list-query from the URL
             var listQuery = new URLSearchParams(window.location.search).get('habit');
@@ -75,8 +79,9 @@
             // Setting the list-query as the value of the hidden input field
             document.getElementById('habit').value = listQuery;
         });
-    </script>
-    <button type="submit" class="btn btn-primary">Submit</button>
-</form>
 
+        </script>
+        <button type="submit" class="btn btn-primary">Submit</button>
+    </form>
+</div>
 {% endblock %}
\ No newline at end of file