diff --git a/img/Vaso rovesciato.png b/img/Acquario.png similarity index 100% rename from img/Vaso rovesciato.png rename to img/Acquario.png diff --git a/img/Bestia satanica.png b/img/Capricorno.png similarity index 100% rename from img/Bestia satanica.png rename to img/Capricorno.png diff --git a/img/Gemelli?.png b/img/Gemelli.png similarity index 100% rename from img/Gemelli?.png rename to img/Gemelli.png diff --git a/img/Centauro Arciere.png b/img/Sagittario.png similarity index 100% rename from img/Centauro Arciere.png rename to img/Sagittario.png diff --git a/img/Vergine?.png b/img/Vergine.png similarity index 100% rename from img/Vergine?.png rename to img/Vergine.png diff --git a/index.html b/index.html index bdcfbdc..52a0215 100644 --- a/index.html +++ b/index.html @@ -12,15 +12,17 @@
OROSCOPO DEI POVERY 2025 AI EDITION
- - -
- - -
-
- -
+ + +
+ + +
+ +
+
Descrizione
@@ -49,7 +51,38 @@ preferenze che potrebbero essere nascoste anche a noi stessi.
Stats
-
lorem
+
+

+ Utenti che hanno fatto affidamento a questo oroscopo: + 0 +

+ + + + + + + + + + + + + + + + + + + + + + + + + +
Utenti di segno ariete: 0Utenti di segno toro: 0
Utenti di segno gemelli: 0Utenti di segno cancro: 0
Utenti di segno leone: 0Utenti di segno vergine: 0
Utenti di segno bilancia: 0Utenti di segno scorpione: 0
Utenti di segno sagittario: 0Utenti di segno capricorno: 0
Utenti di segno acquario: 0Utenti di segno pesci: 0
+
Controls
@@ -69,17 +102,17 @@

@@ -123,9 +156,9 @@ document .getElementById("selezioneCostellazione") .addEventListener("input", function () { - document.body.style = `background-image: url("img/${ + document.body.style = `background: url("img/${ document.getElementById("selezioneCostellazione").value - }.png"); background-repeat: no-repeat; background-size: cover`; + }.png") center no-repeat #071828`; }); document.getElementById("testo").addEventListener("input", coloreTesto); @@ -137,55 +170,136 @@ document.getElementById("bordi").addEventListener("input", coloreBordi); function coloreBordi(event) { - document.querySelectorAll( - ".griglia > div" - ).forEach((div) => { - div.style.border = `2px solid ${event.target.value}` + document.querySelectorAll(".griglia > div").forEach((div) => { + div.style.border = `2px solid ${event.target.value}`; }); } async function Oroscopo() { //frasiCaricamento(); - //statistiche(); + document.getElementById("output").innerHTML = ""; - const domani = new Date(Date.now() + 86400000); // 86400000 ms = 1 giorno - const url = "http://127.0.0.1:11434/api/generate"; // Endpoint del server - const data = { - model: "llama3.2-vision", - prompt: `Dimmi l'oroscopo per una persona di nome ${ - document.getElementById("nome").value - }, di segno ${document.getElementById("segno").value} per il giorno ${ - domani.toISOString().split("T")[0] - }, prevedendo fortuna, amore, finanza e salute`, - stream: false, - }; + document.getElementById("bottone").innerHTML = + "Chiedi il tuo pronostico"; + if (Segni()) { + if (!(document.getElementById("nome").value === "")) { + const domani = new Date(Date.now() + 86400000); // 86400000 ms = 1 giorno + const url = "http://127.0.0.1:11434/api/generate"; // Endpoint del server + const data = { + model: "llama3.2-vision", + prompt: `Dimmi l'oroscopo per una persona di nome ${ + document.getElementById("nome").value + }, di segno ${ + document.getElementById("segno").value + } per il giorno ${ + domani.toISOString().split("T")[0] + }, prevedendo fortuna, amore, finanza e salute`, + stream: false, + }; - try { - const response = await fetch(url, { - method: "POST", - headers: { - "Content-Type": "application/json", - }, - body: JSON.stringify(data), - }); + try { + const response = await fetch(url, { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify(data), + }); - if (!response.ok) throw new Error(`Errore HTTP: ${response.status}`); + if (!response.ok) + throw new Error(`Errore HTTP: ${response.status}`); - const result = await response.text(); + const result = await response.text(); - document.getElementById("output").innerHTML = marked.parse( - result - .substring( - result.indexOf('response":"') + 11, - result.indexOf(',"done') - 1 - ) - .replace(/\\n/g, "
") - .replace(/\\/g, "") - ); - } catch (error) { - console.error("Errore nella richiesta:", error); + document.getElementById("output").innerHTML = marked.parse( + result + .substring( + result.indexOf('response":"') + 11, + result.indexOf(',"done') - 1 + ) + .replace(/\\n/g, "
") + .replace(/\\/g, "") + ); + document.getElementById("bottone").innerHTML = + "Chiedi un altro pronostico"; + } catch (error) { + console.error("Errore nella richiesta:", error); + } + } else { + alert("Inserire il proprio nome"); + } } } + + const segniZodiacali = [ + "ariete", + "toro", + "gemelli", + "cancro", + "leone", + "vergine", + "bilancia", + "scorpione", + "sagittario", + "capricorno", + "acquario", + "pesci", + ]; + + // Oggetto per gestire i contatori + let contatori = {}; + + // Recupera i valori dal localStorage oppure inizializza a 0 + segniZodiacali.forEach((segno) => { + contatori[segno] = localStorage.getItem(segno) + ? parseInt(localStorage.getItem(segno)) + : 0; + }); + + // totale utenti + let countTotale = localStorage.getItem("countTotale") + ? parseInt(localStorage.getItem("countTotale")) + : 0; + + // Aggiorna i testi iniziali nella UI + document.getElementById("conteggio").innerHTML = countTotale; + segniZodiacali.forEach((segno) => { + const elem = document.getElementById(`conteggio${capitalize(segno)}`); + if (elem) elem.innerHTML = contatori[segno]; + }); + + // Funzione per gestire il conteggio + function Segni() { + const segno = document.getElementById("segno").value.toLowerCase(); + + if (segniZodiacali.includes(segno)) { + Conteggio(segno); + return true; + } else { + alert("Il segno inserito non è valido"); + return false; + } + } + + // Funzione per incrementare il conteggio e salvare i dati + function Conteggio(segno) { + contatori[segno]++; // Incrementa il conteggio del segno + countTotale++; // Incrementa il conteggio totale + + // Salva in localStorage + localStorage.setItem(segno, contatori[segno]); + localStorage.setItem("countTotale", countTotale); + + // Aggiorna la UI + document.getElementById(`conteggio${capitalize(segno)}`).innerHTML = + contatori[segno]; + document.getElementById("conteggio").innerHTML = countTotale; + } + + // Funzione per capitalizzare la prima lettera (es: "ariete" → "Ariete") + function capitalize(str) { + return str.charAt(0).toUpperCase() + str.slice(1); + } diff --git a/style.css b/style.css index e81df0a..eafdd2b 100644 --- a/style.css +++ b/style.css @@ -33,6 +33,8 @@ grid-area: 2 / 2 / 6 / 3; border: 2px solid green; overflow-y: scroll; + line-height: 1.5em; /* altezza di una riga */ + height: calc((1.5em * 24) + (1.5em / 2)); /* 24 righe */ } .desc { @@ -53,6 +55,11 @@ #color{ display: inline; } + #costellazione{ display: none; +} + +.tabellaColonna2{ + padding-left: 40px; } \ No newline at end of file