Js

(function () {

    const setItemOriginale = Storage.prototype.setItem;

    Storage.prototype.setItem = function (chiave, valore) {

        if (chiave === "mergeCasaConsenso") {

            console.error(
                "🚨 QUALCUNO STA SCRIVENDO:",
                chiave,
                valore
            );

            console.trace();

            debugger;
        }

        return setItemOriginale.call(
            this,
            chiave,
            valore
        );
    };

})();

console.log("GAME.JS CARICATO");
console.log("TABELLONE:", document.getElementById("tabellone"));

const RIGHE = 9;
const COLONNE = 7;

let tabellone = [];
let rigaMerge = null;
let colonnaMerge = null;
let moltiplicatore = 1;
let energiaGiocatore = 100;

let moneteGiocatore = 0;
let diamantiGiocatore = 0;

let livelloGiocatore = 1;
let esperienzaGiocatore = 0;

let puntiOrdini = 0;
const PUNTI_ORDINI_RICHIESTI = 10;
let oggettiAcquistatiInSospeso = [];

let oggettiNelDeposito = [];

let celleDepositoSbloccate = 5;
let oggettoInRientroDalDeposito = null;

let premiInAttesa = 0;
const OGGETTI_PREMIO = 10;

const XP_PER_LIVELLO = 100;

let ristrutturazioni = {
    muri: 0,
    finestre: 0,
    porta: 0,
    arredamento: 0,
    esterno: 0
};

const costiRistrutturazione = [
    400,
    800,
    1200,
    1600,
    2000
];

let ordiniAttuali = [
    {
        oggetti: [
            {
                tipo: "pane",
                livello: 0
            },
            {
                tipo: "cola",
                livello: 0
            },
            {
                tipo: "tavolo",
                livello: 0
            }
        ],
        ricompensa: 100
    }
];

let ultimoAggiornamentoEnergia = Date.now();
const TEMPO_RICARICA_ENERGIA = 4 * 60 * 1000;

let livelliSbloccati = {
    pane: 3,
    cola: 3,
    tavolo: 3
};


// ================================
// OGGETTI
// ================================

const immaginiOggetti = {
    pane: [
        "immagini/pane/livello1.png",
        "immagini/pane/livello2.png",
        "immagini/pane/livello3.png",
        "immagini/pane/livello4.png",
        "immagini/pane/livello5.png",
        "immagini/pane/livello6.png",
        "immagini/pane/livello7.png"
    ]
};

const livelliOggetti = {

    pane: [
        "🌾", // 1 Farina
        "🥣", // 2 Impasto
        "🍞", // 3 Impasto cotto
        "🥖", // 4 Pane
        "🥪", // 5 Panino
        "🥪", // 6 Panino farcito
        "🥙", // 7 Tramezzino farcito
        "🥖", // 8 Baguette farcita
        "🍔", // 9 Hamburger
        "🍔"  // 10 Hamburger fast-food
    ],

    cola: [
        "💧", // 1 Bottiglietta d'acqua
        "🍋", // 2 Acqua al limone
        "🥤", // 3 Sciroppo
        "🥤", // 4 Bibita
        "🥤", // 5 Cola
        "🧃", // 6 Succo
        "🧋", // 7 Frappè
        "🥤", // 8 Bibita grande
        "🧋", // 9 Frappè gigante
        "🥤"  // 10 Maxi bibita fast-food
    ],

    tavolo: [
        "🪵", // 1 Asse di legno
        "🪚", // 2 Tavola
        "🦵", // 3 Gamba di mobile
        "🪑", // 4 Sgabello
        "🪑", // 5 Sedia
        "🪑", // 6 Sedia imbottita
        "🛋️", // 7 Poltrona
        "🛋️", // 8 Divanetto
        "🛋️", // 9 Divano
        "🛋️"  // 10 Divano di lusso
    ]

};


// ================================
// CREA OGGETTO
// ================================

function creaOggetto(tipo, livello) {

    return {
        tipo: tipo,
        livello: livello
    };
}


// ================================
// CREA TABELLONE
// ================================

// ================================
// GENERA OGGETTO IN UNA CASELLA LIBERA
// ================================

function animaOggettoDalGeneratore(
    tipo,
    livello,
    rigaDestinazione,
    colonnaDestinazione,
    elementoGeneratore
) {

    const cellaDestinazione =
        document.querySelector(
            `.cella[data-riga="${rigaDestinazione}"][data-colonna="${colonnaDestinazione}"]`
        );

    if (!cellaDestinazione) {
        return;
    }

    const posizione =
        elementoGeneratore.getBoundingClientRect();

    const clone =
        document.createElement("div");

    clone.className =
        "oggettoRientroDeposito";

if (
    immaginiOggetti[tipo] &&
    immaginiOggetti[tipo][livello]
) {

    clone.innerHTML = `
        <img
            src="${immaginiOggetti[tipo][livello]}"
            alt=""
        >
    `;

} else {

    clone.innerHTML =
        livelliOggetti[tipo]?.[livello] || "📦";
}

    clone.style.position = "fixed";

    clone.style.left =
        posizione.left +
        posizione.width / 2 +
        "px";

    clone.style.top =
        posizione.top +
        posizione.height / 2 +
        "px";

    clone.style.zIndex = "99999";
    clone.style.pointerEvents = "none";

    document.body.appendChild(clone);

    const destinazione =
        cellaDestinazione.getBoundingClientRect();

    requestAnimationFrame(() => {

        clone.style.left =
            destinazione.left +
            destinazione.width / 2 +
            "px";

        clone.style.top =
            destinazione.top +
            destinazione.height / 2 +
            "px";

        clone.style.transform =
            "translate(-50%, -50%) scale(.8)";
    });

    setTimeout(() => {

        clone.remove();

    }, 450);
}

function generaOggetto(tipoGeneratore = "generatorePane") {

    const caselleLibere = [];

    for (let riga = 0; riga < RIGHE; riga++) {

        for (let colonna = 0; colonna < COLONNE; colonna++) {

            if (tabellone[riga][colonna] === null) {

                caselleLibere.push({
                    riga: riga,
                    colonna: colonna
                });

            }
        }
    }

    if (caselleLibere.length === 0) {
        return false;
    }

    let tipo = "pane";

    if (tipoGeneratore === "generatoreBevanda") {
        tipo = "cola";
    }

    if (tipoGeneratore === "generatoreOggetto") {
        tipo = "tavolo";
    }

    let livello = 0;

    if (moltiplicatore === 2) {
        livello = 1;
    }

    if (moltiplicatore === 4) {
        livello = 2;
    }

    // Il livello richiesto deve essere sbloccato
    if (
        livello + 1 >
        livelliSbloccati[tipo]
    ) {
        return false;
    }

    // Controlla che il livello esista
    if (
        !livelliOggetti[tipo] ||
        livello >= livelliOggetti[tipo].length
    ) {
        return false;
    }

    const posizione =
        caselleLibere[
            Math.floor(
                Math.random() * caselleLibere.length
            )
        ];

    tabellone[posizione.riga][posizione.colonna] =
        creaOggetto(tipo, livello);

return {
    tipo: tipo,
    livello: livello,
    riga: posizione.riga,
    colonna: posizione.colonna
};
}

function impostaMoltiplicatore(valore) {

    moltiplicatore = valore;

    const bottone =
        document.getElementById("bottoneMoltiplicatore");

    if (bottone) {
        bottone.textContent = "X" + valore;
    }
}


function cambiaMoltiplicatore() {

    if (moltiplicatore === 1) {
        impostaMoltiplicatore(2);
    }

    else if (moltiplicatore === 2) {
        impostaMoltiplicatore(4);
    }

    else if (moltiplicatore === 4) {
        impostaMoltiplicatore(8);
    }

    else {
        impostaMoltiplicatore(1);
    }
}

function creaTabellone() {

    const area = document.getElementById("tabellone");

    if (!area) {
        console.error("ERRORE: #tabellone non trovato");
        return;
    }

    area.innerHTML = "";
    tabellone = [];

    for (let riga = 0; riga < RIGHE; riga++) {

        tabellone[riga] = [];

        for (let colonna = 0; colonna < COLONNE; colonna++) {

            tabellone[riga][colonna] = null;

            const cella = document.createElement("div");

            cella.className = "cella";

            cella.dataset.riga = riga;
            cella.dataset.colonna = colonna;

            area.appendChild(cella);
        }
    }

    tabellone[8][1] = {
        tipo: "generatorePane"
    };

    tabellone[8][3] = {
        tipo: "generatoreBevanda"
    };

    tabellone[8][5] = {
        tipo: "generatoreOggetto"
    };
}

function aggiornaCella(riga, colonna) {

    const cella = document.querySelector(
        `.cella[data-riga="${riga}"][data-colonna="${colonna}"]`
    );

    if (!cella) {
        return;
    }

    cella.innerHTML = "";

    const oggetto =
        tabellone[riga][colonna];

    if (!oggetto) {
        return;
    }

    const elemento =
        document.createElement("div");

    elemento.className = "oggetto";

    elemento.dataset.riga = riga;
    elemento.dataset.colonna = colonna;

    if (
        oggetto.tipo === "generatorePane" ||
        oggetto.tipo === "generatoreBevanda" ||
        oggetto.tipo === "generatoreOggetto"
    ) {

        elemento.classList.add("generatore");

        elemento.textContent =
            oggetto.tipo === "generatorePane"
                ? "🍞"
                : oggetto.tipo === "generatoreBevanda"
                    ? "🥤"
                    : "🪑";

    } else {

        if (
            immaginiOggetti[oggetto.tipo] &&
            immaginiOggetti[oggetto.tipo][oggetto.livello]
        ) {

elemento.innerHTML = `
    <img
        class="immagineOggettoTabellone"
        src="${immaginiOggetti[oggetto.tipo][oggetto.livello]}"
        alt=""
    >
`;

        } else {

            elemento.textContent =
                livelliOggetti[oggetto.tipo][oggetto.livello];
        }

        elemento.addEventListener(
            "click",
            function (event) {

                event.stopPropagation();

                mostraInfoOggetto(oggetto);
            }
        );
    }

    cella.appendChild(elemento);
    
    if (!oggetto.tipo.startsWith("generatore")) {

    elemento.addEventListener(
        "pointerdown",
        iniziaTrascinamento
    );

}
}

function mostraInfoOggetto(oggetto) {

    const vuoto =
        document.getElementById("dettagliVuoti");

    const area =
        document.getElementById("dettagliOggetto");

    if (
        !oggetto ||
        !livelliOggetti[oggetto.tipo]
    ) {
        vuoto.style.display = "block";
        area.style.display = "none";
        return;
    }

    const icona =
        livelliOggetti[
            oggetto.tipo
        ][
            oggetto.livello
        ];

    const nomiOggetti = {

        pane: [
            "Farina",
            "Impasto",
            "Impasto cotto",
            "Pane",
            "Panino",
            "Panino farcito",
            "Tramezzino farcito",
            "Baguette farcita",
            "Hamburger",
            "Hamburger fast-food"
        ],

        cola: [
            "Bottiglietta d'acqua",
            "Acqua al limone",
            "Sciroppo",
            "Bibita",
            "Cola",
            "Succo",
            "Frappè",
            "Bibita grande",
            "Frappè gigante",
            "Maxi bibita fast-food"
        ],

        tavolo: [
            "Asse di legno",
            "Tavola",
            "Gamba di mobile",
            "Sgabello",
            "Sedia",
            "Sedia imbottita",
            "Poltrona",
            "Divanetto",
            "Divano",
            "Divano di lusso"
        ]

    };

    const nome =
        nomiOggetti[
            oggetto.tipo
        ][
            oggetto.livello
        ];

    area.innerHTML = `

        <button
            class="infoBottone"
            onclick="apriCollezione('${oggetto.tipo}')"
        >
            ⓘ
        </button>

        <span class="infoIcona">
            ${icona}
        </span>

        <span class="infoNome">
            ${nome}
        </span>

        <span class="infoTipo">
            ${oggetto.tipo === "pane"
                ? "Pane"
                : oggetto.tipo === "cola"
                    ? "Bevande"
                    : "Casa"
            }
            (Liv. ${oggetto.livello + 1})
        </span>
    `;

    vuoto.style.display = "none";
    area.style.display = "flex";
}

function aggiornaTabellone() {

    const celle =
        document.querySelectorAll(".cella");

    celle.forEach(cella => {

        const riga =
            Number(cella.dataset.riga);

        const colonna =
            Number(cella.dataset.colonna);

        const oggetto =
            tabellone[riga][colonna];

while (cella.firstChild) {
    cella.removeChild(cella.firstChild);
}

        if (!oggetto) {
            return;
        }

        const elemento =
            document.createElement("div");

        elemento.className = "oggetto";


        // ================================
        // GENERATORI
        // ================================

        if (
            oggetto.tipo === "generatorePane" ||
            oggetto.tipo === "generatoreBevanda" ||
            oggetto.tipo === "generatoreOggetto"
        ) {

            elemento.classList.add("generatore");

        }


        // ================================
        // ASPETTO OGGETTO
        // ================================

        if (oggetto.tipo === "generatorePane") {

            elemento.textContent = "🍞";

        }

        else if (oggetto.tipo === "generatoreBevanda") {

            elemento.textContent = "🥤";

        }

        else if (oggetto.tipo === "generatoreOggetto") {

            elemento.textContent = "🪑";

        }

else {

    if (
        immaginiOggetti[oggetto.tipo] &&
        immaginiOggetti[oggetto.tipo][oggetto.livello]
    ) {

        elemento.innerHTML = `
            <img
                src="${immaginiOggetti[oggetto.tipo][oggetto.livello]}"
                alt=""
            >
        `;

    } else {

        elemento.textContent =
            livelliOggetti[
                oggetto.tipo
            ][
                oggetto.livello
            ];

    }

}


        // ================================
        // POSIZIONE
        // ================================

        elemento.dataset.riga = riga;
        elemento.dataset.colonna = colonna;


        // ================================
        // ANIMAZIONE MERGE
        // ================================

        if (
            riga === rigaMerge &&
            colonna === colonnaMerge
        ) {

            elemento.classList.add(
                "mergeAnimazione"
            );

        }


        cella.appendChild(elemento);
        
        if (
    !oggetto.tipo.startsWith("generatore")
) {

    elemento.addEventListener(
        "click",
        (event) => {

            event.stopPropagation();

            mostraInfoOggetto(oggetto);

        }
    );

}


        // ================================
        // GENERATORE PANE
        // ================================

if (
    oggetto.tipo === "generatorePane" ||
    oggetto.tipo === "generatoreBevanda" ||
    oggetto.tipo === "generatoreOggetto"
) {

    elemento.addEventListener(
        "click",
        () => {

            if (
                energiaGiocatore <
                moltiplicatore
            ) {
                return;
            }

            const generato =
                generaOggetto(oggetto.tipo);

            if (!generato) {
                return;
            }

            energiaGiocatore -=
                moltiplicatore;

            document
                .getElementById("energiaValore")
                .textContent =
                    energiaGiocatore;

animaOggettoDalGeneratore(
    generato.tipo,
    generato.livello,
    generato.riga,
    generato.colonna,
    elemento
);

setTimeout(() => {

    aggiornaTabellone();
    salvaPartita();

}, 450);
        }
    );
}

    });

    attivaTrascinamento();
}

function attivaTrascinamento() {

    const oggetti =
        document.querySelectorAll(".oggetto");

    oggetti.forEach(oggetto => {

        oggetto.addEventListener(
            "pointerdown",
            iniziaTrascinamento
        );
    });
}


let oggettoTrascinato = null;
let elementoTrascinamentoVisuale = null;
let rigaPartenza = null;
let colonnaPartenza = null;

let oggettoSpostato = false;


// ================================
// INIZIO DRAG
// ================================

function iniziaTrascinamento(event) {

    event.preventDefault();

    oggettoSpostato = false;

    oggettoTrascinato =
        event.currentTarget;

    rigaPartenza =
        Number(
            oggettoTrascinato.dataset.riga
        );

    colonnaPartenza =
        Number(
            oggettoTrascinato.dataset.colonna
        );

    oggettoTrascinato.setPointerCapture(
        event.pointerId
    );

    const rettangolo =
        oggettoTrascinato.getBoundingClientRect();

elementoTrascinamentoVisuale =
    document.createElement("div");

elementoTrascinamentoVisuale.className =
    "cloneTrascinamento";

elementoTrascinamentoVisuale.innerHTML =
    oggettoTrascinato.innerHTML;

    elementoTrascinamentoVisuale.style.position =
        "fixed";

    elementoTrascinamentoVisuale.style.width =
        rettangolo.width + "px";

    elementoTrascinamentoVisuale.style.height =
        rettangolo.height + "px";

    elementoTrascinamentoVisuale.style.left =
        event.clientX + "px";

    elementoTrascinamentoVisuale.style.top =
        event.clientY + "px";

elementoTrascinamentoVisuale.style.transform =
    "translate(-50%, -50%)";

    elementoTrascinamentoVisuale.style.zIndex =
        "99999";

    elementoTrascinamentoVisuale.style.pointerEvents =
        "none";

    document.body.appendChild(
        elementoTrascinamentoVisuale
    );

oggettoTrascinato.style.opacity =
    "0";

    oggettoTrascinato.addEventListener(
        "pointermove",
        trascinaOggetto
    );

    oggettoTrascinato.addEventListener(
        "pointerup",
        terminaTrascinamento,
        { once: true }
    );
}

function trascinaOggetto(event) {

    if (!oggettoTrascinato) {
        return;
    }

    oggettoSpostato = true;

    if (elementoTrascinamentoVisuale) {

        elementoTrascinamentoVisuale.style.left =
            event.clientX + "px";

        elementoTrascinamentoVisuale.style.top =
            event.clientY + "px";
    }

    const ora = performance.now();

    if (
        trascinaOggetto.ultimoAggiornamento &&
        ora - trascinaOggetto.ultimoAggiornamento < 16
    ) {
        return;
    }

    trascinaOggetto.ultimoAggiornamento = ora;

    const elemento =
        document.elementFromPoint(
            event.clientX,
            event.clientY
        );

    const cella =
        elemento?.closest(".cella");

    const cellaPrecedente =
        document.querySelector(
            ".cella.evidenziata"
        );

    if (
        cellaPrecedente &&
        cellaPrecedente !== cella
    ) {
        cellaPrecedente.classList.remove(
            "evidenziata"
        );
    }

    if (cella) {
        cella.classList.add(
            "evidenziata"
        );
    }
}


// ================================
// TROVA CASELLA ADIACENTE
// ================================

function trovaCasellaAdiacente(
    riga,
    colonna
) {

    const direzioni = [

        // destra
        [0, 1],

        // sinistra
        [0, -1],

        // sotto
        [1, 0],

        // sopra
        [-1, 0],

        // diagonali
        [1, 1],
        [1, -1],
        [-1, 1],
        [-1, -1]
    ];

    for (const [dr, dc] of direzioni) {

        const nuovaRiga =
            riga + dr;

        const nuovaColonna =
            colonna + dc;

        if (
            nuovaRiga >= 0 &&
            nuovaRiga < RIGHE &&
            nuovaColonna >= 0 &&
            nuovaColonna < COLONNE
        ) {

            if (
                tabellone[nuovaRiga][nuovaColonna]
                === null
            ) {

                return {
                    riga: nuovaRiga,
                    colonna: nuovaColonna
                };
            }
        }
    }

    return null;
}


// ================================
// ESEGUI MERGE
// ================================

function eseguiMerge(
    rigaPartenza,
    colonnaPartenza,
    rigaDestinazione,
    colonnaDestinazione
) {

    const primo =
        tabellone[rigaPartenza][colonnaPartenza];

    const secondo =
        tabellone[rigaDestinazione][colonnaDestinazione];

    if (!primo || !secondo) {
        return false;
    }

    // Stesso tipo
    if (primo.tipo !== secondo.tipo) {
        return false;
    }

    // Stesso livello
    if (primo.livello !== secondo.livello) {
        return false;
    }

    // Livello massimo
    if (
        primo.livello >=
        livelliOggetti[primo.tipo].length - 1
    ) {
        return false;
    }

    // Salva la posizione del merge
    rigaMerge = rigaDestinazione;
    colonnaMerge = colonnaDestinazione;

    // Nuovo livello
    const nuovoLivello =
        primo.livello + 1;
        
        // Sblocca il nuovo livello
if (
    livelliSbloccati[primo.tipo] <
    nuovoLivello + 1
) {
    livelliSbloccati[primo.tipo] =
        nuovoLivello + 1;
}

    // I due oggetti spariscono
    tabellone[rigaPartenza][colonnaPartenza] =
        null;

    tabellone[rigaDestinazione][colonnaDestinazione] =
        null;

    // Il nuovo oggetto nasce nella destinazione
tabellone[rigaDestinazione][colonnaDestinazione] =
    creaOggetto(
        primo.tipo,
        nuovoLivello
    );

controllaPremiInAttesa();

return true;
}

function terminaTrascinamento(event) {

    if (elementoTrascinamentoVisuale) {

        elementoTrascinamentoVisuale.remove();

        elementoTrascinamentoVisuale = null;
    }

    if (!oggettoTrascinato) {
        return;
    }

    if (!oggettoSpostato) {

        oggettoTrascinato.style.transform =
            "scale(1)";

        oggettoTrascinato.style.opacity =
            "1";

        oggettoTrascinato = null;

        return;
    }

    const elemento =
        document.elementFromPoint(
            event.clientX,
            event.clientY
        );

    // =========================================
    // DEPOSITO
    // =========================================

    const pulsanteDeposito =
        elemento?.closest("#pulsanteDeposito");

    if (pulsanteDeposito) {

        if (
            oggettiNelDeposito.length >=
            celleDepositoSbloccate
        ) {

            alert(
                "Il deposito è pieno."
            );

            oggettoTrascinato.style.opacity =
                "1";

            oggettoTrascinato = null;

            return;
        }

        const oggetto =
            tabellone[
                rigaPartenza
            ][
                colonnaPartenza
            ];

        if (oggetto) {

            oggettiNelDeposito.push(
                oggetto
            );

            tabellone[
                rigaPartenza
            ][
                colonnaPartenza
            ] = null;

            aggiornaTabellone();

            aggiornaDeposito();

            salvaPartita();
        }

        oggettoTrascinato.style.opacity =
            "1";

        oggettoTrascinato = null;

        return;
    }

    // =========================================
    // TABELLONE
    // =========================================

    const cella =
        elemento?.closest(".cella");

const cellaEvidenziata =
    document.querySelector(
        ".cella.evidenziata"
    );

if (cellaEvidenziata) {
    cellaEvidenziata.classList.remove(
        "evidenziata"
    );
}

    oggettoTrascinato.style.transform =
        "scale(1)";

    if (cella) {

        const nuovaRiga =
            Number(cella.dataset.riga);

        const nuovaColonna =
            Number(cella.dataset.colonna);

        // Tornato nella casella di partenza
        if (
            nuovaRiga === rigaPartenza &&
            nuovaColonna === colonnaPartenza
        ) {

            oggettoTrascinato.style.opacity =
                "1";

            oggettoTrascinato = null;

            return;
        }

        const destinazione =
            tabellone[
                nuovaRiga
            ][
                nuovaColonna
            ];

        // CASELLA VUOTA
        if (!destinazione) {

            tabellone[
                nuovaRiga
            ][
                nuovaColonna
            ] =
                tabellone[
                    rigaPartenza
                ][
                    colonnaPartenza
                ];

            tabellone[
                rigaPartenza
            ][
                colonnaPartenza
            ] = null;

aggiornaCella(
    rigaPartenza,
    colonnaPartenza
);

aggiornaCella(
    nuovaRiga,
    nuovaColonna
);

            salvaPartita();
        }

        // CASELLA CON OGGETTO
        else {

            const merge =
                eseguiMerge(
                    rigaPartenza,
                    colonnaPartenza,
                    nuovaRiga,
                    nuovaColonna
                );

if (merge) {

    aggiornaCella(
        rigaPartenza,
        colonnaPartenza
    );

    aggiornaCella(
        nuovaRiga,
        nuovaColonna
    );

    salvaPartita();

} else {

                // SCAMBIO DEI DUE OGGETTI

                const oggettoPartenza =
                    tabellone[
                        rigaPartenza
                    ][
                        colonnaPartenza
                    ];

                const oggettoDestinazione =
                    tabellone[
                        nuovaRiga
                    ][
                        nuovaColonna
                    ];

                tabellone[
                    rigaPartenza
                ][
                    colonnaPartenza
                ] =
                    oggettoDestinazione;

                tabellone[
                    nuovaRiga
                ][
                    nuovaColonna
                ] =
                    oggettoPartenza;

aggiornaCella(
    rigaPartenza,
    colonnaPartenza
);

aggiornaCella(
    nuovaRiga,
    nuovaColonna
);

                salvaPartita();
            }
        }
    }

    oggettoTrascinato.style.opacity =
        "1";

    oggettoTrascinato = null;
}

function apriCollezione(tipo) {

    const nomi = {

        pane: [
            "Farina",
            "Impasto",
            "Impasto cotto",
            "Pane",
            "Panino",
            "Panino farcito",
            "Tramezzino farcito",
            "Baguette farcita",
            "Hamburger",
            "Hamburger fast-food"
        ],

        cola: [
            "Bottiglietta d'acqua",
            "Acqua al limone",
            "Sciroppo",
            "Bibita",
            "Cola",
            "Succo",
            "Frappè",
            "Bibita grande",
            "Frappè gigante",
            "Maxi bibita fast-food"
        ],

        tavolo: [
            "Asse di legno",
            "Tavola",
            "Gamba di mobile",
            "Sgabello",
            "Sedia",
            "Sedia imbottita",
            "Poltrona",
            "Divanetto",
            "Divano",
            "Divano di lusso"
        ]

    };

    const icone =
        livelliOggetti[tipo];

    const sbloccati =
        livelliSbloccati[tipo];

    let contenuto = "";

for (let i = 0; i < 10; i++) {

    if (i < sbloccati) {

        contenuto += `
            <div class="casellaCollezione">
                <div class="oggettoCollezione">
                    ${icone[i]}
                </div>
                <div class="livelloCollezione">
                    Liv. ${i + 1}
                </div>
                <div class="nomeCollezione">
                    ${nomi[tipo][i]}
                </div>
            </div>
        `;

    } else {

        contenuto += `
            <div class="casellaCollezione bloccata">
                <div class="oggettoCollezione">
                    ?
                </div>
                <div class="livelloCollezione">
                    Liv. ${i + 1}
                </div>
                <div class="nomeCollezione">
                    ?
                </div>
            </div>
        `;

    }
}

    document.getElementById("infoOggetto").innerHTML = `
        <div class="collezione">

            <button
                class="chiudiCollezione"
                onclick="chiudiCollezione()"
            >
                ✕
            </button>

<h2>
    ${
        tipo === "pane"
            ? "PANE"
            : tipo === "cola"
                ? "BEVANDE"
                : "CASA"
    }
</h2>

            <div class="listaCollezione">
                ${contenuto}
            </div>

        </div>
    `;

    document.getElementById("infoOggetto").style.display = "block";
}


function chiudiCollezione() {

    document.getElementById("infoOggetto").style.display =
        "none";
}

function aggiornaMonete() {
    document.getElementById(
        "moneteValorePrincipali"
    ).textContent = moneteGiocatore;

    document.getElementById(
        "moneteValore"
    ).textContent = moneteGiocatore;
}

function aggiornaDiamanti() {

    const elemento =
        document.getElementById(
            "diamantiValore"
        );

    if (elemento) {
        elemento.textContent =
            diamantiGiocatore;
    }
}

function aggiornaPuntiOrdini() {

    const elemento = document.getElementById("puntiOrdini");

    if (!elemento) return;

    elemento.textContent =
        puntiOrdini +
        " / " +
        PUNTI_ORDINI_RICHIESTI;
}

function generaPremioOrdini() {

    let generati = 0;

    const tipi = [
        "pane",
        "cola",
        "tavolo"
    ];

    for (
        let riga = 0;
        riga < RIGHE;
        riga++
    ) {

        for (
            let colonna = 0;
            colonna < COLONNE;
            colonna++
        ) {

            if (
                tabellone[riga][colonna] === null
            ) {

                const tipo =
                    tipi[
                        Math.floor(
                            Math.random() *
                            tipi.length
                        )
                    ];

                const livelloMassimo =
                    Math.min(
                        2,
                        livelliSbloccati[tipo] - 1
                    );

                const livello =
                    Math.floor(
                        Math.random() *
                        (livelloMassimo + 1)
                    );

                tabellone[riga][colonna] =
                    creaOggetto(
                        tipo,
                        livello
                    );

                generati++;

                if (
                    generati ===
                    OGGETTI_PREMIO
                ) {
                    return;
                }
            }
        }
    }

    premiInAttesa =
        OGGETTI_PREMIO -
        generati;
}

function controllaPremiInAttesa() {

    if (premiInAttesa <= 0) {
        return;
    }

    let spazioTrovato = false;

    for (
        let riga = 0;
        riga < RIGHE;
        riga++
    ) {

        for (
            let colonna = 0;
            colonna < COLONNE;
            colonna++
        ) {

            if (
                tabellone[riga][colonna] === null
            ) {

                const tipi = [
                    "pane",
                    "cola",
                    "tavolo"
                ];

                const tipo =
                    tipi[
                        Math.floor(
                            Math.random() *
                            tipi.length
                        )
                    ];

                const livelloMassimo =
                    Math.min(
                        2,
                        livelliSbloccati[tipo] - 1
                    );

                const livello =
                    Math.floor(
                        Math.random() *
                        (livelloMassimo + 1)
                    );

                tabellone[riga][colonna] =
                    creaOggetto(
                        tipo,
                        livello
                    );

                premiInAttesa--;

                spazioTrovato = true;

                if (
                    premiInAttesa <= 0
                ) {
                    break;
                }
            }
        }

        if (
            premiInAttesa <= 0
        ) {
            break;
        }
    }

    if (spazioTrovato) {
        aggiornaTabellone();
        salvaPartita();
    }
}

function aggiornaEsperienza() {

    const percentuale =
        Math.min(
            100,
            (esperienzaGiocatore / XP_PER_LIVELLO) * 100
        );

    const progresso =
        document.getElementById("xpProgressione");

    const testo =
        document.getElementById("testoXP");

    if (progresso) {
        progresso.style.width =
            percentuale + "%";
    }

    if (testo) {
        testo.textContent =
            esperienzaGiocatore +
            " / " +
            XP_PER_LIVELLO +
            " XP";
    }

    /* CORNICE XP */

    const livello =
        document.getElementById("livello");

    if (livello) {
        livello.style.setProperty(
            "--percentuale-xp",
            percentuale + "%"
        );
    }

    const numeroLivello =
        document.getElementById("numeroLivello");

    if (numeroLivello) {
        numeroLivello.textContent =
            "LIV. " + livelloGiocatore;
    }
}

function salvaPartita() {
  
  console.log(
    "TABELLONE PRIMA DEL SALVATAGGIO:",
    tabellone
);

    const dati = {

        tabellone: tabellone,
        livelliSbloccati: livelliSbloccati,

        energia: energiaGiocatore,
        ultimoAggiornamentoEnergia:
            ultimoAggiornamentoEnergia,

        monete: moneteGiocatore,
        diamanti: diamantiGiocatore,

        livelloGiocatore: livelloGiocatore,
        esperienzaGiocatore: esperienzaGiocatore,

        puntiOrdini: puntiOrdini,
        premiInAttesa: premiInAttesa,

        ordiniAttuali: ordiniAttuali,

ristrutturazioni: ristrutturazioni,
oggettiAcquistatiInSospeso: oggettiAcquistatiInSospeso,
oggettiNelDeposito: oggettiNelDeposito,
celleDepositoSbloccate: celleDepositoSbloccate
    };

    localStorage.setItem(
        "mergeCasaSalvataggio",
        JSON.stringify(dati)
    );
    
    console.log(
    "SALVATAGGIO TABELLONE:",
    JSON.stringify(tabellone)
);
}

function caricaPartita() {

    const salvataggio =
        localStorage.getItem(
            "mergeCasaSalvataggio"
        );

    if (!salvataggio) return false;

    const dati =
        JSON.parse(salvataggio);
        
        oggettiAcquistatiInSospeso =
    dati.oggettiAcquistatiInSospeso || [];
    oggettiNelDeposito =
    dati.oggettiNelDeposito || [];
    celleDepositoSbloccate =
    dati.celleDepositoSbloccate || 5;

if (
    dati.tabellone &&
    Array.isArray(dati.tabellone) &&
    dati.tabellone.length === RIGHE &&
    dati.tabellone.some(
        riga => riga.some(
            cella => cella !== null
        )
    )
) {
    tabellone = dati.tabellone;
} else {
    creaTabellone();
}

tabellone[8][1] = {
    tipo: "generatorePane"
};

tabellone[8][3] = {
    tipo: "generatoreBevanda"
};

tabellone[8][5] = {
    tipo: "generatoreOggetto"
};

    livelliSbloccati =
        dati.livelliSbloccati;

    energiaGiocatore =
        dati.energia;

    ultimoAggiornamentoEnergia =
        dati.ultimoAggiornamentoEnergia ||
        Date.now();

    moneteGiocatore =
        dati.monete || 0;
        
        diamantiGiocatore =
    dati.diamanti || 0;

document.getElementById(
    "diamantiValore"
).textContent =
    diamantiGiocatore;

    livelloGiocatore =
        dati.livelloGiocatore || 1;

    esperienzaGiocatore =
        dati.esperienzaGiocatore || 0;

    puntiOrdini =
        dati.puntiOrdini || 0;

    premiInAttesa =
        dati.premiInAttesa || 0;

if (
    dati.ordiniAttuali &&
    dati.ordiniAttuali.length > 0 &&
    dati.ordiniAttuali[0].oggetti
) {
    ordiniAttuali =
        dati.ordiniAttuali;
}

    ristrutturazioni =
        dati.ristrutturazioni || {
            muri: 0,
            finestre: 0,
            porta: 0,
            arredamento: 0,
            esterno: 0
        };

    aggiornaMonete();
    aggiornaEsperienza();
    aggiornaPuntiOrdini();
    aggiornaOrdine();

    document.getElementById(
        "energiaValore"
    ).textContent =
        energiaGiocatore;
        
        aggiornaOggettiAcquistatiNelSlot();

    return true;
}

function aggiornaOrdine() {

    const area =
        document.getElementById("ordiniNelSlot");

    if (!area) return;

    area.innerHTML = "";

    ordiniAttuali.forEach(
        function(ordine, indice) {

            const card =
                document.createElement("div");

            card.className =
                "ordineNelSlot";

            const oggetti =
                ordine.oggetti || [];

            const immaginiOrdine =
                oggetti.map(
                    function(oggetto) {

                        const immagine =
                            immaginiOggetti[
                                oggetto.tipo
                            ]?.[
                                oggetto.livello
                            ];

                        const presente =
                            tabellone.some(
                                riga =>
                                    riga.some(
                                        cella =>
                                            cella &&
                                            cella.tipo === oggetto.tipo &&
                                            cella.livello === oggetto.livello
                                    )
                            );

                        return `
                            <div class="oggettoOrdine">

                                ${
                                    immagine
                                        ? `
                                            <img
                                                src="${immagine}"
                                                alt=""
                                            >
                                        `
                                        : `
                                            <span>
                                                ${
                                                    livelliOggetti[
                                                        oggetto.tipo
                                                    ][
                                                        oggetto.livello
                                                    ]
                                                }
                                            </span>
                                        `
                                }

                                ${
                                    presente
                                        ? `
                                            <span class="spuntaOrdine">
                                                ✓
                                            </span>
                                        `
                                        : ""
                                }

                            </div>
                        `;
                    }
                ).join("");

            const tuttiPresenti =
                oggetti.length === 3 &&
                oggetti.every(
                    function(oggetto) {

                        return tabellone.some(
                            riga =>
                                riga.some(
                                    cella =>
                                        cella &&
                                        cella.tipo === oggetto.tipo &&
                                        cella.livello === oggetto.livello
                                )
                        );

                    }
                );

            card.innerHTML = `

                <div class="ordineOggetti">
                    ${immaginiOrdine}
                </div>

                ${
                    tuttiPresenti
                        ? `
                            <button
                                onclick="consegnaOrdine(${indice})"
                            >
                                SERVI
                            </button>
                        `
                        : ""
                }

            `;

            area.appendChild(card);
        }
    );
}

function generaNuovoOrdine() {

    const tipi = [
        "pane",
        "cola",
        "tavolo"
    ];

    const oggetti = [];

    for (let i = 0; i < 3; i++) {

        const tipo =
            tipi[
                Math.floor(
                    Math.random() * tipi.length
                )
            ];

        const livelloMassimo =
            Math.min(
                2,
                livelliSbloccati[tipo] - 1
            );

        const livello =
            Math.floor(
                Math.random() *
                (livelloMassimo + 1)
            );

        oggetti.push({
            tipo: tipo,
            livello: livello
        });
    }

    return {
        oggetti: oggetti,
        ricompensa: 100
    };
}

while (ordiniAttuali.length < 5) {
    ordiniAttuali.push(generaNuovoOrdine());
}

function consegnaOrdine(indiceOrdine) {

    const ordine =
        ordiniAttuali[indiceOrdine];

    if (!ordine || !ordine.oggetti) {
        return;
    }

    const posizioniDaRimuovere = [];

    // Cerca ogni oggetto richiesto
    for (const richiesto of ordine.oggetti) {

        let trovato = false;

        for (let riga = 0; riga < RIGHE && !trovato; riga++) {

            for (
                let colonna = 0;
                colonna < COLONNE;
                colonna++
            ) {

                const oggetto =
                    tabellone[riga][colonna];

                if (
                    oggetto &&
                    oggetto.tipo === richiesto.tipo &&
                    oggetto.livello === richiesto.livello
                ) {

                    // Evita di usare due volte
                    // la stessa casella
                    const giaUsata =
                        posizioniDaRimuovere.some(
                            posizione =>
                                posizione.riga === riga &&
                                posizione.colonna === colonna
                        );

                    if (!giaUsata) {

                        posizioniDaRimuovere.push({
                            riga: riga,
                            colonna: colonna
                        });

                        trovato = true;
                        break;
                    }
                }
            }
        }

        // Se manca anche un solo oggetto,
        // l'ordine non può essere servito
        if (!trovato) {

            alert(
                "Ti mancano uno o più oggetti richiesti!"
            );

            return;
        }
    }

    // ================================
    // RIMUOVE I 3 OGGETTI
    // ================================

    posizioniDaRimuovere.forEach(
        function(posizione) {

            tabellone[
                posizione.riga
            ][
                posizione.colonna
            ] = null;

        }
    );

    // ================================
    // RICOMPENSA
    // ================================

    const ricompensaOttenuta =
        ordine.ricompensa || 0;

    moneteGiocatore +=
        ricompensaOttenuta;

    aggiornaMonete();

    // ================================
    // PUNTI ORDINI
    // ================================

    puntiOrdini++;

    if (
        puntiOrdini >=
        PUNTI_ORDINI_RICHIESTI
    ) {

        puntiOrdini = 0;

        generaPremioOrdini();

        alert(
            "🎁 Hai completato 10 ordini!"
        );
    }

    aggiornaPuntiOrdini();

    // ================================
    // ESPERIENZA
    // ================================

    esperienzaGiocatore += 25;

    if (
        esperienzaGiocatore >=
        XP_PER_LIVELLO
    ) {

        esperienzaGiocatore -=
            XP_PER_LIVELLO;

        livelloGiocatore++;

        alert(
            "🎉 Livello " +
            livelloGiocatore +
            " raggiunto!"
        );
    }

    aggiornaEsperienza();

    // ================================
    // NUOVO ORDINE
    // ================================

    ordiniAttuali[
        indiceOrdine
    ] = generaNuovoOrdine();

    // ================================
    // AGGIORNA TUTTO
    // ================================

    aggiornaOrdine();

    aggiornaTabellone();

    salvaPartita();

    alert(
        "Ordine completato! 🪙 +" +
        ricompensaOttenuta
    );
}

function ristrutturaParte(parte) {

    const livello =
        ristrutturazioni[parte];

    if (livello >= 5) {
        return;
    }

    const costo =
        costiRistrutturazione[livello];

    if (moneteGiocatore < costo) {
        alert("Non hai abbastanza monete!");
        return;
    }

    moneteGiocatore -= costo;
    
    aggiornaMonete();

    ristrutturazioni[parte]++;

    aggiornaRistrutturazioni();

    salvaPartita();
}

function aggiornaRistrutturazioni() {

    document.getElementById(
        "moneteValore"
    ).textContent = moneteGiocatore;

    const parti = [
        "muri",
        "finestre",
        "porta",
        "arredamento",
        "esterno"
    ];

    parti.forEach(function(parte) {

        const livello =
            ristrutturazioni[parte];

        const elementoLivello =
            document.getElementById(
                "livello" +
                parte.charAt(0).toUpperCase() +
                parte.slice(1)
            );

        const elementoCosto =
            document.getElementById(
                "costo" +
                parte.charAt(0).toUpperCase() +
                parte.slice(1)
            );

        elementoLivello.textContent =
            livello;

        if (livello >= 5) {

            elementoCosto.textContent =
                "COMPLETATO";

        } else {

            elementoCosto.textContent =
                costiRistrutturazione[livello];
        }
    });
}

function apriRistrutturazione() {

    document.getElementById(
        "tabellone"
    ).style.display = "none";

    document.getElementById(
        "infoOggetto"
    ).style.display = "none";

    document.getElementById(
        "moltiplicatore"
    ).style.display = "none";

    document.getElementById(
        "energia"
    ).style.display = "none";

    document.getElementById(
        "paginaRistrutturazione"
    ).style.display = "block";

    aggiornaRistrutturazioni();
}

function aggiornaEnergia() {

    const timer = document.getElementById("timerEnergia");
    const conto = document.getElementById("contoEnergia");

    if (energiaGiocatore >= 100) {

        ultimoAggiornamentoEnergia = Date.now();

        timer.style.display = "none";

        return;
    }

    timer.style.display = "block";

    const adesso = Date.now();

    const tempoPassato =
        adesso - ultimoAggiornamentoEnergia;

    const intervalli =
        Math.floor(
            tempoPassato /
            TEMPO_RICARICA_ENERGIA
        );

    if (intervalli > 0) {

        energiaGiocatore =
            Math.min(
                100,
                energiaGiocatore + intervalli
            );

        ultimoAggiornamentoEnergia =
            ultimoAggiornamentoEnergia +
            intervalli * TEMPO_RICARICA_ENERGIA;

        document.getElementById(
            "energiaValore"
        ).textContent = energiaGiocatore;

        salvaPartita();
    }

    if (energiaGiocatore >= 100) {

        timer.style.display = "none";

        return;
    }

    const prossimo =
        TEMPO_RICARICA_ENERGIA -
        (
            Date.now() -
            ultimoAggiornamentoEnergia
        );

    const secondi =
        Math.ceil(prossimo / 1000);

    const minuti =
        Math.floor(secondi / 60);

    const secondiRimasti =
        secondi % 60;

    conto.textContent =
        String(minuti).padStart(2, "0") +
        ":" +
        String(secondiRimasti).padStart(2, "0");
}

document.addEventListener("DOMContentLoaded", function () {

    creaTabellone();
    aggiornaOrdine();
    caricaPartita();
    aggiornaTabellone();
    setInterval(aggiornaEnergia, 1000);

});


// ================================
// INTRO STORIA MERGE CASA
// ================================

let slideStoriaCorrente = 0;

const introStoria =
    document.getElementById("introStoria");

const slideStoria =
    document.querySelectorAll(".slideStoria");


// ================================
// MOSTRA UNA SLIDE
// ================================

function mostraSlideStoria(numero) {

    if (!introStoria || !slideStoria.length) {
        return;
    }

    slideStoria.forEach(function (slide) {

        slide.classList.remove("attiva");

        slide
            .querySelectorAll(".nuvolettaDialogo")
            .forEach(function (nuvoletta) {

nuvoletta.classList.remove("visibile");

            });

    });

    const slide =
        document.querySelector(
            '.slideStoria[data-slide="' +
            numero +
            '"]'
        );

    if (!slide) {
        return;
    }

    slide.classList.add("attiva");

    slideStoriaCorrente = numero;

    const primaNuvoletta =
        slide.querySelector(".nuvolettaDialogo");

    if (primaNuvoletta) {
primaNuvoletta.classList.add("visibile");
    }
}


// ================================
// AVVIA LA STORIA
// ================================

function avviaStoria() {

    if (!introStoria || !slideStoria.length) {
        return;
    }

    introStoria.style.display = "block";

    mostraSlideStoria(1);
}


// ================================
// AVANTI
// ================================

function prossimaSlideStoria() {

    if (slideStoriaCorrente >= 7) {

        terminaStoria();

        return;
    }

    mostraSlideStoria(
        slideStoriaCorrente + 1
    );
}


// ================================
// FINE STORIA
// ================================

function terminaStoria() {

    if (introStoria) {
        introStoria.style.display = "none";
    }

    const sceltaAvatar =
        document.getElementById("sceltaAvatar");

    if (sceltaAvatar) {
        sceltaAvatar.style.display = "flex";
    }
}


// ================================
// FRECCIA DIALOGHI
// ================================

const frecciaDialogo =
    document.querySelector(".frecciaDialogo");

if (frecciaDialogo) {

    frecciaDialogo.addEventListener(
        "click",
        function () {

            const slide =
                document.querySelector(
                    '.slideStoria[data-slide="' +
                    slideStoriaCorrente +
                    '"]'
                );

            if (!slide) {
                return;
            }

            const figlia =
                slide.querySelector(
                    ".nuvolettaFiglia"
                );

            const mamma =
                slide.querySelector(
                    ".nuvolettaMamma"
                );

            // =========================
            // SLIDE 1
            // =========================

            if (slideStoriaCorrente === 1) {

if (
    figlia &&
    !figlia.classList.contains("visibile")
) {

    figlia.classList.add("visibile");

    return;
}

                prossimaSlideStoria();

                return;
            }

            // =========================
            // SLIDE 2
            // =========================

            if (slideStoriaCorrente === 2) {

if (
    mamma &&
    !mamma.classList.contains("visibile")
) {

    mamma.classList.add("visibile");

    return;
}

                prossimaSlideStoria();

                return;
            }

            // =========================
            // SLIDE SUCCESSIVE
            // =========================

            prossimaSlideStoria();

        }
    );

}


// ================================
// MUSICA
// ================================

const musica =
    new Audio(
        "immagini/audio/musica_menu.mp3"
    );

musica.loop = true;
musica.volume = 0.35;

document.addEventListener(
    "click",
    function avviaMusica() {

        musica.play().catch(function () {});

        document.removeEventListener(
            "click",
            avviaMusica
        );

    },
    { once: true }
);

// ================================
// REGALO DI BENVENUTO
// ================================

const popupBenvenuto =
    document.getElementById(
        "popupBenvenuto"
    );

const pulsanteRiscatta =
    document.getElementById(
        "riscattaBenvenuto"
    );

const pulsanteChiudi =
    document.getElementById(
        "chiudiPopupBenvenuto"
    );

let regaloBenvenutoRiscattato =
    localStorage.getItem(
        "regaloBenvenutoRiscattato"
    ) === "true";


// ================================
// RISCATTA
// ================================

if (pulsanteRiscatta) {

    pulsanteRiscatta.addEventListener(
        "click",
        function () {

            if (
                regaloBenvenutoRiscattato
            ) {
                return;
            }

            moneteGiocatore += 1000;

            energiaGiocatore = 100;

            diamantiGiocatore += 20;

            regaloBenvenutoRiscattato =
                true;

            localStorage.setItem(
                "regaloBenvenutoRiscattato",
                "true"
            );

            aggiornaMonete();

            document.getElementById(
                "energiaValore"
            ).textContent =
                energiaGiocatore;

            document.getElementById(
                "diamantiValore"
            ).textContent =
                diamantiGiocatore;

            salvaPartita();

            popupBenvenuto.style.display =
                "none";

        }
    );

}


// ================================
// CHIUDI CON X
// ================================

if (pulsanteChiudi) {

    pulsanteChiudi.addEventListener(
        "click",
        function () {

            popupBenvenuto.style.display =
                "none";

        }
    );

}

function apriStore() {

    const store =
        document.getElementById("paginaStore");

    if (!store) {
        return;
    }

    store.style.display = "flex";

}
const chiudiStore =
    document.getElementById("chiudiStore");

if (chiudiStore) {

    chiudiStore.addEventListener(
        "click",
        function () {

            document.getElementById(
                "paginaStore"
            ).style.display = "none";

        }
    );

}

const oggettiStore = {

    asse_legno: {
        tipo: "tavolo",
        livello: 0
    },

    pane: {
        tipo: "pane",
        livello: 3
    },

    bibita: {
        tipo: "cola",
        livello: 3
    },

    sedia: {
        tipo: "tavolo",
        livello: 4
    },

    poltrona: {
        tipo: "tavolo",
        livello: 6
    },

    hamburger: {
        tipo: "pane",
        livello: 8
    }

};

function acquistaOggettoStore(
    tipo,
    livello,
    prezzo
) {
    if (diamantiGiocatore < prezzo) {
        alert("Non hai abbastanza diamanti.");
        return;
    }

    diamantiGiocatore -= prezzo;
    
    oggettiAcquistatiInSospeso.push({
    tipo: tipo,
    livello: livello
});

    aggiornaDiamanti();

    const contenitore =
        document.getElementById(
            "oggettiAcquistatiNelSlot"
        );

    if (!contenitore) {
        return;
    }

    contenitore.style.display = "flex";

    const oggetto =
        document.createElement("div");

    oggetto.className =
        "oggettoAcquistatoSlot";

    oggetto.innerHTML = `
        🪵
        <span>Asse</span>
    `;

oggetto.addEventListener(
    "click",
    function () {
        trasportaOggettoNelTabellone(
            oggetto,
            tipo,
            livello
        );
    }
);

    contenitore.appendChild(oggetto);
    
    aggiornaOggettiAcquistatiNelSlot();

    salvaPartita();

    alert("Oggetto acquistato!");
}

function trasportaOggettoNelTabellone(
    elementoSlot,
    tipoStore,
    livelloStore,
    indice
) {

const datiOggetto =
    oggettiStore[tipoStore];

const tipoReale =
    datiOggetto
        ? datiOggetto.tipo
        : tipoStore;

const livelloReale =
    datiOggetto
        ? datiOggetto.livello
        : livelloStore;

    let rigaDestinazione = null;
    let colonnaDestinazione = null;

    for (
        let riga = 0;
        riga < RIGHE;
        riga++
    ) {

        for (
            let colonna = 0;
            colonna < COLONNE;
            colonna++
        ) {

            if (
                tabellone[riga][colonna] === null
            ) {
                rigaDestinazione = riga;
                colonnaDestinazione = colonna;
                break;
            }
        }

        if (
            rigaDestinazione !== null
        ) {
            break;
        }
    }

    if (
        rigaDestinazione === null
    ) {
        alert(
            "Non c'è spazio sul tabellone."
        );
        return;
    }

    const cellaDestinazione =
        document.querySelector(
            `.cella[data-riga="${rigaDestinazione}"][data-colonna="${colonnaDestinazione}"]`
        );

    if (!cellaDestinazione) {
        return;
    }

const clone =
    document.createElement("div");

clone.className =
    "oggettoRientroDeposito";

if (
    immaginiOggetti[tipoReale] &&
    immaginiOggetti[tipoReale][livelloReale]
) {

    clone.innerHTML = `
        <img
            src="${immaginiOggetti[tipoReale][livelloReale]}"
            alt=""
        >
    `;

} else {

    clone.textContent =
        livelliOggetti[tipoReale]?.[livelloReale] || "📦";

}

const posizione =
    elementoSlot.getBoundingClientRect();

clone.style.position = "fixed";

clone.style.left =
    posizione.left +
    posizione.width / 2 +
    "px";

clone.style.top =
    posizione.top +
    posizione.height / 2 +
    "px";

clone.style.width =
    "auto";

clone.style.height =
    "auto";

clone.style.margin =
    "0";

clone.style.zIndex =
    "10000";

clone.style.pointerEvents =
    "none";

clone.style.transition =
    "left .45s ease, top .45s ease, transform .45s ease, opacity .45s ease";

document.body.appendChild(clone);

    const destinazione =
        cellaDestinazione.getBoundingClientRect();

    requestAnimationFrame(() => {

clone.style.left =
    destinazione.left +
    destinazione.width / 2 +
    "px";

clone.style.top =
    destinazione.top +
    destinazione.height / 2 +
    "px";

        clone.style.transform =
            "scale(.75)";

        clone.style.opacity =
            "0.2";
    });

    setTimeout(() => {

        tabellone[
            rigaDestinazione
        ][
            colonnaDestinazione
        ] = creaOggetto(
            tipoReale,
            livelloReale
        );

        // Rimuove l'oggetto trasportato dalla coda
        if (
            indice !== undefined &&
            indice >= 0
        ) {
            oggettiAcquistatiInSospeso.splice(
                indice,
                1
            );
        }

        clone.remove();

        // Mostra il prossimo oggetto,
        // oppure nasconde lo slot se la coda è vuota
        aggiornaOggettiAcquistatiNelSlot();

        aggiornaTabellone();
        salvaPartita();

    }, 450);
}

function aggiornaOggettiAcquistatiNelSlot() {

    const contenitore =
        document.getElementById(
            "oggettiAcquistatiNelSlot"
        );

    if (!contenitore) {
        return;
    }

    contenitore.innerHTML = "";

    if (
        oggettiAcquistatiInSospeso.length === 0
    ) {
        contenitore.style.display = "none";
        return;
    }

    contenitore.style.display = "flex";

    const indice =
        oggettiAcquistatiInSospeso.length - 1;

    const oggettoSalvato =
        oggettiAcquistatiInSospeso[indice];

    const dettagli = {
        asse_legno: ["🪵", "Asse"],
        pane: ["🍞", "Pane"],
        bibita: ["🥤", "Bibita"],
        sedia: ["🪑", "Sedia"],
        poltrona: ["🛋️", "Poltrona"],
        hamburger: ["🍔", "Hamburger"]
    };

    const dati =
        dettagli[oggettoSalvato.tipo] ||
        ["📦", "Oggetto"];

    const oggetto =
        document.createElement("div");

    oggetto.className =
        "oggettoAcquistatoSlot";

oggetto.innerHTML = `
    <span class="iconaOggettoCoda">
        ${dati[0]}
    </span>
    `;

    oggetto.addEventListener(
        "click",
        function () {

            trasportaOggettoNelTabellone(
                oggetto,
                oggettoSalvato.tipo,
                oggettoSalvato.livello,
                indice
            );

        }
    );

    contenitore.appendChild(oggetto);
}

document
    .getElementById("chiudiDeposito")
    ?.addEventListener("click", function () {

        const paginaDeposito =
            document.getElementById(
                "paginaDeposito"
            );

        const main =
            document.querySelector("main");

        paginaDeposito.style.display =
            "none";

        main.style.display =
            "block";

        if (!oggettoInRientroDalDeposito) {
            return;
        }

        // Cerca la prima cella libera
        let rigaDestinazione = null;
        let colonnaDestinazione = null;

        for (
            let riga = 0;
            riga < RIGHE;
            riga++
        ) {

            for (
                let colonna = 0;
                colonna < COLONNE;
                colonna++
            ) {

                if (
                    tabellone[riga][colonna] === null
                ) {

                    rigaDestinazione = riga;
                    colonnaDestinazione = colonna;

                    break;
                }
            }

            if (
                rigaDestinazione !== null
            ) {
                break;
            }
        }

        // Tabellone pieno
        if (
            rigaDestinazione === null
        ) {

            oggettiNelDeposito.push(
                oggettoInRientroDalDeposito
            );

            oggettoInRientroDalDeposito =
                null;

            alert(
                "Il tabellone è pieno."
            );

            aggiornaDeposito();
            salvaPartita();

            return;
        }

        const cellaDestinazione =
            document.querySelector(
                `.cella[data-riga="${rigaDestinazione}"][data-colonna="${colonnaDestinazione}"]`
            );

        if (!cellaDestinazione) {
            return;
        }

        const pulsanteDeposito =
            document.getElementById(
                "pulsanteDeposito"
            );

        const posizione =
            pulsanteDeposito.getBoundingClientRect();

        const clone =
            document.createElement("div");

        clone.className =
            "oggettoRientroDeposito";

        const icona =
            livelliOggetti[
                oggettoInRientroDalDeposito.tipo
            ]
            ? livelliOggetti[
                oggettoInRientroDalDeposito.tipo
            ][
                oggettoInRientroDalDeposito.livello
            ]
            : "📦";

        clone.innerHTML = icona;

        clone.style.position =
            "fixed";

        clone.style.left =
            posizione.left +
            posizione.width / 2 +
            "px";

        clone.style.top =
            posizione.top +
            posizione.height / 2 +
            "px";

        clone.style.zIndex =
            "99999";

        clone.style.pointerEvents =
            "none";

        document.body.appendChild(
            clone
        );

        const destinazione =
            cellaDestinazione.getBoundingClientRect();

        requestAnimationFrame(() => {

            clone.style.left =
                destinazione.left +
                destinazione.width / 2 +
                "px";

            clone.style.top =
                destinazione.top +
                destinazione.height / 2 +
                "px";

            clone.style.transform =
                "translate(-50%, -50%) scale(.8)";

        });

        const oggettoDaInserire =
            oggettoInRientroDalDeposito;

        oggettoInRientroDalDeposito =
            null;

        setTimeout(() => {

            tabellone[
                rigaDestinazione
            ][
                colonnaDestinazione
            ] =
                oggettoDaInserire;

            clone.remove();

            aggiornaTabellone();
            aggiornaDeposito();
            salvaPartita();

        }, 450);
    });
    
function aggiornaDeposito() {

    const contenitore =
        document.getElementById("contenitoreDeposito");

    if (!contenitore) return;

    contenitore.innerHTML = "";

    const totaleCelle = celleDepositoSbloccate + 1;

    for (
        let indice = 0;
        indice < totaleCelle;
        indice++
    ) {

        const cella =
            document.createElement("div");

        cella.className = "cellaDeposito";

        // CELLE SBLOCCATE
        if (indice < celleDepositoSbloccate) {

if (oggettiNelDeposito[indice]) {

    const oggetto =
        oggettiNelDeposito[indice];

    const icona =
        livelliOggetti[oggetto.tipo]
        ? livelliOggetti[oggetto.tipo][oggetto.livello]
        : "📦";

    cella.innerHTML = `
        <span class="iconaDeposito">
            ${icona}
        </span>
    `;

    cella.addEventListener(
        "click",
        function () {

            oggettoInRientroDalDeposito =
                oggettiNelDeposito[indice];

            oggettiNelDeposito.splice(
                indice,
                1
            );

            aggiornaDeposito();

            salvaPartita();
        }
    );

            } else {

                cella.innerHTML = `
                    <span class="depositoVuoto">
                        +
                    </span>
                `;
            }

        }

        // PRIMA CELLA BLOCCATA
        else {

            const costo =
                (celleDepositoSbloccate - 4) * 10;

            cella.classList.add(
                "cellaDepositoBloccata"
            );

            cella.innerHTML = `
                🔒
                <strong>${costo} 💎</strong>
            `;

            cella.addEventListener(
                "click",
                function () {

                    if (
                        diamantiGiocatore < costo
                    ) {
                        alert(
                            "Non hai abbastanza diamanti."
                        );
                        return;
                    }

                    diamantiGiocatore -= costo;

                    celleDepositoSbloccate++;

                    aggiornaDiamanti();
                    aggiornaDeposito();
                    salvaPartita();
                }
            );
        }

        contenitore.appendChild(cella);
    }
}

document.addEventListener("DOMContentLoaded", function () {

    let avatarSelezionato = null;

    const avatarSalvato =
        localStorage.getItem("avatarGiocatore");

    const sceltaAvatar =
        document.getElementById("sceltaAvatar");

    const avatarLivello =
        document.getElementById("avatarLivello");


    // ================================
    // AVATAR GIÀ SALVATO
    // ================================

    if (avatarSalvato) {

        if (sceltaAvatar) {
            sceltaAvatar.style.display = "none";
        }

        if (avatarLivello) {
            avatarLivello.src =
                "immagini/avatar/" +
                avatarSalvato +
                ".jpg";
        }

    } else {

        // NUOVO GIOCATORE:
        // l'avatar rimane nascosto
        // fino alla fine della storia

        if (sceltaAvatar) {
            sceltaAvatar.style.display = "none";
        }

    }


    // ================================
    // SELEZIONE AVATAR
    // ================================

    document
        .querySelectorAll(".avatarScelta")
        .forEach(function (bottone) {

            bottone.addEventListener(
                "click",
                function () {

                    document
                        .querySelectorAll(".avatarScelta")
                        .forEach(function (altro) {

                            altro.classList.remove(
                                "selezionato"
                            );

                        });

                    bottone.classList.add(
                        "selezionato"
                    );

                    avatarSelezionato =
                        bottone.dataset.avatar;

                    const conferma =
                        document.getElementById(
                            "confermaAvatar"
                        );

                    if (conferma) {
                        conferma.disabled = false;
                    }

                }
            );

        });


    // ================================
    // CONFERMA AVATAR
    // ================================

    const confermaAvatar =
        document.getElementById(
            "confermaAvatar"
        );

    if (confermaAvatar) {

        confermaAvatar.addEventListener(
            "click",
            function () {

                if (!avatarSelezionato) {
                    return;
                }

                localStorage.setItem(
                    "avatarGiocatore",
                    avatarSelezionato
                );

if (sceltaAvatar) {
    sceltaAvatar.style.display =
        "none";
}

if (avatarLivello) {
    avatarLivello.src =
        "immagini/avatar/" +
        avatarSelezionato +
        ".jpg";
}


// ================================
// MOSTRA REGALO DI BENVENUTO
// ================================

const popupBenvenuto =
    document.getElementById(
        "popupBenvenuto"
    );

if (
    popupBenvenuto &&
    !regaloBenvenutoRiscattato
) {
    popupBenvenuto.style.display =
        "flex";
}

            }
        );

    }

});

// =============================
// NUOVO SISTEMA CONSENSO
// SOLO NUOVI UTENTI
// =============================

document.addEventListener("DOMContentLoaded", function () {

    const consensoPopup =
        document.getElementById("consensoPopup");

    const accettaConsenso =
        document.getElementById("accettaConsenso");

    if (!consensoPopup || !accettaConsenso) {
        return;
    }
    
    console.log(
    "CONSENSO SALVATO:",
    localStorage.getItem("mergeCasaConsenso")
);

    const consensoGiaAccettato =
        localStorage.getItem("mergeCasaConsenso");

// UTENTE GIÀ REGISTRATO
if (consensoGiaAccettato === "true") {
    consensoPopup.style.display = "none";
    return;
}

    // NUOVO UTENTE
    consensoPopup.style.display = "flex";

accettaConsenso.addEventListener(
    "click",
    function () {

        localStorage.setItem(
            "mergeCasaConsenso",
            "true"
        );

consensoPopup.style.display = "none";

const schermataIniziale =
    document.getElementById("schermataIniziale");

if (schermataIniziale) {
    schermataIniziale.style.display = "none";
}

avviaStoria();

    }
);

});

// =============================
// USER AGREEMENT
// =============================

document.addEventListener("DOMContentLoaded", function () {

    const apriUserAgreement =
        document.getElementById("apriUserAgreement");

    const paginaUserAgreement =
        document.getElementById("paginaUserAgreement");

    const chiudiUserAgreement =
        document.getElementById("chiudiUserAgreement");

    if (!apriUserAgreement || !paginaUserAgreement) {
        return;
    }

    apriUserAgreement.addEventListener(
        "click",
        function () {
            paginaUserAgreement.style.display = "flex";
        }
    );

    if (chiudiUserAgreement) {
        chiudiUserAgreement.addEventListener(
            "click",
            function () {
                paginaUserAgreement.style.display = "none";
            }
        );
    }

});

// =============================
// PRIVACY POLICY
// =============================

document.addEventListener("DOMContentLoaded", function () {

    const apriPrivacyPolicy =
        document.getElementById("apriPrivacyPolicy");

    const paginaPrivacyPolicy =
        document.getElementById("paginaPrivacyPolicy");

    const chiudiPrivacyPolicy =
        document.getElementById("chiudiPrivacyPolicy");

    if (!apriPrivacyPolicy || !paginaPrivacyPolicy) {
        return;
    }

    apriPrivacyPolicy.addEventListener(
        "click",
        function () {

            paginaPrivacyPolicy.style.display = "flex";

        }
    );

    if (chiudiPrivacyPolicy) {

        chiudiPrivacyPolicy.addEventListener(
            "click",
            function () {

                paginaPrivacyPolicy.style.display = "none";

            }
        );

    }

});