My portfolio, where I cook up projects.
A collection of games, books and resources I enjoy.
About me - what fuels my journey.
The Problem - needed to cut my goals into small steps
Solution - Created a simple to-do list, that can save notes into localStorage.
const popup = document.getElementById("popup");
let taskArray = [];
function openPopup() {
popup.style.display = "block";
}
function closePopup() {
popup.style.display = "none";
}
function saveTask() {
const taskNameInput = document.getElementById("taskName").value;
const taskDescInput = document.getElementById("taskDesc").value;
const wrappedTask = {
name: taskNameInput,
description: taskDescInput
};
taskArray.push(wrappedTask);
localStorage.setItem('taskArray', JSON.stringify(taskArray));
closePopup();
displayTasks();
}
window.onload = function() {
const savedTasks = localStorage.getItem('taskArray');
if (savedTasks) {
taskArray = JSON.parse(savedTasks);
displayTasks();
}
};
function displayTasks() {
const taskList = document.getElementById('taskList');
taskList.innerHTML = '';
taskArray.forEach((task, index) => {
const li = document.createElement('li');
li.textContent = `${task.name}: ${task.description}`;
const deleteButton = document.createElement('button');
deleteButton.textContent = "Delete";
deleteButton.onclick = function() {
deleteTask(index);
};
li.appendChild(deleteButton);
taskList.appendChild(li);
});
}
function deleteTask(index) {
taskArray.splice(index, 1);
localStorage.setItem('taskArray', JSON.stringify(taskArray));
displayTasks();
}
function clearAllTasks() {
taskArray = [];
localStorage.removeItem('taskArray');
displayTasks();