Chciałem zrobić aplikację treningową przechowującą dane na temat 4 ostatnich dni treningowych. Zamiarem było wpisywanie ilości serii oraz powtórzeń. Niżej zamieszczam niedziałający kod oraz screen wyglądu aplikacji. Uczę się programować od niedawna więc możliwe, że popełniam jakieś kardynalne błędy. Proszę o pomoc.
const crushed = document.querySelector(".crushed-plan");
const go = document.querySelector(".let-go-plan");
const fall = document.querySelector(".fall-over-plan");
const section = document.querySelector("section");
const choose = document.querySelector(".choose");
const arrow = document.querySelector(".icon-left-big");
const clear = document.querySelector(".icon-arrows-cw");
const box = document.querySelector(".box");
const inputs = document.querySelectorAll("input");
let LIST;
const btn1 = document.querySelector(".crushed");
const btn2 = document.querySelector(".let-go");
const btn3 = document.querySelector(".fall-over");
btn1.addEventListener("click", function(){
section.style.display = "none";
choose.style.display = "none";
crushed.style.display = "block";
});
btn2.addEventListener("click", function(){
section.style.display = "none";
choose.style.display = "none";
go.style.display = "block";
});
btn3.addEventListener("click", function(){
section.style.display = "none";
choose.style.display = "none";
fall.style.display = "block";
});
arrow.addEventListener("click", function(){
if(fall.style.display = "block") fall.style.display = "none";
if(go.style.display = "block") go.style.display = "none";
if(crushed.style.display = "block") crushed.style.display = "none";
choose.style.display = "block";
section.style.display = "flex";
});
let data = localStorage.getItem("PLAN");
if(data)
{
LIST = JSON.parse(data);
id = LIST.length;
loadList();
} else
{
LIST = [];
id = 0;
}
for (let i=0; i<inputs.length; i++) {
inputs[i].addEventListener('keydown', function() {
if(e.keyCode == 13)
{
const number = input.value;
if(number)
{
let id = inputs[i].id;
addNumber(number, id);
LIST.push({
number: number,
id: id
});
localStorage.setItem("PLAN", JSON.stringify(LIST));
}
input.value = "";
}
});
}
function loadList()
{
LIST.forEach(function(){
addNumber(number, id)
});
}
function addNumber(number, id) {
inputs.id.setAttribute("value", number);
}