todoApp/todoApp.js

148 lines
3.6 KiB
JavaScript
Raw Permalink Normal View History

2018-09-24 23:26:50 +02:00
2018-09-21 10:28:43 +02:00
//Variablen
var todoList = [],
i = 0,
storedTodoList,
text;
const todoListDiv = document.getElementById("Todos");
2018-09-21 10:28:43 +02:00
// if (typeof localStorage === "undefined" || localStorage === null) {
// var LocalStorage = require('node-localstorage').LocalStorage;
// localStorage = new LocalStorage('./scratch');
// }
2018-09-21 10:28:43 +02:00
2018-09-24 23:26:50 +02:00
2018-09-21 10:28:43 +02:00
function checkForStorage(){
if (localStorage.getItem("savedTodoList") !== null ){
todoList = getLocalStorage("savedTodoList");
2018-10-02 15:27:40 +02:00
for (var i = 0; i < todoList.length; i++){
console.log(i);
createTodoFromStorage(i);
2018-09-21 10:28:43 +02:00
}
}
}
function createTodoFromStorage(position){
createTodoEntry(position);
}
2018-09-21 10:28:43 +02:00
function addEntry(event) {
event.preventDefault();
const myInput = document.getElementById("myInput");
text = myInput.value;
//checking the submited text
2018-09-21 10:28:43 +02:00
if (text === "" || typeof text === 'undefined' || text === null ) {
return alert("Bitte gib Text ein!");
}
let textAlreadyThere = Array.from(document.querySelectorAll('label')).find(function(label) {
return label.textContent === text
});
2018-09-24 23:26:50 +02:00
2018-09-21 10:28:43 +02:00
if(typeof textAlreadyThere != 'undefined' || textAlreadyThere != null ) {
return alert("Du hast schon so ein To-Do!")
}
//adding the text to the local list and into the storage
addTodoToList(text);
setLocalStorage(todoList);
let lastTodo = todoList.length -1;
createTodoEntry(lastTodo);
2018-09-21 10:28:43 +02:00
myInput.value = "";
myInput.focus();
}
//Main function <---
//creating the entry / element inside the HTML
function createTodoEntry(todoEntry) {
2018-09-21 10:28:43 +02:00
todoEntryDiv = document.createElement("div");
todoEntryDiv.setAttribute("class", "todo-item");
todoEntryDiv.setAttribute("id", todoEntry);
2018-09-21 10:28:43 +02:00
let checkbox = document.createElement("input");
checkbox.setAttribute('type', 'checkbox');
checkbox.checked = todoList[todoEntry].completed;
2018-09-21 10:28:43 +02:00
checkbox.addEventListener('change', function(){
if (checkbox.checked === true){
let doneTodoList = document.getElementById("doneTodos");
doneTodoList.appendChild(document.getElementById(todoEntry));
todoList[todoEntry].completed = true;
setLocalStorage(todoList);
2018-09-21 10:28:43 +02:00
}else {
todoListDiv.appendChild(document.getElementById(todoEntry));
todoList[todoEntry].completed = false;
setLocalStorage(todoList);
2018-09-21 10:28:43 +02:00
}
})
let button = document.createElement("button");
let label = document.createElement("label");
2018-09-24 23:26:50 +02:00
label.innerText = todoList[todoEntry].todoText;
2018-09-21 10:28:43 +02:00
todoEntryDiv.appendChild(checkbox);
2018-09-24 23:26:50 +02:00
2018-09-21 10:28:43 +02:00
todoEntryDiv.appendChild(label);
todoEntryDiv.appendChild(button);
button.innerText = "Remove";
button.onclick = function(){
rmTodo(todoEntry);
setLocalStorage(todoList);
location.reload(true);
2018-09-21 10:28:43 +02:00
}
if (checkbox.checked === true){
let doneTodoList = document.getElementById("doneTodos");
2018-10-04 15:09:59 +02:00
return doneTodoList.appendChild(todoEntryDiv);
}
2018-10-04 15:09:59 +02:00
return todoListDiv.appendChild(todoEntryDiv);
2018-09-21 10:28:43 +02:00
}
function setLocalStorage(storeData) {
2018-09-21 10:28:43 +02:00
localStorage.setItem("savedTodoList", JSON.stringify(storeData));
}
function getLocalStorage() {
2018-10-04 15:09:59 +02:00
return JSON.parse(localStorage.getItem("savedTodoList"));
2018-09-21 10:28:43 +02:00
}
//TodoList object
2018-09-25 14:50:22 +02:00
function addTodoToList(todo) {
2018-09-21 10:28:43 +02:00
todoList.push({
completed: false,
todoText: todo,
})
2018-09-25 14:50:22 +02:00
}
2018-09-21 10:28:43 +02:00
function rmTodo(position) {
2018-09-21 10:28:43 +02:00
todoList.splice(position, 1);
2018-09-24 23:26:50 +02:00
}
2018-09-25 14:50:22 +02:00
checkForStorage()
2018-10-02 15:27:40 +02:00
// module.exports = {
// addTodoToList: addTodoToList,
// foo: foo,
// getTodoList: getTodoList,
// localStorage: localStorage,
// setLocalStorage: setLocalStorage,
// getLocalStorage: getLocalStorage,
// createTodoEntry: createTodoEntry,
// }