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:
parent
7a8d8e1573
commit
75fa0621e4
@ -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
@ -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 {
|
||||
|
@ -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;
|
||||
|
@ -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>
|
||||
|
Loading…
Reference in New Issue
Block a user