/***********************************************Sezione Stats*******************************************************************************************/

let stats = {
  contatore: [
    "conteggioTotale",
    "conteggioAriete",
    "conteggioToro",
    "conteggioGemelli",
    "conteggioCancro",
    "conteggioLeone",
    "conteggioVergine",
    "conteggioBilancia",
    "conteggioScorpione",
    "conteggioSagittario",
    "conteggioCapricorno",
    "conteggioAcquario",
    "conteggioPesci",
  ],
  aggiornaStat(segno) {
    document.getElementById(this.contatore[segno]).innerHTML =
      parseInt(document.getElementById(this.contatore[segno]).innerHTML) + 1;
  },
  statsDefault() {
    document.getElementById('stats').style.display = "none";
    document.getElementsByClassName('nomeRiquadro1')[0].style.display = "none";
    document.getElementsByClassName('nomeRiquadro3')[0].style.gridArea = "3 / 1 / 4 / 2";
    document.getElementsByClassName("segno")[0].style.gridArea = "4 / 1 / 5 / 2";

    document.getElementsByClassName('nomeRiquadro2')[0].style.display = "none";
    document.getElementsByClassName('nomi')[0].style.display = "none";
  
  },
  display() {
    document.getElementById('stats').style.display = "block";
    document.getElementsByClassName('nomeRiquadro1')[0].style.display = "block";
    document.getElementsByClassName('nomeRiquadro3')[0].style.gridArea = "5 / 1 / 6 / 2";
    document.getElementsByClassName("segno")[0].style.gridArea = "6 / 1 / 7 / 2";
  
    document.getElementsByClassName('nomeRiquadro2')[0].style.display = "block";
    document.getElementsByClassName('nomi')[0].style.display = "block";
  }
};

/*******************************************************************************************************************************************************/

document.addEventListener("onload", Init());

function Init() {
  aggiungiDefault();
  impostaImmagine();
  stats.statsDefault();
}

const segniZodiacali = [
  "Ariete",
  "Toro",
  "Gemelli",
  "Cancro",
  "Leone",
  "Vergine",
  "Bilancia",
  "Scorpione",
  "Sagittario",
  "Capricorno",
  "Acquario",
  "Pesci",
];

/***********************************************Sezione Content*****************************************************************************************/

function Oroscopo() {
  const frasi = [
    "Una nuova opportunità lavorativa si presenta, sfruttala!",
    "Ascolta i consigli degli amici, potrebbero essere utili.",
    "Attento alle spese, non esagerare.",
    "La vita sentimentale si anima, aspettati un sorriso!",
    "Concentrati sui tuoi obiettivi e non lasciare che le distrazioni ti rallentino.",
    "Sii paziente, i risultati non tarderanno.",
    "Un cambiamento di programma potrebbe essere necessario.",
    "La tua intuizione è acuta, ascoltala!",
    "Non lasciare che le preoccupazioni ti consumino.",
    "Il tuo amore per la famiglia e gli amici si rafforza.",
    "Sii più aperto ai nuovi progetti, potrebbero essere interessanti!",
    "Non esitare a chiedere aiuto quando ne hai bisogno.",
    "La tua autorità è riconosciuta e apprezzata.",
    "Sii cauto con le tue finanze, non spendere troppo!",
    "Non lasciare che la pigrizia ti rallenti.",
    "Le tue abilità organizzative sono essenziali per un nuovo progetto.",
    "Sii più socievole e aperto con gli altri, potresti scoprire nuove amicizie!",
    "Non esitare a chiedere chiarimenti quando ne hai bisogno.",
    "La tua vita sociale si anima, aspettati un'intrattenimento!",
    "Sii più equilibrato e razionale nelle tue decisioni.",
    "Non lasciare che la competitività ti consumi.",
    "I segreti di cui sei a conoscenza potrebbero essere utili per aiutare qualcuno.",
    "Sii più aperto alle novità e non temere il cambiamento!",
    "Non esitare a difendere ciò che è giusto.",
    "La tua ambizione si rafforza, sfruttala per raggiungere nuovi obiettivi!",
    "Sii più paziente e non affrettarti troppo.",
    "Non lasciare che la curiosità ti porti a commettere errori.",
    "La tua responsabilità è apprezzata e riconosciuta.",
    "Sii più aperto alle novità e non temere il cambiamento!",
    "Non esitare a chiedere aiuto quando ne hai bisogno.",
    "La tua creatività è essenziale per un nuovo progetto.",
    "Sii più socievole e aperto con gli altri, potresti scoprire nuove amicizie!",
    "Non lasciare che la curiosità ti porti a commettere errori.",
    "La tua intuizione è acuta, ascoltala!",
    "Sii più aperto alle novità e non temere il cambiamento!",
    "Non esitare a chiedere aiuto quando ne hai bisogno.",
  ];

  document.getElementById("output").innerHTML = "";

  if (!(document.getElementById("nome").value === "")) {
    if (!(document.getElementById("segno").value === "Seleziona un segno")) {
      if (
        document.getElementById("bottone").innerHTML ===
        "Chiedi un altro pronostico"
      ) {
        let isSegnoDefaultPresent = false;

        for (
          let i = 0;
          i <
            document.getElementById("segno").getElementsByTagName("option")
              .length && !isSegnoDefaultPresent;
          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}`
          )
        );
        stats.display();

        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 {
      alert("Inserire il proprio segno");
    }
  } else {
    alert("Inserire il proprio nome");
  }
}

//gestione UI sezione trova segno
document.getElementById("segno").addEventListener("input", function () {
  document.getElementById("link").style.display = "none";
});

//mostro la parte per inserire la data e trovare il proprio segno e nascondo defaultInput
document.getElementById("link").addEventListener("click", function () {
  document.getElementById("output").innerHTML = "";
  document.getElementById("link").style.display = "none";
  document.getElementById("defaultInput").style.display = "none";
  document.getElementById("bottone").style.display = "none";
  document
    .querySelectorAll("#trovaSegno > :not(#link)")
    .forEach((tag) => (tag.style.display = "inline"));
});

function trovaSegno() {
  document.getElementById("segno").getElementsByTagName("option")[0].remove();
  let isDateInserted = document.getElementById("date").value !== "";

  if (isDateInserted) {
    const nascita = document.getElementById("date").value.split("-");
    const mese = parseInt(nascita[1]);
    const giorno = parseInt(nascita[2]);
    const campoSegno = document.getElementById("segno");

    switch (mese) {
      case 3:
        if (giorno >= 20) {
          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 {
    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
        .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) {
    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();
  }
});

/*******************************************************************************************************************************************************/