Use Go templates for HTML

This commit is contained in:
Joakim Hellsén 2024-02-03 17:47:58 +01:00
commit 51fb9df8b3
14 changed files with 220 additions and 255 deletions

16
templates/about.tmpl Normal file
View file

@ -0,0 +1,16 @@
{{ define "content" }}
<h2>Feeds to archive</h2>
<p>
Input the URLs of the feeds you wish to archive below. You can add as many as needed, and access them through the website or API. Alternatively, include links to .opml files, and the feeds within will be archived.
</p>
<form action="/add" method="post">
<textarea id="urls" name="urls" rows="5" cols="50" required></textarea>
<button type="submit">Add feeds</button>
</form>
<br>
<p>You can also upload .opml files containing the feeds you wish to archive:</p>
<form enctype="multipart/form-data" method="post" action="/upload_opml">
<input type="file" name="file" id="file" accept=".opml" required>
<button type="submit">Upload OPML</button>
</form>
{{ end }}

View file

@ -1,8 +0,0 @@
{% extends "base.html" %}
{% block title %}<title>Feeds</title>{% endblock %}
{% block description %}FeedVault - A feed archive{% endblock %}
{% block keywords %}RSS, Atom, Feed, Archive{% endblock %}
{% block content %}
<h2>API documentation</h2>
<p>Here be dragons.</p>
{% endblock %}

4
templates/api.tmpl Normal file
View file

@ -0,0 +1,4 @@
{{ define "content" }}
<h2>API documentation</h2>
<p>Here be dragons.</p>
{{ end }}

View file

@ -1,75 +0,0 @@
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="description"
content="{% block description %}FeedVault - A feed archive{% endblock %}">
<meta name="keywords"
content="{% block keywords %}RSS, Atom, Feed, Archive{% endblock %}">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% block title %}<title>FeedVault</title>{% endblock %}
<link rel="stylesheet" href="{% static 'style.css' %}">
{% if canonical_url %}<link rel="canonical" href="{{ canonical_url }}">{% endif %}
</head>
<body>
{% if messages %}
<ul class="messages">
{% for message in messages %}
<li {% if message.tags %}class="{{ message.tags }}"{% endif %}>{{ message|safe }}</li>
{% endfor %}
</ul>
<hr>
{% endif %}
<span class="title">
<h1>
<a href="{% url 'feeds:index' %}">FeedVault</a>
</h1>
</span>
<div class="leftright">
<div class="left">
<small>Archive of <a href="https://en.wikipedia.org/wiki/Web_feed">web feeds</a>. {{ feed_count }} feeds. ~{{ database_size|floatformat:2 }} MB.</small>
</div>
<div class="right">
<!-- Search -->
<form action="#" method="get">
<input type="text" name="q" placeholder="Search">
<button type="submit">Search</button>
</form>
</div>
</div>
<nav>
<small>
<div class="leftright">
<div class="left">
<a href="{% url 'feeds:feeds' %}">Feeds</a> | <a href="{% url 'feeds:api' %}">API</a> | <a href="https://github.com/TheLovinator1/FeedVault">GitHub</a> | <a href="{% url 'feeds:donate' %}">Donate</a>
</div>
<div class="right">
<a href="">Register</a> | <a href="">Login</a>
</div>
</div>
</small>
</nav>
<hr>
{% block content %}<!-- default content -->{% endblock %}
<hr>
<footer>
<small>
<div class="leftright">
<div class="left">
Made by <a href="">Joakim Hellsén</a>.
</div>
<div class="right">No rights reserved.</div>
</div>
<div class="leftright">
<div class="left">
<a href="mailto:hello@feedvault.se">hello@feedvault.se</a>
</div>
<div class="right">
<a href="">Terms of Service</a> | <a href="">Privacy Policy</a>
</div>
</div>
</small>
</footer>
</body>
</html>

70
templates/base.tmpl Normal file
View file

@ -0,0 +1,70 @@
{{ define "base" }}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{{ if .Description }}<meta name="description" content="{{ .Description }}">{{ end }}
{{ if .Keywords }}<meta name="keywords" content="{{ .Keywords }}">{{ end }}
{{ if .Author }}<meta name="author" content="{{ .Author }}">{{ end }}
{{ if .CanonicalURL }}<link rel="canonical" href="{{ .CanonicalURL }}">{{ end }}
<title>{{ .Title }}</title>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<span class="title">
<h1>
<a href="/">FeedVault</a>
</h1>
</span>
<div class="leftright">
<div class="left">
<small>Archive of <a href="https://en.wikipedia.org/wiki/Web_feed">web feeds</a>. {{ .FeedCount }} feeds. ~{{ .DatabaseSize }} MB.</small>
</div>
<div class="right">
<!-- Search -->
<form action="#" method="get">
<input type="text" name="q" placeholder="Search">
<button type="submit">Search</button>
</form>
</div>
</div>
<nav>
<small>
<div class="leftright">
<div class="left">
<a href="/feeds">Feeds</a> | <a href="/api">API</a> | <a href="https://github.com/TheLovinator1/FeedVault">GitHub</a> | <a href="/donate">Donate</a>
</div>
<div class="right">
<a href="">Register</a> | <a href="">Login</a>
</div>
</div>
</small>
</nav>
<hr>
{{ block "content" . }}{{ end }}
<hr>
<footer>
<small>
<div class="leftright">
<div class="left">
Made by <a href="">Joakim Hellsén</a>.
</div>
<div class="right">No rights reserved.</div>
</div>
<div class="leftright">
<div class="left">
<a href="mailto:hello@feedvault.se">hello@feedvault.se</a>
</div>
<div class="right">
<a href="">Terms of Service</a> | <a href="">Privacy Policy</a>
</div>
</div>
</small>
</footer>
</body>
</html>
{{ end }}

View file

@ -1,37 +0,0 @@
{% extends "base.html" %}
{% block title %}<title>Donate</title>{% endblock %}
{% block description %}FeedVault - A feed archive{% endblock %}
{% block keywords %}RSS, Atom, Feed, Archive, Donate{% endblock %}
{% block content %}
<h2>Donate</h2>
<p>
tl;dr: <a href="https://github.com/sponsors/TheLovinator1">GitHub Sponsors</a>
</p>
<p>
FeedVault is a free service, and will always be free. However, if you wish to support the project, you can do so by donating to the developer.
</p>
<h3>What will the money be used for?</h3>
<p>
The money will be used to pay for the server costs, domain name, and other expenses related to running the service.
</p>
<h3>How much does it cost to run FeedVault?</h3>
<p>Domain name: 12 € / 13 $ / 10 £ per year</p>
<h3>How can I donate?</h3>
<p>
The preferred method of donating is through <a href="https://github.com/sponsors/TheLovinator1">GitHub Sponsors</a> due to no fees being taken. However, you can also donate through <a href="https://www.paypal.com/donate/?hosted_button_id=9EU45BXAEUGFC">PayPal</a>.
</p>
<h3>Crypto</h3>
<p>
You can also donate through cryptocurrency. The addresses are listed below. If you wish to donate through a cryptocurrency not listed below, please <a href="mailto:hello@feedvault.se">contact me</a>.
</p>
<h4>Bitcoin</h4>
<p>
<a href="bitcoin:bc1qdgm09zzxllzh4m2edyyx7khwhw5mjrwe0d2dws?message=FeedVault">bc1qdgm09zzxllzh4m2edyyx7khwhw5mjrwe0d2dws</a>
</p>
<h4>Monero</h4>
<p>
<a href="monero:83Hft9zJKPNgMrLAZQ7hhTBeJ6v9bJFJ7P7xfWLRDCiyg4QDwstnjc79Fdn5Y8uY5Hfddj52ok9JF8uisU9UXDJjT4Msevx">83Hft9zJKPNgMrLAZQ7hhTBeJ6v9bJFJ7P7xfWLRDCiyg4QDwstnjc79Fdn5Y8uY5Hfddj52ok9JF8uisU9UXDJjT4Msevx</a>
</p>
<h3>Thank you!</h3>
<p>Thank you for supporting FeedVault!</p>
{% endblock %}

33
templates/donate.tmpl Normal file
View file

@ -0,0 +1,33 @@
{{ define "content" }}
<h2>Donate</h2>
<p>
tl;dr: <a href="https://github.com/sponsors/TheLovinator1">GitHub Sponsors</a>
</p>
<p>
FeedVault is a free service, and will always be free. However, if you wish to support the project, you can do so by donating to the developer.
</p>
<h3>What will the money be used for?</h3>
<p>
The money will be used to pay for the server costs, domain name, and other expenses related to running the service.
</p>
<h3>How much does it cost to run FeedVault?</h3>
<p>Domain name: 12 € / 13 $ / 10 £ per year</p>
<h3>How can I donate?</h3>
<p>
The preferred method of donating is through <a href="https://github.com/sponsors/TheLovinator1">GitHub Sponsors</a> due to no fees being taken. However, you can also donate through <a href="https://www.paypal.com/donate/?hosted_button_id=9EU45BXAEUGFC">PayPal</a>.
</p>
<h3>Crypto</h3>
<p>
You can also donate through cryptocurrency. The addresses are listed below. If you wish to donate through a cryptocurrency not listed below, please <a href="mailto:hello@feedvault.se">contact me</a>.
</p>
<h4>Bitcoin</h4>
<p>
<a href="bitcoin:bc1qdgm09zzxllzh4m2edyyx7khwhw5mjrwe0d2dws?message=FeedVault">bc1qdgm09zzxllzh4m2edyyx7khwhw5mjrwe0d2dws</a>
</p>
<h4>Monero</h4>
<p>
<a href="monero:83Hft9zJKPNgMrLAZQ7hhTBeJ6v9bJFJ7P7xfWLRDCiyg4QDwstnjc79Fdn5Y8uY5Hfddj52ok9JF8uisU9UXDJjT4Msevx">83Hft9zJKPNgMrLAZQ7hhTBeJ6v9bJFJ7P7xfWLRDCiyg4QDwstnjc79Fdn5Y8uY5Hfddj52ok9JF8uisU9UXDJjT4Msevx</a>
</p>
<h3>Thank you!</h3>
<p>Thank you for supporting FeedVault!</p>
{{ end }}

View file

@ -1,28 +0,0 @@
{% extends "base.html" %}
{% block title %}<title>Feeds</title>{% endblock %}
{% block description %}FeedVault - A feed archive{% endblock %}
{% block keywords %}RSS, Atom, Feed, Archive{% endblock %}
{% block content %}
{% for feed in feeds %}
<div class="feed">
<h2>
<a href="{{ feed.url }}">
{% if feed.title %}
{{ feed.title }}
{% else %}
{{ feed.url }}
{% endif %}
</a>
</h2>
<p>
{% if feed.created %}Added {{ feed.created|date:"F j, Y" }}{% endif %}
{% if feed.last_updated %}
{% if feed.created %}·{% endif %}
Last updated {{ feed.last_updated|date:"F j, Y" }}
{% endif %}
</p>
</div>
{% empty %}
<p>No feeds found.</p>
{% endfor %}
{% endblock %}

3
templates/feeds.tmpl Normal file
View file

@ -0,0 +1,3 @@
{{ define "content" }}
Feeds
{{ end }}

View file

@ -1,103 +0,0 @@
{% extends "base.html" %}
{% block title %}<title>FeedVault</title>{% endblock %}
{% block description %}FeedVault{% endblock %}
{% block keywords %}RSS, Atom, Feed, Archive{% endblock %}
{% block content %}
<h2>Feeds to archive</h2>
<p>
Input the URLs of the feeds you wish to archive below. You can add as many as needed, and access them through the website or API. Alternatively, include links to .opml files, and the feeds within will be archived.
</p>
<form action="/add" method="post">
{% csrf_token %}
<textarea id="urls" name="urls" rows="5" cols="50" required></textarea>
<button type="submit">Add feeds</button>
</form>
<br>
<p>You can also upload .opml files containing the feeds you wish to archive:</p>
<form enctype="multipart/form-data" method="post" action="/upload_opml">
{% csrf_token %}
<input type="file" name="file" id="file" accept=".opml" required>
<button type="submit">Upload OPML</button>
</form>
<hr>
<details>
<summary>What are web feeds?</summary>
<p>
Web feeds let you "subscribe" to website content, notifying you of new updates. Feeds are typically in RSS or Atom formats, recognizable by this icon:
<img src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgMjU2IDI1NiIgY3Vyc29yPSJkZWZhdWx0Ij48ZGVmcz48bGluZWFyR3JhZGllbnQgeDE9Ii4wODUiIHkxPSIuMDg1IiB4Mj0iLjkxNSIgeTI9Ii45MTUiIGlkPSJwcmVmaXhfX2EiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI0UzNzAyRCIvPjxzdG9wIG9mZnNldD0iLjEwNyIgc3RvcC1jb2xvcj0iI0VBN0QzMSIvPjxzdG9wIG9mZnNldD0iLjM1IiBzdG9wLWNvbG9yPSIjRjY5NTM3Ii8+PHN0b3Agb2Zmc2V0PSIuNSIgc3RvcC1jb2xvcj0iI0ZCOUUzQSIvPjxzdG9wIG9mZnNldD0iLjcwMiIgc3RvcC1jb2xvcj0iI0VBN0MzMSIvPjxzdG9wIG9mZnNldD0iLjg4NyIgc3RvcC1jb2xvcj0iI0RFNjQyQiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0Q5NUIyOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHdpZHRoPSIyNTYiIGhlaWdodD0iMjU2IiByeD0iNTUiIHJ5PSI1NSIgZmlsbD0iI0NDNUQxNSIvPjxyZWN0IHdpZHRoPSIyNDYiIGhlaWdodD0iMjQ2IiByeD0iNTAiIHJ5PSI1MCIgeD0iNSIgeT0iNSIgZmlsbD0iI0Y0OUM1MiIvPjxyZWN0IHdpZHRoPSIyMzYiIGhlaWdodD0iMjM2IiByeD0iNDciIHJ5PSI0NyIgeD0iMTAiIHk9IjEwIiBmaWxsPSJ1cmwoI3ByZWZpeF9fYSkiLz48Y2lyY2xlIGN4PSI2OCIgY3k9IjE4OSIgcj0iMjQiIGZpbGw9IiNGRkYiLz48cGF0aCBkPSJNMTYwIDIxM2gtMzRhODIgODIgMCAwMC04Mi04MlY5N2ExMTYgMTE2IDAgMDExMTYgMTE2eiIgZmlsbD0iI0ZGRiIvPjxwYXRoIGQ9Ik0xODQgMjEzQTE0MCAxNDAgMCAwMDQ0IDczVjM4YTE3NSAxNzUgMCAwMTE3NSAxNzV6IiBmaWxsPSIjRkZGIi8+PC9zdmc+"
alt="Feed icon"
width="16"
height="16">
<br>
<br>
Learn more about web feeds on <a href="https://en.wikipedia.org/wiki/Web_feed">Wikipedia</a>.
</p>
<hr>
</details>
<details>
<summary>What is FeedVault?</summary>
<p>
FeedVault is a platform crafted to gather, arrange, and preserve information sourced from RSS feeds. It utilizes the <a href="https://github.com/kurtmckee/feedparser">feedparser library by Kurt McKee</a> to parse XML data, storing pertinent details in a Django-managed PostgreSQL database.
</p>
<hr>
</details>
<details>
<summary>Why archive feeds?</summary>
<p>
The web is constantly changing. Websites are redesigned, content is removed, and links are broken. By archiving feeds, we can preserve the content that is published on the web.
</p>
<hr>
</details>
<details>
<summary>How does it work?</summary>
<p>
<ul>
<li>
Parse XML data using the <a href="https://github.com/kurtmckee/feedparser">feedparser</a> library.
</li>
<li>
Sanitize HTML content <a href="https://feedparser.readthedocs.io/en/latest/html-sanitization.html">before</a> saving parsed data to the database.
</li>
<li>Store the sanitized data in a PostgreSQL database using Django's ORM.</li>
<li>
Data is made available through the website and the <a href="/api">API</a>.
</li>
</ul>
</p>
<hr>
</details>
<details>
<summary>How can I access the archived feeds?</summary>
<p>
<ul>
<li>Search for feeds using the top-page search bar.</li>
<li>
Access the archived feeds on the <a href="/feeds">website</a>.
</li>
<li>
Access the archived feeds via the <a href="/api">API</a>.
</li>
<li>
Download database dumps from <a href="">here</a>.
</li>
</ul>
</p>
</details>
<details>
<summary>How can I contribute?</summary>
<p>
<ul>
<li>Add feeds to the archive.</li>
<li>
<a href="https://github.com/TheLovinator1/FeedVault/issues">Report bugs</a> and <a href="https://github.com/TheLovinator1/FeedVault/issues">suggest features</a>.
</li>
<li>
<a href="">Donate</a> to support the project.
</li>
<li>
<a href="">Contribute</a> to the project on GitHub.
</li>
</ul>
</p>
</details>
{% endblock %}

18
templates/index.tmpl Normal file
View file

@ -0,0 +1,18 @@
{{template "base"}}
{{ define "content" }}
<h2>Feeds to archive</h2>
<p>
Input the URLs of the feeds you wish to archive below. You can add as many as needed, and access them through the website or API. Alternatively, include links to .opml files, and the feeds within will be archived.
</p>
<form action="/add" method="post">
<textarea id="urls" name="urls" rows="5" cols="50" required></textarea>
<button type="submit">Add feeds</button>
</form>
<br>
<p>You can also upload .opml files containing the feeds you wish to archive:</p>
<form enctype="multipart/form-data" method="post" action="/upload_opml">
<input type="file" name="file" id="file" accept=".opml" required>
<button type="submit">Upload OPML</button>
</form>
{{ end }}