AppNotas/index.js at main · Lescano713/AppNotas · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
const body = document.body;
const crear = document.getElementById("crear");
const textArea = document.getElementById("text-area");
const notasCreadas = document.getElementById("notas-creadas");

// temas

function oscuro() {
    body.classList.add("fondo-oscuro");
    guardarTema("oscuro")
}
function claro(){
    body.classList.remove("fondo-oscuro");
    guardarTema("claro")

}


function guardarTema(tema) {
    localStorage.setItem("tema", tema)
}

const temaGuardado = localStorage.getItem("tema");

if (temaGuardado === "oscuro") {
    oscuro()
} else {
    claro()
}


// tarjetas

let arrayNotas = JSON.parse(localStorage.getItem("arrayNotas")) || [];
let numero = arrayNotas.length > 0 ? parseInt(arrayNotas[arrayNotas.length - 1].id.replace('tarjeta', '')) + 1 : 1;

cargarTarjetas();
crear.addEventListener("click", crearTarjeta);

function guardarNotasEnLocal(){
    localStorage.setItem("arrayNotas", JSON.stringify(arrayNotas));
}

function cargarTarjetas() {
    notasCreadas.innerHTML = "";
    if(arrayNotas.length > 0 ){
        arrayNotas.forEach(nota => {
        const div = document.createElement("div");
        div.classList.add("tarjeta");
        div.id = nota.id;
        div.innerHTML = `
            <h3>${nota.tarjeta}</h3>
            <button type="button" class="delete">Delete <i class="fa-regular fa-trash-can"></i></button>
        `;
        notasCreadas.appendChild(div);
        textArea.value = "";
        const eliminarBoton = div.querySelector(".delete");
        eliminarBoton.addEventListener("click", ()=> eliminarTarjeta(div.id));

        });
    }
}


function crearTarjeta(){
    const contenido = textArea.value;
    if (contenido !== "") {
        const notas = {
            id : `tarjeta${numero++}`,
            tarjeta : contenido,
        }
        arrayNotas.push(notas)
        guardarNotasEnLocal()
        cargarTarjetas()
    }else{
        alert("Ingresa contenido a la tarjeta por favor")
    }
}


function eliminarTarjeta(id) {
    const tarjetaBorrar = document.getElementById(id);

    if (tarjetaBorrar) {
        tarjetaBorrar.remove();
        arrayNotas = arrayNotas.filter(notas => notas.id !== id)
        guardarNotasEnLocal()
        console.log("tarjeta eliminada " + id)
    }

}