justin/postmortem
1
0
Fork 0
mirror of https://github.com/justinian/postmortem.git synced 2025-12-09 16:14:31 -08:00
Code Issues Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
Justin C. Miller
2023-01-28 15:04:42 -08:00
commit 7565ead8c9
7 changed files with 230 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
templates/index.html Normal file
View File

@@ -0,0 +1,111 @@
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css">
<title>POST mortem</title>
<style>
.post {
font-family: monospace;
}
div.message {
font-size: 1.3rem;
margin: 1rem 1rem 3rem 3rem;
}
div.bordered {
margin-top: 2rem;
padding: 0.8rem;
width: 80%;
border: 1px solid #ccc;
border-radius: 10px;
background: #f0f0f0;
}
blockquote.poem {
white-space: pre;
font-size: 1.5rem;
}
blockquote.poem::first-line {
font-size: 1.8rem;
font-weight: bold;
text-decoration: underline;
margin-bottom: 3rem;
}
</style>
</head>
<body>
<h1><span class="post">POST</span> mortem</h1>
{% if poem %}
<blockquote class="poem" id="poem-quote">{{ poem }}</blockquote>
{% else %}
<div class="message" style="font-style: italic;">
No poem has been started yet, add some words!
</div>
{% endif %}
<form id="add-words-form">
<div>
<label for="addend-input">Enter some words to add:</label>
<input type="text" id="addend-input" style="width: 80%;" />
</div>
<button type="submit">Add Words</button>
</form>
<script type="module">
import { update_all } from '/static/main.js';
let form = document.getElementById('add-words-form');
let input = document.getElementById('addend-input');
form.addEventListener('submit', evt => {
evt.preventDefault();
var key = "{{ key }}";
let words = input.value.split(" ");
update_all(key, words).then( key => {
document.location = "/" + key;
});
});
</script>
{% if key %}
<div class="bordered">
<strong>Mail this URL on to the next person!</strong>
<div id="url-div" style="float: left;"></div>
<button id="copy-button" style="float: right;">Copy to Clipboard</button>
</div>
<script type="module">
let div = document.getElementById('url-div');
let url = document.location;
div.innerHTML = `<a href="${url}">${url}</div>`;
let button = document.getElementById('copy-button');
button.addEventListener('click', evt => {
navigator.clipboard.writeText(url);
button.innerHTML = "Copied!";
button.disabled = true;
setTimeout(() => {
button.innerHTML = "Copy to Clipboard";
button.disabled = false;
}, 2000);
});
</script>
<div class="bordered">
<strong><span class="post">POST</span> distance</strong>
<table style="width: 100%">
<tr><td>Number of words (excl. title)</td><td>{{ stats.words }}</td></tr>
<tr><td>Number of newlines (excl. title)</td><td>{{ stats.lines }}</td></tr>
<tr><td>Round-trip distance</td><td>{{ stats.roundtrip }} km</td></tr>
<tr><td>Total distance</td><td><strong>{{ stats.km }} km</strong> ({{ stats.mi }} mi)</td></tr>
</table>
<img style="width: 100%" src="static/route.png">
</div>
{% endif %}
</body>
</html>