Add the constant res to the screen

This commit is contained in:
Mylloon 2022-06-23 16:45:25 +02:00
parent 5ffbfeef58
commit c9db599d87
Signed by: Anri
GPG key ID: A82D63DFF8D1317F
2 changed files with 31 additions and 11 deletions

View file

@ -11,5 +11,5 @@
.firstname-constant p {
text-align: center;
font-size: 10em;
font-size: 5em;
}

View file

@ -9,12 +9,20 @@ const main = () => {
input.value = "";
// Create the paragraph of the firstname
let paragraph_firstname = document.createElement("p");
paragraph_firstname.className = "firstname-constant-paragraph";
document.getElementsByClassName("firstname-constant").item(0).append(paragraph_firstname);
defaultFirstname()
let string_firstname = document.createElement("p");
string_firstname.className = "firstname-constant-string";
// Create the paragraph of the constant
let double_firstname = document.createElement("p");
double_firstname.className = "firstname-constant-double";
// Add the elements to the page
document.getElementsByClassName("firstname-constant").item(0).append(string_firstname);
document.getElementsByClassName("firstname-constant").item(0).append(double_firstname);
// Fill informations with placeholder
defaultFirstname();
defaultConstant();
// Call callback when editing the input
input.addEventListener("input", updateConst);
@ -26,23 +34,35 @@ const updateConst = () => {
if(firstname.length) {
const data = getConst(firstname.split(""));
getParagraph().textContent = firstname.replace(/^\w/, (c) => c.toUpperCase());
console.log(`output: ${data.const} - ${JSON.stringify(data.infos)}`);
getString().textContent = firstname.replace(/^\w/, (c) => c.toUpperCase());
getDouble().textContent = data.const;
console.log(`info: ${JSON.stringify(data.infos)}`);
} else {
defaultFirstname();
defaultConstant();
}
};
// Get the paragraph of the name
const getParagraph = () => {
const getString = () => {
return document.getElementsByClassName("firstname-constant").item(0)
.getElementsByClassName("firstname-constant-paragraph").item(0);
.getElementsByClassName("firstname-constant-string").item(0);
}
// Get the paragraph of the constant
const getDouble = () => {
return document.getElementsByClassName("firstname-constant").item(0)
.getElementsByClassName("firstname-constant-double").item(0);
}
// Set the paragraph of the name to the placeholder
const defaultFirstname = () => {
getParagraph().textContent = input.placeholder;
getString().textContent = input.placeholder;
}
// Set the paragraph of the constant to the placeholder
const defaultConstant = () => {
getDouble().textContent = getConst(input.placeholder.split("")).const;
}
const getConst = (letters = Array) => {