diff --git a/frontend/src/components/trees/TreeDescription.svelte b/frontend/src/components/trees/TreeDescription.svelte new file mode 100644 index 0000000..35e4148 --- /dev/null +++ b/frontend/src/components/trees/TreeDescription.svelte @@ -0,0 +1,21 @@ + + + + + {@html renderedDescription} + + diff --git a/frontend/src/components/trees/TreeMetric.svelte b/frontend/src/components/trees/TreeMetric.svelte index 6ae37e1..b3526a9 100644 --- a/frontend/src/components/trees/TreeMetric.svelte +++ b/frontend/src/components/trees/TreeMetric.svelte @@ -8,56 +8,94 @@ $: percent = Math.min(100, Math.max(0, (value / max) * 100)); -
- -
- - - - - - {#if position === 'right'} - -
-
+
+ +
+ + -
- {:else if position === 'top'} - -
-
-
- {:else if position === 'bottom'} - -
+ + + + {#if position === 'right'} +
+
+
+ {:else if position === 'top'}
-
- {/if} -
+ class="absolute top-[-10px] left-1/2 transform -translate-x-1/2 h-[5px] w-14 bg-gray-200 rounded" + > +
+
+ {:else if position === 'bottom'} +
+
+
+ {/if} +
- -

{label}

-

{value} {unit}

+ +
+

+ {#if label === 'Kronendurchmesser'} + Kronen-
durchmesser + {:else if label === 'Stammdurchmesser'} + Stamm-
durchmesser + {:else} + {label} + {/if} +

+

+ {value} + {unit} +

+
+
+ + diff --git a/frontend/src/components/trees/TreeMetricsView.svelte b/frontend/src/components/trees/TreeMetricsView.svelte new file mode 100644 index 0000000..b3e1873 --- /dev/null +++ b/frontend/src/components/trees/TreeMetricsView.svelte @@ -0,0 +1,47 @@ + + +{#if $isMobile} + +
+
+ + + +
+
+{:else} + +
+ + + +
+{/if} diff --git a/frontend/src/components/trees/TreeWaterings.svelte b/frontend/src/components/trees/TreeWaterings.svelte index 7fa194f..b687773 100644 --- a/frontend/src/components/trees/TreeWaterings.svelte +++ b/frontend/src/components/trees/TreeWaterings.svelte @@ -1,5 +1,5 @@ @@ -85,26 +97,43 @@ {#if activeTabIndex === 0}
-

🌳 Über diesen Baum

+

+ 🌳 Über diesen Baum +

+
+ +
+ + + +
+
+ +
+ +
+

🏙️ Wirkung auf das Stadtklima

-
- - - -
+ + Dieser Baum beeinflusst seine Umgebung positiv: Er spendet Schatten, reguliert das + Mikroklima, verbessert die Luftqualität und bietet Lebensraum für Tiere und + Insekten. Weitere Informationen folgen in einem späteren Update.

Bis + dahin kannst du dir die + + Stadtklimaanalyse Bielefeld + durchlesen, um zu erfahren, warum du dank der Stadtbäume in Bielefeld im Sommer + besser schlafen kannst. 🤓 +

@@ -125,10 +154,7 @@

🚿 Gießungen

- historyAccordionRef?.updateHeightExternally()} - /> +
diff --git a/preparation/input_templates/tree_species.template.json b/preparation/input_templates/tree_species.template.json new file mode 100644 index 0000000..fb2ca1e --- /dev/null +++ b/preparation/input_templates/tree_species.template.json @@ -0,0 +1,17 @@ +[ + { + "tree_type_botanic": "Ulmus glabra", + "description_emotional": "Ich bin die Berg-Ulme – standfest und elegant zugleich! \nMeine breite Krone spendet Schatten an steilen Hängen, und mein Laub raschelt besonders schön im Wind. \nWer einmal unter mir sitzt, spürt die Ruhe des Waldes ganz besonders.", + "description_neutral": "Die Berg-Ulme ist ein mitteleuropäischer Laubbaum mit asymmetrischen, grob gezähnten Blättern. \nSie bevorzugt feuchte, kühle Standorte und ist eine typische Baumart in Schlucht- und Hangwäldern." + }, + { + "tree_type_botanic": "Sorbus aria", + "description_emotional": "Schau mich an – mit meinen weißen Blattunterseiten glänze ich im Sonnenlicht! \nIch komme gut mit Hitze klar und wachse selbst dort, wo andere längst aufgegeben haben.", + "description_neutral": "Die Mehlbeere ist ein trockenheitsresistenter Baum mit ovalen, filzig-weiß behaarten Blättern. \nSie wächst häufig auf mageren Standorten und trägt orange-rote Beeren, die für viele Vögel eine wichtige Nahrungsquelle sind." + }, + { + "tree_type_botanic": "Fagus sylvatica", + "description_emotional": "Ich bin die Buche – Mutter des Waldes, tief verwurzelt und voller Geschichten.", + "description_neutral": "Die Rotbuche ist die häufigste Laubbaumart Mitteleuropas und bildet dichte, schattige Buchenwälder." + } +] diff --git a/preparation/input_templates/tree_species.template.yaml b/preparation/input_templates/tree_species.template.yaml new file mode 100644 index 0000000..aea8c37 --- /dev/null +++ b/preparation/input_templates/tree_species.template.yaml @@ -0,0 +1,29 @@ +# YAML-Vorlage für Baumarten-Beschreibungen +# Jeder Eintrag wird eindeutig durch den botanischen Namen (tree_type_botanic) identifiziert. +# Für jede Baumart müssen beide Felder – description_emotional und description_neutral – ausgefüllt werden. +# Für mehrzeiligen Fließtext wird der YAML-Operator > verwendet. +# Die Reihenfolge ist beliebig, Duplikate sind nicht erlaubt. + +- tree_type_botanic: Ulmus glabra # Botanischer Name (muss exakt mit 'trees.tree_type_botanic' übereinstimmen) + description_emotional: > + Ich bin die Berg-Ulme – standfest und elegant zugleich! + Meine breite Krone spendet Schatten an steilen Hängen, und mein Laub raschelt besonders schön im Wind. + Wer einmal unter mir sitzt, spürt die Ruhe des Waldes ganz besonders. + description_neutral: > + Die Berg-Ulme ist ein mitteleuropäischer Laubbaum mit asymmetrischen, grob gezähnten Blättern. + Sie bevorzugt feuchte, kühle Standorte und ist eine typische Baumart in Schlucht- und Hangwäldern. + +- tree_type_botanic: Sorbus aria + description_emotional: > + Schau mich an – mit meinen weißen Blattunterseiten glänze ich im Sonnenlicht! + Ich komme gut mit Hitze klar und wachse selbst dort, wo andere längst aufgegeben haben. + description_neutral: > + Die Mehlbeere ist ein trockenheitsresistenter Baum mit ovalen, filzig-weiß behaarten Blättern. + Sie wächst häufig auf mageren Standorten und trägt orange-rote Beeren, die für viele Vögel eine wichtige Nahrungsquelle sind. + +# Weitere Einträge … +# - tree_type_botanic: Fagus sylvatica +# description_emotional: > +# Ich bin die Buche – Mutter des Waldes, tief verwurzelt und voller Geschichten. +# description_neutral: > +# Die Rotbuche ist die häufigste Laubbaumart Mitteleuropas und bildet dichte, schattige Buchenwälder. \ No newline at end of file diff --git a/preparation/update_tree_species.py b/preparation/update_tree_species.py new file mode 100644 index 0000000..4980499 --- /dev/null +++ b/preparation/update_tree_species.py @@ -0,0 +1,39 @@ +import os +import sys +import yaml +import json +from supabase import create_client, Client +from utils.env import load_env + +# Load environment variables from .env.local (if available), otherwise .env – relative to project root +load_env() + +# Get Supabase URL and service role key from environment +url = os.environ.get("VITE_SUPABASE_URL") +key = os.environ.get("SUPABASE_SERVICE_ROLE_KEY") + +if not url or not key: + raise ValueError("VITE_SUPABASE_URL and SUPABASE_SERVICE_ROLE_KEY must be set") + +# Create Supabase client +supabase: Client = create_client(url, key) + +# Ensure a file path was passed as argument +if len(sys.argv) != 2: + raise ValueError("Usage: python update_tree_species.py ") + +path_to_file = sys.argv[1] + +# Load data file (YAML or JSON) +with open(path_to_file, encoding="utf-8") as f: + if path_to_file.endswith((".yaml", ".yml")): + data = yaml.safe_load(f) + elif path_to_file.endswith(".json"): + data = json.load(f) + else: + raise ValueError("File must be .yaml, .yml or .json") + +# Upsert records into the 'tree_species' table using 'tree_type_botanic' as unique key +for item in data: + supabase.table("tree_species").upsert(item, on_conflict="tree_type_botanic").execute() + print(f"{item['tree_type_botanic']} ✔") \ No newline at end of file diff --git a/supabase/migrations/20250720202345_create-tree-species.sql b/supabase/migrations/20250720202345_create-tree-species.sql new file mode 100644 index 0000000..29077c2 --- /dev/null +++ b/supabase/migrations/20250720202345_create-tree-species.sql @@ -0,0 +1,14 @@ +-- Tabelle zur Beschreibung von Baumarten (botanisch: "species") +create table public.tree_species ( + id bigint generated by default as identity primary key, + created_at timestamp with time zone not null default now(), + + -- Botanischer Name, identisch zu `tree_type_botanic` aus der `trees`-Tabelle + tree_type_botanic varchar not null, + + description_emotional text, + description_neutral text +); + +-- Jede Art darf nur einmal vorkommen +create unique index on public.tree_species (tree_type_botanic); \ No newline at end of file