Anri/Constnium
1
0
Fork 0
Code Issues 1 Pull requests Projects Releases Packages 1 Wiki Activity

Add the constant res to the screen

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/css/style.css
View file

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

40
public/js/main.js
View file

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