mtrx/crablog
1
0
Fork 0
Code Issues 12 Pull requests 1 Projects 1 Releases Packages Wiki Activity Actions

introducing templating inheritance and macros

Browse source
This commit is contained in:
mtrx 2024-08-10 21:01:49 +02:00
parent 7fe997acff
commit 2e7a81d7c7
11 changed files with 206 additions and 230 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
site/content/static/css/blog.css
View file

@ -26,7 +26,8 @@ article {
} }
.post-link { .post-link {
padding-right: 20px; text-decoration: none;
color: black;
} }
.post-title { .post-title {
@ -39,6 +40,12 @@ article {
.post-body { .post-body {
padding-top: 1rem; padding-top: 1rem;
margin-left: 2rem;
}
.submit-box {
display: flex;
justify-content: space-between;
} }
#submit-form { #submit-form {

96
site/content/templates/about.html
View file

@ -1,55 +1,47 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en">
<head> {% block head %}
<meta charset="UTF-8"> {{ super() }}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Submit post</title>
<meta property="og:title" content="{{ username }}' site'" /> <meta property="og:title" content="{{ username }} site" />
<meta property="og:image" content="/static/site-image.png" /> {% endblock head %}
<title>{{ username }}' site</title> {% block content %}
<link rel="stylesheet" href="/static/css/blog.css"> <h1>Hi, I'm {{ username }}</h1>
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico" /> <p style="text-align: right">
</head> <a href="/">Back to the blog</a>
</p>
<p>
This is my blog.
<body> {% if email %}
<h1>Hi, I'm {{ username }}</h1> If you have questions or input for me please send me an E-Mail to <img class="social-icon"
<p style="text-align: right"> src="/static/social-icons/mail.png" /> {{ email }}
<a href="/">Back to the blog</a> {% endif %}
</p> </p>
<p> <br>
This is my blog. <p>
<ul style="list-style: none;">
{% if email %} {% if github_account %}
If you have questions or input for me please send me an E-Mail to <img class="social-icon" <li><img class="social-icon" src="/static/social-icons/github.ico"><a href="https://github.com/{{ github_account }}">
src="/static/social-icons/mail.png" /> {{ email }} {{ github_account }}</a></li>
{% endif %} {% endif %}
</p> {% if twitter_account %}
<br> <li><img class="social-icon" src="/static/social-icons/twitter.ico"><a
<p> href="https://twitter.com/{{ twitter_account }}"> {{ twitter_account }}</a></li>
<ul style="list-style: none;"> {% endif %}
{% if github_account %} {% if reddit_account %}
<li><img class="social-icon" src="/static/social-icons/github.ico"><a <li><img class="social-icon" src="/static/social-icons/reddit.ico"><a
href="https://github.com/{{ github_account }}"> {{ github_account }}</a></li> href="https://reddit.com/u/{{ reddit_account }}"> {{ reddit_account }}</a></li>
{% endif %} {% endif %}
{% if twitter_account %} {% if mastodon_account %}
<li><img class="social-icon" src="/static/social-icons/twitter.ico"><a <li><img class="social-icon" src="/static/social-icons/mastodon.ico"><a href="https://mastodon.social/"> {{
href="https://twitter.com/{{ twitter_account }}"> {{ twitter_account }}</a></li> mastodon_account }}</a></li>
{% endif %} {% endif %}
{% if reddit_account %} {% if discord_account %}
<li><img class="social-icon" src="/static/social-icons/reddit.ico"><a <li><img class="social-icon" src="/static/social-icons/discord.ico"><a href="https://discord.com/"> {{
href="https://reddit.com/u/{{ reddit_account }}"> {{ reddit_account }}</a></li> discord_account }}</a></li>
{% endif %} {% endif %}
{% if mastodon_account %} </ul>
<li><img class="social-icon" src="/static/social-icons/mastodon.ico"><a href="https://mastodon.social/"> {{ </p>
mastodon_account }}</a></li> {% endblock content %}
{% endif %}
{% if discord_account %}
<li><img class="social-icon" src="/static/social-icons/discord.ico"><a href="https://discord.com/"> {{
discord_account }}</a></li>
{% endif %}
</ul>
</p>
</body>
</html>

11
site/content/templates/article.html.macro Normal file
View file

@ -0,0 +1,11 @@
{% macro article(id, title, body, publish_date) %}
<article>
<div class="post-content">
<a href="/id/{{ id }}" class="post-link">
<h2 class="post-title">{{ title }}</h2>
</a>
<sub class="post-publish-date"> {{ publish_date | date(format="%Y-%m-%d at %H:%M") }}</sub>
<p class="post-body">{{ body }}</p>
</div>
</article>
{% endmacro article %}

18
site/content/templates/base.html Normal file
View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html lang="en">
<head>
{% block head %}
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="/static/css/blog.css">
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico" />
<meta property="og:image" content="/static/site-image.png" />
{% endblock head %}
</head>
<body>
<div id="content">{% block content %}{% endblock content %}</div>
</body>
</html>

56
site/content/templates/blog-all-posts.html
View file

@ -1,35 +1,25 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en"> {% import "article.html.macro" as article_macro %}
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:title" content="{{ username }}' blog" />
<meta property="og:description" content="List of all posts" />
<meta property="og:image" content="/static/site-image.png" />
<title> All posts </title> {% block head %}
<link rel="stylesheet" href="/static/css/blog.css"> {{ super() }}
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico"/> <meta property="og:title" content="{{ username }}' blog" />
</head> <meta property="og:description" content="List of all posts" />
<meta property="og:image" content="/static/site-image.png" />
<title> All posts </title>
{% endblock head %}
<body>
<h1><a href="/" class="post-link" style="text-decoration:none;color:black;">{{ username }}' blog</a></h1> {% block content %}
<p style="text-align: right"> <h1><a href="/" class="post-link" style="text-decoration:none;color:black;">{{ username }} blog</a></h1>
<a href="/about">About</a> <p style="text-align: right">
<a href="/">Last 5 posts</a> <a href="/about">About</a>
</p> <a href="/">Last 5 posts</a>
<ul> </p>
{% for post in posts %} <ul>
<article> {% for post in posts %}
<div> {{ article_macro::article(id=post.id,title=post.title,body=post.body,publish_date=post.publish_date) }}
<a href="/id/{{ post.id }}" class="post-link">[link]</a> {% endfor %}
</div> </ul>
<div class="post-content">
<h2 class="post-title">{{ post.title }}</h2> {% endblock content %}
<sub class="post-publish-date"> {{ post.publish_date | date(format="%Y-%m-%d at %H:%M") }}</sub>
</div>
</article>
{% endfor %}
</ul>
</body>
</html>

59
site/content/templates/blog-by-id.html
View file

@ -1,35 +1,28 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta property="og:title" content=" {{ post.title }} | {{ username }}' blog" />
<meta property="og:description" content="{{ post.body | striptags }}" />
<meta property="og:image" content="/static/site-image.png" />
<title> {{ post.title }} | {{ username }}' blog </title> {% block head %}
<link rel="stylesheet" href="/static/css/blog.css"> {{ super() }}
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico"/> <meta property="og:title" content=" {{ post.title }} | {{ username }}' blog" />
</head> <meta property="og:description" content="{{ post.body | striptags }}" />
<title> {{ post.title }} | {{ username }}' blog </title>
{% endblock head %}
<body> {% block content %}
<h1><a href="/" class="post-link" style="text-decoration:none;color:black;">{{ username }}' blog</a></h1> <h1><a href="/" class="post-link" style="text-decoration:none;color:black;">{{ username }} blog</a></h1>
<p style="text-align: right"> <p style="text-align: right">
<a href="/">Home</a> <a href="/">Home</a>
<a href="/about">About</a> <a href="/about">About</a>
<a href="/all">All Posts</a> <a href="/all">All Posts</a>
</p> </p>
<ul> <ul>
<article> <article>
<div> <div class="post-content">
<a href="/id/{{ post.id }}" class="post-link">[link]</a> <a href="/id/{{ post.id }}" class="post-link">
</div> <h2 class="post-title">{{ post.title }}</h2>
<div class="post-content"> </a>
<h2 class="post-title">{{ post.title }}</h2> <sub class="post-publish-date"> {{ post.publish_date | date(format="%Y-%m-%d at %H:%M") }}</sub>
<sub class="post-publish-date"> {{ post.publish_date | date(format="%Y-%m-%d at %H:%M") }}</sub> <p class="post-body">{{ post.body }}</p>
<p class="post-body">{{ post.body }}</p> </div>
</div> </article>
</article> </ul>
</ul> {% endblock content %}
</body>
</html>

56
site/content/templates/blog.html
View file

@ -1,38 +1,22 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en"> {% import "article.html.macro" as article_macro %}
<head> {% block head %}
<meta charset="UTF-8"> {{ super() }}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta property="og:title" content="{{ username }}' blog" />
<meta property="og:title" content="{{ username }}' blog" /> <meta property="og:description" content="Last 5 posts" />
<meta property="og:description" content="Last 5 posts" /> <title> {{ username }} blog </title>
<meta property="og:image" content="/static/site-image.png" /> {% endblock head %}
<title> {{ username }}' blog </title> {% block content %}
<link rel="stylesheet" href="/static/css/blog.css"> <h1><a href="/" class="post-link">{{ username }} blog</a></h1>
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico" /> <p style="text-align: right">
</head> <a href="/about">About</a>
<a href="/all">All Posts</a>
<body> </p>
<h1><a href="/" class="post-link" style="text-decoration:none;color:black;">{{ username }} blog</a></h1> <ul>
<p style="text-align: right"> {% for post in posts %}
<a href="/about">About</a> {{ article_macro::article(id=post.id,title=post.title,body=post.body,publish_date=post.publish_date) }}
<a href="/all">All Posts</a> {% endfor %}
</p> </ul>
<ul> {% endblock content %}
{% for post in posts %}
<article>
<div>
<a href="/id/{{ post.id }}" class="post-link">[link]</a>
</div>
<div class="post-content">
<h2 class="post-title">{{ post.title }}</h2>
<sub class="post-publish-date"> {{ post.publish_date | date(format="%Y-%m-%d at %H:%M") }}</sub>
<p class="post-body">{{ post.body }}</p>
</div>
</article>
{% endfor %}
</ul>
</body>
</html>

69
site/content/templates/edit-form.html
View file

@ -1,43 +1,32 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en">
<head> {% block head %}
<meta charset="UTF-8"> {{ super() }}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Edit '{{ title }}'</title>
<meta property="og:title" content="Edit '{{ title }}'" /> <meta property="og:title" content="Edit '{{ title }}'" />
<meta property="og:image" content="/static/site-image.png" /> {% endblock head %}
<title>Edit '{{ title }}'</title> {% block content %}
<link rel="stylesheet" href="/static/css/blog.css"> <form id="submit-form" action="/api/blog/posts/edit/{{ id }}" method=POST>
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico" /> <label for="token">Password</label>
</head> <br />
<input id="token" type="password" name="token">
<br />
<label for="title">Title</label>
<textarea id="submit-title" type="text" name="title">{{ title }}</textarea>
<br />
<label for="submit-body">Content</label>
<textarea id="submit-body" type="text" name="body">{{ body }}</textarea>
<br />
<button id="submit-button" type="submit">Edit post</button>
</form>
<body> <form action="/api/blog/posts/hide/{{ id }}" method="POST">
<div id="cookie-block" hidden> <input class="token" type="text" name="token" hidden>
<label for="token">Password</label> <button type="submit">Hide post</button>
</br> </form>
<input id="token" type="password" name="token"> <form action="/api/blog/posts/delete/{{ id }}" method="POST">
</div> <input class="token" type="text" name="token" hidden>
<button type="submit">Delete post</button>
<form id="submit-form" action="/api/blog/posts/edit/{{ id }}" method=POST> </form>
<input class="token" type="text" name="token" hidden> {% endblock content %}
<label for="title">Title</label>
<textarea id="submit-title" type="text" name="title">{{ title }}</textarea>
<br>
<label for="submit-body">Content</label>
<textarea id="submit-body" type="text" name="body">{{ body }}</textarea>
<br>
<button id="submit-button" type="submit">Edit post</button>
</form>
<form action="/api/blog/posts/hide/{{ id }}" method="POST">
<input class="token" type="text" name="token" hidden>
<button type="submit">Hide post</button>
</form>
<form action="/api/blog/posts/delete/{{ id }}" method="POST">
<input class="token" type="text" name="token" hidden>
<button type="submit">Delete post</button>
</form>
</body>
</html>

52
site/content/templates/submit.html
View file

@ -1,34 +1,26 @@
<!DOCTYPE html> {% extends "base.html" %}
<html lang="en">
<head> {% block head %}
<meta charset="UTF-8"> {{ super() }}
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Submit post</title>
<meta property="og:title" content="Submit post" /> <meta property="og:title" content="Submit post" />
<meta property="og:image" content="/static/site-image.png" /> {% endblock head %}
<title>Submit post</title>
<link rel="stylesheet" href="/static/css/blog.css">
<link rel="shortcut icon" type="image/jpg" href="/static/favicon.ico" />
</head>
<body> {% block content %}
<div id="cookie-block" hidden> <form id="submit-form" action="/api/blog/create" method=POST>
<label for="token">Password</label> <label for="title">Title</label>
<br /> <textarea id="submit-title" type="text" name="title">{{ title }}</textarea>
<input id="token" type="password" name="token"> <br />
</div> <label for="submit-body">Content</label>
<textarea id="submit-body" type="text" name="body">{{ body }}</textarea>
<form id="submit-form" action="/api/blog/create" method=POST> <br />
<input class="token" type="text" name="token" hidden> <div class="submit-box">
<label for="title">Title</label> <div>
<textarea id="submit-title" type="text" name="title">{{ title }}</textarea> <label for="token">Password</label>
<br> <input id="token" type="password" name="token">
<label for="submit-body">Content</label> </div>
<textarea id="submit-body" type="text" name="body">{{ body }}</textarea>
<br>
<button id="submit-button" type="submit">Submit</button> <button id="submit-button" type="submit">Submit</button>
</form> </div>
</body> </form>
{% endblock content %}
</html>

8
site/src/api.rs
View file

@ -26,7 +26,7 @@ async fn blog_create_post(form: Form<NewPostForm>) -> impl Responder {
} }
HttpResponse::MovedPermanently() HttpResponse::MovedPermanently()
.insert_header(("LOCATION", "/blog")) .insert_header(("LOCATION", "/"))
.finish() .finish()
} }
@ -46,7 +46,7 @@ async fn blog_edit_post(post_id: web::Path<String>, form: Form<NewPostForm>) ->
} }
return HttpResponse::MovedPermanently() return HttpResponse::MovedPermanently()
.insert_header(("LOCATION", "/blog")) .insert_header(("LOCATION", "/"))
.finish(); .finish();
} }
@ -65,7 +65,7 @@ async fn blog_delete_post(
} }
return HttpResponse::MovedPermanently() return HttpResponse::MovedPermanently()
.insert_header(("LOCATION", "/blog")) .insert_header(("LOCATION", "/"))
.finish(); .finish();
} }
@ -81,7 +81,7 @@ async fn blog_hide_post(post_id: web::Path<String>, form: Form<BlogActionForm>)
} }
return HttpResponse::MovedPermanently() return HttpResponse::MovedPermanently()
.insert_header(("LOCATION", "/blog")) .insert_header(("LOCATION", "/"))
.finish(); .finish();
} }

2
site/src/main.rs
View file

@ -22,7 +22,7 @@ async fn main() -> std::io::Result<()> {
Tera::new(format!("{}{}", CONFIG.root_path, "/templates/*").as_str()).unwrap(); Tera::new(format!("{}{}", CONFIG.root_path, "/templates/*").as_str()).unwrap();
tera.autoescape_on(vec![".sql"]); tera.autoescape_on(vec![".sql"]);
env_logger::Builder::from_env(Env::default().default_filter_or("info")); env_logger::Builder::from_env(Env::default().default_filter_or("debug"));
App::new() App::new()
.app_data(Data::new(tera)) .app_data(Data::new(tera))