feat: overhaul templating system

This commit is contained in:
Jef Roosens 2025-01-10 15:16:01 +01:00
parent 03b3f692e1
commit 4a4b8bba3d
No known key found for this signature in database
GPG key ID: 21FD3D77D56BAF49
22 changed files with 157 additions and 127 deletions

14
templates/base.html Normal file
View file

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html lang="en">
<head>
<script src="/static/htmx_2.0.4.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+"></script>
</head>
<body>
<main>
<h1>Calathea</h1>
<div id="content">
{{ view | safe }}
</div>
</main>
</body>
</html>

View file

@ -0,0 +1,22 @@
{% macro li(comment) %}
<li>{{ comment.comment }}</li>
{% endmacro li %}
{% macro list(comments) %}
<div id="comments">
<ul id="comments_ul">
{% for comment in comments %}
{{ self::li(comment=comment) }}
{% endfor %}
</ul>
</div>
{% endmacro list %}
{% macro form(plant_id, target="#comments > ul") %}
<form hx-post="/comments" hx-target="{{ target }}" hx-swap="beforeend">
<input type="hidden" id="plant_id" name="plant_id" value="{{ plant_id }}">
<label for="comment">Comment:</label>
<textarea id="comment" name="comment" rows=4></textarea></br>
<input type="submit">
</form>
{% endmacro form %}

View file

@ -0,0 +1,36 @@
{% macro li(event) %}
<li>
<div class="event">
<b>{{ event.event_type }}</b>
<p>{{ event.date }}</p>
<p>{{ event.description }}</p>
</div>
</li>
{% endmacro li %}
{% macro list(events) %}
<div id="events">
<ul>
{% for event in events %}
{{ self::li(event=event) }}
{% endfor %}
</ul>
</div>
{% endmacro ul %}
{% macro form(plant_id, target="#events > ul") %}
<form hx-post="/events" hx-target="{{ target }}" hx-swap="beforeend">
<input type="hidden" id="plant_id" name="plant_id" value="{{ plant_id }}">
<label for="event_type">Type:</label>
<select id="event_type" name="event_type">
{% for type in event_types %}
<option value="{{ type }}">{{ type }}</option>
{% endfor %}
</select>
<label for="date">Date:</label>
<input type="date" id="date" name="date">
<label for="description">Description:</label>
<textarea id="description" name="description" rows=2></textarea></br>
<input type="submit">
</form>
{% endmacro form %}

View file

@ -0,0 +1,37 @@
{% macro info(plant) %}
<div class="plant_info">
<h2>{{ plant.name }}</h2>
<h3>Species</h3>
<p>{{ plant.species }}</p>
<h3>Description</h3>
<p>{{ plant.description }}</p>
</div>
{% endmacro info %}
{% macro li(plant) %}
<li>
<a hx-get="/plants/{{ plant.id }}" hx-target="#content" hx-push-url="true">{{ plant.name }}</a> ({{ plant.species }})
</li>
{% endmacro li %}
{% macro list(plants) %}
<div id="plants">
<ul>
{% for plant in plants %}
{{ self::li(plant=plant) }}
{% endfor %}
</ul>
</div>
{% endmacro %}
{% macro form(target="#plants > ul") %}
<form hx-post="/plants" hx-target="{{ target }}" hx-swap="beforeend">
<label for="name">Name:</label>
<input type="text" id="name" name="name"></br>
<label for="species">Species:</label>
<input type="text" id="species" name="species"></br>
<label for="description">Description:</label>
<textarea id="description" name="description" rows=4></textarea></br>
<input type="submit">
</form>
{% endmacro %}

View file

@ -0,0 +1,2 @@
{% import "components/comment.html" as comp_comment %}
{{ comp_comment::li(comment=comment) }}

View file

@ -0,0 +1,2 @@
{% import "components/event.html" as comp_event %}
{{ comp_event::li(event=event) }}

View file

@ -0,0 +1,2 @@
{% import "components/plant.html" as comp_plant %}
{{ comp_plant::li(plant=plant) }}

View file

@ -0,0 +1,6 @@
{% import "components/plant.html" as comp_plant %}
<h2>Plants</h2>
{{ comp_plant::list(plants=plants) }}
<h3>Add new plant</h3>
{{ comp_plant::form() }}

View file

@ -0,0 +1,11 @@
{% import "components/event.html" as comp_event %}
{% import "components/plant.html" as comp_plant %}
{% import "components/comment.html" as comp_comment %}
{{ comp_plant::info(plant=plant) }}
<h3>Events</h3>
{{ comp_event::list(events=events) }}
{{ comp_event::form(plant_id=plant.id) }}
<h3>Comments</h3>
{{ comp_comment::list(comments=comments) }}
{{ comp_comment::form(plant_id=plant.id) }}