mirror of https://github.com/JustKato/FreePad.git
144 lines
6.1 KiB
HTML
144 lines
6.1 KiB
HTML
{{ template "inc/header.html" .}}
|
|
|
|
<style>
|
|
#pad-content {
|
|
height: 16rem;
|
|
}
|
|
</style>
|
|
|
|
<body>
|
|
|
|
<main id="main-card" class="container rounded mt-5 shadow-sm">
|
|
<div class="p-3">
|
|
|
|
<a href="/" class="logo-container w-100 d-flex mb-4">
|
|
<img src="/static/img/logo_transparent.png" alt="Logo" style="max-width: 50%; margin: 0 auto;" class="mx-auto">
|
|
</a>
|
|
|
|
</div>
|
|
|
|
<textarea name="pad-content" id="pad-content" onchange="sendMyData(this)" onkeydown="updateStatus(`Not Saved`, `text-warning`); toggleWritingWatch(this)" class="form-control">{{.post_content}}</textarea>
|
|
|
|
<div id="pad-status" class="my-4 row">
|
|
<div class="col-md-12 col-lg-4 col-xl-4" title="Status">
|
|
<div class="input-group">
|
|
<span class="input-group-text">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-reception-3" viewBox="0 0 16 16">
|
|
<path d="M0 11.5a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-2zm4-3a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 .5.5v5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-5zm4-3a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1-.5-.5v-8zm4 8a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5z"/>
|
|
</svg>
|
|
</span>
|
|
<input type="text" class="form-control" readonly value="Loaded" id="loading_status">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-12 col-lg-4 col-xl-4 mt-4 mt-lg-0 mt-xl-0" title="Current Viewers">
|
|
<div class="input-group">
|
|
<span class="input-group-text">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye" viewBox="0 0 16 16">
|
|
<path d="M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.133 13.133 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.133 13.133 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5c-2.12 0-3.879-1.168-5.168-2.457A13.134 13.134 0 0 1 1.172 8z"></path>
|
|
<path d="M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"></path>
|
|
</svg>
|
|
</span>
|
|
<input type="text" class="form-control" readonly value="1">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-12 col-lg-4 col-xl-4 mt-4 mt-lg-0 mt-xl-0" title="Last Modified">
|
|
<div class="input-group">
|
|
<span class="input-group-text">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-hourglass-split" viewBox="0 0 16 16">
|
|
<path d="M2.5 15a.5.5 0 1 1 0-1h1v-1a4.5 4.5 0 0 1 2.557-4.06c.29-.139.443-.377.443-.59v-.7c0-.213-.154-.451-.443-.59A4.5 4.5 0 0 1 3.5 3V2h-1a.5.5 0 0 1 0-1h11a.5.5 0 0 1 0 1h-1v1a4.5 4.5 0 0 1-2.557 4.06c-.29.139-.443.377-.443.59v.7c0 .213.154.451.443.59A4.5 4.5 0 0 1 12.5 13v1h1a.5.5 0 0 1 0 1h-11zm2-13v1c0 .537.12 1.045.337 1.5h6.326c.216-.455.337-.963.337-1.5V2h-7zm3 6.35c0 .701-.478 1.236-1.011 1.492A3.5 3.5 0 0 0 4.5 13s.866-1.299 3-1.48V8.35zm1 0v3.17c2.134.181 3 1.48 3 1.48a3.5 3.5 0 0 0-1.989-3.158C8.978 9.586 8.5 9.052 8.5 8.351z"/>
|
|
</svg>
|
|
</span>
|
|
<input type="text" class="form-control" id="last_modified_" readonly value="{{.last_modified}}">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<footer class="text-muted py-5 text-center">
|
|
<p class="mb-1">
|
|
FreePad by <a href="https://justkato.me/">©Kato Twofold</a>
|
|
</p>
|
|
<p class="mb-0">
|
|
FreePad is freely available over on our <a href="https://github.com/JustKato/FreePad">GitHub</a>
|
|
</p>
|
|
</footer>
|
|
|
|
</main>
|
|
|
|
{{ template "inc/theme-toggle.html" .}}
|
|
</body>
|
|
|
|
<script>
|
|
function sendMyData(el) {
|
|
const formData = new FormData();
|
|
|
|
// Check if the writing watch was sending something already
|
|
if ( !!window.writingWatch ) {
|
|
// Clear old timeout
|
|
clearTimeout(window.writingWatch);
|
|
}
|
|
|
|
el.setAttribute(`readonly`, `1`);
|
|
|
|
formData.set("content", el.value);
|
|
|
|
updateStatus(`Attempting to save...`, `text-warning`);
|
|
|
|
fetch(window.location.href.toString(), {
|
|
body: formData,
|
|
method: "post",
|
|
})
|
|
.then( resp => {
|
|
resp.json()
|
|
.then( e => {
|
|
document.getElementById(`last_modified_`).value = e.pad.last_modified;
|
|
updateStatus(`Succesfully Saved`, `text-success`);
|
|
})
|
|
.catch( err => {
|
|
updateStatus(`Failed to Save`, `text-error`);
|
|
console.error(err);
|
|
})
|
|
})
|
|
.catch( err => {
|
|
updateStatus(`Failed to Save`, `text-error`);
|
|
console.error(err);
|
|
})
|
|
.finally( () => {
|
|
el.removeAttribute(`readonly`);
|
|
})
|
|
}
|
|
|
|
function toggleWritingWatch(el) {
|
|
|
|
// Check if the writing watch was sending something already
|
|
if ( !!window.writingWatch ) {
|
|
// Clear old timeout
|
|
clearTimeout(window.writingWatch);
|
|
}
|
|
|
|
// Set a timeout for the action
|
|
window.writingWatch = setTimeout( () => {
|
|
// Send out the data
|
|
sendMyData(el)
|
|
}, 750)
|
|
|
|
}
|
|
|
|
function updateStatus(txt, cls) {
|
|
|
|
const loading_status = document.getElementById(`loading_status`)
|
|
|
|
loading_status.value = txt;
|
|
loading_status.classList.remove("text-danger", "text-warning", "text-success", "text-white", "text-primary");
|
|
loading_status.classList.add(cls);
|
|
}
|
|
|
|
document.addEventListener(`DOMContentLoaded`, e => {
|
|
document.getElementById(`pad-content`).focus();
|
|
})
|
|
|
|
</script>
|
|
|
|
{{ template "inc/footer.html" .}} |