1
0
mirror of https://github.com/lus/pasty.git synced 2023-08-10 21:13:09 +03:00

Show character and line count (#33)

This commit is contained in:
Lukas Schulte Pelkum 2022-01-30 15:22:38 +01:00
parent 7a8d8e1573
commit 75fa0621e4
No known key found for this signature in database
GPG Key ID: 408DA7CA81DB885C
5 changed files with 39 additions and 1 deletions

View File

@ -266,6 +266,21 @@ html.embedded #footer, body.embedded #footer {
border-radius: 10px;
}
.container #content_length_container {
position: fixed;
right: 30px;
bottom: 60px;
padding: 10px 15px;
background-color: #222222;
border-radius: 10px;
}
.container #content_length_container span {
background-color: #111111;
padding: 5px 10px;
border-radius: 10px;
}
#footer {
position: fixed;
bottom: 0;

File diff suppressed because one or more lines are too long

View File

@ -222,6 +222,19 @@ html, body {
border-radius: 10px;
}
}
& #content_length_container {
position: fixed;
right: 30px;
bottom: 60px;
padding: 10px 15px;
background-color: #222222;
border-radius: 10px;
& span {
background-color: #111111;
padding: 5px 10px;
border-radius: 10px;
}
}
}
#footer {

View File

@ -11,6 +11,9 @@ const INPUT_ELEMENT = document.getElementById("input");
const LIFETIME_CONTAINER_ELEMENT = document.getElementById("lifetime_container");
const CHARACTER_AMOUNT_ELEMENT = document.getElementById("characters");
const LINES_AMOUNT_ELEMENT = document.getElementById("lines");
const BUTTONS_DEFAULT_ELEMENT = document.getElementById("buttons_default");
const BUTTON_NEW_ELEMENT = document.getElementById("btn_new");
const BUTTON_SAVE_ELEMENT = document.getElementById("btn_save");
@ -112,6 +115,7 @@ export async function initialize() {
INPUT_ELEMENT.addEventListener("input", () => {
updateLineNumbers(INPUT_ELEMENT.value);
if (BUTTON_SAVE_ELEMENT.hasAttribute("disabled") && INPUT_ELEMENT.value.length > 0) {
BUTTON_SAVE_ELEMENT.removeAttribute("disabled");
}
@ -147,6 +151,9 @@ function updateCode() {
}
function updateLineNumbers(content) {
CHARACTER_AMOUNT_ELEMENT.innerText = content.length;
LINES_AMOUNT_ELEMENT.innerText = content.split(/\n/).length;
if (content == "") {
LINE_NUMBERS_ELEMENT.innerHTML = "<span>></span>";
return;

View File

@ -113,6 +113,9 @@
<div id="lifetime_container" class="hidden">
Lifetime: <span id="lifetime">loading...</span>
</div>
<div id="content_length_container">
<span id="characters">0</span> characters, <span id="lines">0</span> lines
</div>
<div id="linenos"><span>></span></div>
<div id="content">
<div id="code"></div>