feat: Add webserver routes and account logic
All checks were successful
Build Docker / BuildImage (push) Successful in 2m7s

This commit is contained in:
2025-07-25 11:45:19 +10:00
parent 1ac41d5582
commit c53a42b5c9
6 changed files with 367 additions and 2 deletions

92
templates/account.html Normal file
View File

@@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FireAlerts</title>
<link rel="icon" href="/assets/img/favicon.png" type="image/png">
<link rel="stylesheet" href="/assets/css/index.css">
</head>
<body>
<div class="right">
<span class="user">Logged in as {{user.username}}</span>
<a href="/logout" class="button">Logout</a>
</div>
<h1>FireAlerts</h1>
<div class="centre">
<h2>Your Alerts</h2>
</div>
<!-- Display existing notifications -->
{% if notifications %}
<div class="notifications-list">
{% for notification in notifications %}
<div class="notification-item">
<h4>Domain: {{notification.domain}}</h4>
<p><strong>Type:</strong> {{notification.notification.type.replace('_', ' ').title()}}</p>
<p><strong>Blocks before expiry:</strong> {{notification.notification.blocks}}</p>
{% for notificationType in NOTIFICATION_TYPES %}
{% if notificationType.type == notification.notification.type %}
{% for field in notificationType.fields %}
<p><strong>{{field.label}}:</strong> {{notification.notification[field.name]}}</p>
{% endfor %}
{% endif %}
{% endfor %}
<!-- Delete notification button -->
<a href="/notification/delete/{{notification.notification.id}}" class="button delete-button">Delete</a>
</div>
{% endfor %}
</div>
{% else %}
<div class="no-notifications">
<p>You have no notifications set up yet.</p>
<p>Use the forms below to add new notifications.</p>
</div>
{% endif %}
<div class="centre">
<h2>Setup your alerts below:</h2>
</div>
<!-- Forms to add notifications -->
{% for notificationType in NOTIFICATION_TYPES %}
<div class="notification-form">
<h3>{{notificationType.description}}</h3>
<form method="POST" action="/notification/{{notificationType.type}}">
<!-- Domain input -->
<div class="form-group">
<label for="domain">Domain:</label>
<input type="text" id="domain" name="domain" required placeholder="exampledomain">
</div>
{% for field in notificationType.fields %}
<div class="form-group">
<label for="{{field.name}}">{{field.label}}:</label>
<input
type="{{field.type}}"
id="{{field.name}}"
name="{{field.name}}"
{% if field.required %}required{% endif %}
>
</div>
{% endfor %}
<!-- Add required blocks before expiry field -->
<div class="form-group">
<label for="blocks">Blocks before expiry</label>
<input type="number" id="blocks" name="blocks" required min="1" max="10000" value="1008">
</div>
<button type="submit" class="button">Add {{notificationType.type.replace('_', ' ').title()}} Notification</button>
</form>
</div>
{% endfor %}
</body>
</html>

View File

@@ -17,4 +17,116 @@ a {
}
a:hover {
text-decoration: underline;
}
.button {
display: inline-block;
padding: 10px 20px;
background-color: #ffffff;
color: #000000;
border-radius: 5px;
transition: background-color 0.3s ease;
}
.right {
float: right;
}
span.user {
font-weight: bold;
color: #ffffff;
margin-inline-end: 5px;
}
.notification-form {
background-color: #1a1a1a;
border: 1px solid #333333;
border-radius: 8px;
padding: 20px;
margin: 20px auto;
max-width: 500px;
}
.notification-form h3 {
margin-top: 0;
margin-bottom: 15px;
color: #ffffff;
}
.form-group {
margin-bottom: 15px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: bold;
color: #ffffff;
}
.form-group input {
width: 100%;
padding: 10px;
background-color: #333333;
border: 1px solid #555555;
border-radius: 4px;
color: #ffffff;
font-size: 14px;
box-sizing: border-box;
}
.form-group input:focus {
outline: none;
border-color: #ffffff;
background-color: #444444;
}
.notifications-list {
max-width: 800px;
margin: 30px auto;
padding: 0 20px;
}
.notifications-list h2 {
color: #ffffff;
text-align: center;
margin-bottom: 20px;
}
.notification-item {
background-color: #1a1a1a;
border: 1px solid #333333;
border-radius: 8px;
padding: 15px;
margin-bottom: 15px;
}
.notification-item h4 {
margin-top: 0;
margin-bottom: 10px;
color: #ffffff;
font-size: 18px;
}
.notification-item p {
margin: 5px 0;
color: #cccccc;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.notification-item p strong {
color: #ffffff;
}
.no-notifications {
text-align: center;
max-width: 500px;
margin: 30px auto;
color: #cccccc;
}
/* Specific handling for long URLs and IDs */
.notification-item p:contains("URL"),
.notification-item p:contains("ID") {
font-family: monospace;
font-size: 12px;
}

View File

@@ -4,7 +4,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Nathan.Woodburn/</title>
<title>FireAlerts</title>
<link rel="icon" href="/assets/img/favicon.png" type="image/png">
<link rel="stylesheet" href="/assets/css/index.css">
</head>
@@ -12,7 +12,9 @@
<body>
<div class="spacer"></div>
<div class="centre">
<h1>Nathan.Woodburn/</h1>
<h1>FireAlerts</h1>
<p>Get alerted before your Handshake domains expire.</p>
<a href="/account" class="button">Account</a>
</div>
</body>