formattazione

This commit is contained in:
La Programmatrice Verde 2025-04-05 16:24:49 +02:00
parent ff9c0d27c4
commit 05b55e05ed

555
script.js
View File

@ -1,54 +1,53 @@
document.addEventListener("onload", Init()); document.addEventListener("onload", Init());
function Init(){ function Init() {
aggiungiDefault(); aggiungiDefault();
impostaImmagine(); impostaImmagine();
} }
const segniZodiacali = [ const segniZodiacali = [
"Ariete", "Ariete",
"Toro", "Toro",
"Gemelli", "Gemelli",
"Cancro", "Cancro",
"Leone", "Leone",
"Vergine", "Vergine",
"Bilancia", "Bilancia",
"Scorpione", "Scorpione",
"Sagittario", "Sagittario",
"Capricorno", "Capricorno",
"Acquario", "Acquario",
"Pesci", "Pesci",
]; ];
/***********************************************Sezione Stats*******************************************************************************************/ /***********************************************Sezione Stats*******************************************************************************************/
stats = { stats = {
contatore: [ contatore: [
"conteggioTotale", "conteggioTotale",
"conteggioAriete", "conteggioAriete",
"conteggioToro", "conteggioToro",
"conteggioGemelli", "conteggioGemelli",
"conteggioCancro", "conteggioCancro",
"conteggioLeone", "conteggioLeone",
"conteggioVergine", "conteggioVergine",
"conteggioBilancia", "conteggioBilancia",
"conteggioScorpione", "conteggioScorpione",
"conteggioSagittario", "conteggioSagittario",
"conteggioCapricorno", "conteggioCapricorno",
"conteggioAcquario", "conteggioAcquario",
"conteggioPesci", "conteggioPesci",
], ],
aggiornaStat(segno) { aggiornaStat(segno) {
document.getElementById(this.contatore[segno]).innerHTML = document.getElementById(this.contatore[segno]).innerHTML =
parseInt(document.getElementById(this.contatore[segno]).innerHTML) + parseInt(document.getElementById(this.contatore[segno]).innerHTML) + 1;
1; },
}, };
};
/*******************************************************************************************************************************************************/ /*******************************************************************************************************************************************************/
/***********************************************Sezione Content*****************************************************************************************/ /***********************************************Sezione Content*****************************************************************************************/
function Oroscopo() { function Oroscopo() {
const frasi = [ const frasi = [
"Una nuova opportunità lavorativa si presenta, sfruttala!", "Una nuova opportunità lavorativa si presenta, sfruttala!",
"Ascolta i consigli degli amici, potrebbero essere utili.", "Ascolta i consigli degli amici, potrebbero essere utili.",
@ -92,60 +91,60 @@ function Init(){
if (!(document.getElementById("nome").value === "")) { if (!(document.getElementById("nome").value === "")) {
if (!(document.getElementById("segno").value === "Seleziona un segno")) { if (!(document.getElementById("segno").value === "Seleziona un segno")) {
if ( if (
document.getElementById("bottone").innerHTML === document.getElementById("bottone").innerHTML ===
"Chiedi un altro pronostico" "Chiedi un altro pronostico"
) {
let isSegnoDefaultPresent = false;
for (
let i = 0;
i <
document.getElementById("segno").getElementsByTagName("option")
.length && !isSegnoDefaultPresent;
i++
) { ) {
let isSegnoDefaultPresent = false; if (
document.getElementById("segno").getElementsByTagName("option")[
for ( i
let i = 0; ] == "Seleziona un segno"
i < ) {
document.getElementById("segno").getElementsByTagName("option") document.getElementById("segno").value = "Seleziona un segno";
.length && !isSegnoDefaultPresent; isSegnoDefaultPresent = true;
i++ }
) {
if (
document.getElementById("segno").getElementsByTagName("option")[
i
] == "Seleziona un segno"
) {
document.getElementById("segno").value = "Seleziona un segno";
isSegnoDefaultPresent = true;
}
}
if (!isSegnoDefaultPresent) {
aggiungiDefault();
}
document.getElementById("segno").dispatchEvent(new Event("change"));
document.getElementById("link").style.display = "block";
document.getElementById("nome").value = "";
document.getElementById("bottone").innerHTML = "Chiedi il tuo pronostico";
} }
else {
stats.aggiornaStat(0);
stats.aggiornaStat(
stats.contatore.indexOf(
`conteggio${document.getElementById("segno").value}`
)
);
aggiungiNome(); if (!isSegnoDefaultPresent) {
aggiungiDefault();
document.getElementById("output").innerHTML =
frasi[Math.floor(Math.random() * frasi.length)];
document.getElementById("bottone").innerHTML =
"Chiedi un altro pronostico";
if (document.getElementById("segno").disabled) {
document.getElementById("segno").disabled = false;
}
} }
document.getElementById("segno").dispatchEvent(new Event("change"));
document.getElementById("link").style.display = "block";
document.getElementById("nome").value = "";
document.getElementById("bottone").innerHTML =
"Chiedi il tuo pronostico";
} else {
stats.aggiornaStat(0);
stats.aggiornaStat(
stats.contatore.indexOf(
`conteggio${document.getElementById("segno").value}`
)
);
aggiungiNome();
document.getElementById("output").innerHTML =
frasi[Math.floor(Math.random() * frasi.length)];
document.getElementById("bottone").innerHTML =
"Chiedi un altro pronostico";
if (document.getElementById("segno").disabled) {
document.getElementById("segno").disabled = false;
}
}
} else { } else {
alert("Inserire il proprio segno"); alert("Inserire il proprio segno");
} }
@ -154,199 +153,207 @@ function Init(){
} }
} }
//gestione UI sezione trova segno //gestione UI sezione trova segno
document.getElementById("segno").addEventListener("input", function () { document.getElementById("segno").addEventListener("input", function () {
document.getElementById("link").style.display = "none"; document.getElementById("link").style.display = "none";
}); });
//mostro la parte per inserire la data e trovare il proprio segno e nascondo defaultInput //mostro la parte per inserire la data e trovare il proprio segno e nascondo defaultInput
document.getElementById("link").addEventListener("click", function () { document.getElementById("link").addEventListener("click", function () {
document.getElementById("output").innerHTML = ""; document.getElementById("output").innerHTML = "";
document.getElementById("link").style.display = "none"; document.getElementById("link").style.display = "none";
document.getElementById("defaultInput").style.display = "none"; document.getElementById("defaultInput").style.display = "none";
document.getElementById("bottone").style.display = "none"; document.getElementById("bottone").style.display = "none";
document document
.querySelectorAll("#trovaSegno > :not(#link)") .querySelectorAll("#trovaSegno > :not(#link)")
.forEach((tag) => (tag.style.display = "inline")); .forEach((tag) => (tag.style.display = "inline"));
}); });
function trovaSegno() { function trovaSegno() {
document.getElementById('segno').getElementsByTagName("option")[0].remove() document.getElementById("segno").getElementsByTagName("option")[0].remove();
let isDateInserted = document.getElementById("date").value !== ""; let isDateInserted = document.getElementById("date").value !== "";
if (isDateInserted) { if (isDateInserted) {
const nascita = document.getElementById("date").value.split("-"); const nascita = document.getElementById("date").value.split("-");
const mese = parseInt(nascita[1]); const mese = parseInt(nascita[1]);
const giorno = parseInt(nascita[2]); const giorno = parseInt(nascita[2]);
const campoSegno = document.getElementById("segno"); const campoSegno = document.getElementById("segno");
switch (mese) { switch (mese) {
case 3: case 3:
if (giorno >= 20) { if (giorno >= 20) {
campoSegno.value = segniZodiacali[0]; campoSegno.value = segniZodiacali[0];
} else {
campoSegno.value = segniZodiacali[11];
}
break;
case 4:
if (giorno >= 19) {
campoSegno.value = segniZodiacali[1];
} else {
campoSegno.value = segniZodiacali[0];
}
break;
case 5:
if (giorno >= 20) {
campoSegno.value = segniZodiacali[2];
} else {
campoSegno.value = segniZodiacali[1];
}
break;
case 6:
if (giorno >= 20) {
campoSegno.value = segniZodiacali[3];
} else {
campoSegno.value = segniZodiacali[2];
}
break;
case 7:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[4];
} else {
campoSegno.value = segniZodiacali[3];
}
break;
case 8:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[5];
} else {
campoSegno.value = segniZodiacali[4];
}
break;
case 9:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[6];
} else {
campoSegno.value = segniZodiacali[5];
}
break;
case 10:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[7];
} else {
campoSegno.value = segniZodiacali[6];
}
break;
case 11:
if (giorno >= 21) {
campoSegno.value = segniZodiacali[8];
} else {
campoSegno.value = segniZodiacali[7];
}
break;
case 12:
if (giorno >= 21) {
campoSegno.value = segniZodiacali[9];
} else {
campoSegno.value = segniZodiacali[8];
}
break;
case 1:
if (giorno >= 20) {
campoSegno.value = segniZodiacali[10];
} else {
campoSegno.value = segniZodiacali[9];
}
break;
case 2:
if (giorno >= 18) {
campoSegno.value = segniZodiacali[11];
} else {
campoSegno.value = segniZodiacali[10];
}
break;
}
document.getElementById("segno").dispatchEvent(new Event("change"));
// Reset della UI a prima di premere il link
document.getElementById("link").style.display = "block";
document.getElementById("defaultInput").style.display = "block";
document.getElementById("bottone").style.display = "block";
document
.querySelectorAll("#trovaSegno > :not(#link)")
.forEach((tag) => (tag.style.display = "none"));
campoSegno.disabled = true;
} else { } else {
alert("Inserire una data completa"); campoSegno.value = segniZodiacali[11];
} }
} break;
case 4:
function aggiungiNome(){ if (giorno >= 19) {
let found = false; campoSegno.value = segniZodiacali[1];
nome = document.createElement('li'); } else {
nome.innerHTML = document.getElementById('nome').value; campoSegno.value = segniZodiacali[0];
for(let i = 0; i < document.getElementsByClassName("nomi")[0].getElementsByTagName('ul')[0].getElementsByTagName('li').length && !found; i++){
if(document.getElementsByClassName("nomi")[0].getElementsByTagName('ul')[0].getElementsByTagName('li')[i].innerHTML == nome.innerHTML) {
found = true;
}
} }
if (!found){ break;
document.getElementsByClassName("nomi")[0].getElementsByTagName("ul")[0].appendChild(nome); case 5:
if (giorno >= 20) {
campoSegno.value = segniZodiacali[2];
} else {
campoSegno.value = segniZodiacali[1];
} }
} break;
case 6:
//gestione immagine segno if (giorno >= 20) {
function impostaImmagine() { campoSegno.value = segniZodiacali[3];
const immagine = document.createElement("img"); } else {
immagine.setAttribute( campoSegno.value = segniZodiacali[2];
"src",
'img/Oroscopo.jpeg'
);
immagine.setAttribute("width", `${document.getElementsByClassName("segno")[0].offsetWidth}`);
document.getElementsByClassName('segno')[0].appendChild(immagine);
}
document.getElementById("segno").addEventListener("change", function() {
cambiaImmagine(document.getElementById("segno").value);
});
function cambiaImmagine(segno) {
const immagine = document.getElementsByClassName('segno')[0].getElementsByTagName("img")[0];
if(segno == "Seleziona un segno"){
immagine.setAttribute(
"src",
'img/Oroscopo.jpeg'
);
} }
else{ break;
immagine.setAttribute( case 7:
"src", if (giorno >= 22) {
`img/${segno}.png` campoSegno.value = segniZodiacali[4];
); } else {
} campoSegno.value = segniZodiacali[3];
} }
break;
case 8:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[5];
} else {
campoSegno.value = segniZodiacali[4];
}
break;
case 9:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[6];
} else {
campoSegno.value = segniZodiacali[5];
}
break;
case 10:
if (giorno >= 22) {
campoSegno.value = segniZodiacali[7];
} else {
campoSegno.value = segniZodiacali[6];
}
break;
case 11:
if (giorno >= 21) {
campoSegno.value = segniZodiacali[8];
} else {
campoSegno.value = segniZodiacali[7];
}
break;
case 12:
if (giorno >= 21) {
campoSegno.value = segniZodiacali[9];
} else {
campoSegno.value = segniZodiacali[8];
}
break;
case 1:
if (giorno >= 20) {
campoSegno.value = segniZodiacali[10];
} else {
campoSegno.value = segniZodiacali[9];
}
break;
case 2:
if (giorno >= 18) {
campoSegno.value = segniZodiacali[11];
} else {
campoSegno.value = segniZodiacali[10];
}
break;
}
//modifiche select del segno dinamiche document.getElementById("segno").dispatchEvent(new Event("change"));
function aggiungiDefault() { // Reset della UI a prima di premere il link
const selezioneDefault = document.createElement("option"); document.getElementById("link").style.display = "block";
selezioneDefault.innerHTML = "Seleziona un segno"; document.getElementById("defaultInput").style.display = "block";
document document.getElementById("bottone").style.display = "block";
.getElementById("segno") document
.insertBefore( .querySelectorAll("#trovaSegno > :not(#link)")
selezioneDefault, .forEach((tag) => (tag.style.display = "none"));
document.getElementById("segno").getElementsByTagName("option")[0] campoSegno.disabled = true;
); } else {
document.getElementById("segno").value = "Seleziona un segno"; alert("Inserire una data completa");
} }
}
function aggiungiNome() {
let found = false;
nome = document.createElement("li");
nome.innerHTML = document.getElementById("nome").value;
for (
let i = 0;
i <
document document
.getElementById("segno") .getElementsByClassName("nomi")[0]
.addEventListener("mousedown", function () { .getElementsByTagName("ul")[0]
if (this.value == "Seleziona un segno") { .getElementsByTagName("li").length && !found;
this.getElementsByTagName("option")[0].remove(); i++
} ) {
}); if (
document
.getElementsByClassName("nomi")[0]
.getElementsByTagName("ul")[0]
.getElementsByTagName("li")[i].innerHTML == nome.innerHTML
) {
found = true;
}
}
if (!found) {
document
.getElementsByClassName("nomi")[0]
.getElementsByTagName("ul")[0]
.appendChild(nome);
}
}
//gestione immagine segno
/*******************************************************************************************************************************************************/ function impostaImmagine() {
const immagine = document.createElement("img");
immagine.setAttribute("src", "img/Oroscopo.jpeg");
immagine.setAttribute(
"width",
`${document.getElementsByClassName("segno")[0].offsetWidth}`
);
document.getElementsByClassName("segno")[0].appendChild(immagine);
}
document.getElementById("segno").addEventListener("change", function () {
cambiaImmagine(document.getElementById("segno").value);
});
function cambiaImmagine(segno) {
const immagine = document
.getElementsByClassName("segno")[0]
.getElementsByTagName("img")[0];
if (segno == "Seleziona un segno") {
immagine.setAttribute("src", "img/Oroscopo.jpeg");
} else {
immagine.setAttribute("src", `img/${segno}.png`);
}
}
//modifiche select del segno dinamiche
function aggiungiDefault() {
const selezioneDefault = document.createElement("option");
selezioneDefault.innerHTML = "Seleziona un segno";
document
.getElementById("segno")
.insertBefore(
selezioneDefault,
document.getElementById("segno").getElementsByTagName("option")[0]
);
document.getElementById("segno").value = "Seleziona un segno";
}
document.getElementById("segno").addEventListener("mousedown", function () {
if (this.value == "Seleziona un segno") {
this.getElementsByTagName("option")[0].remove();
}
});
/*******************************************************************************************************************************************************/