-
Notifications
You must be signed in to change notification settings - Fork 0
/
todo.js
127 lines (97 loc) · 3.77 KB
/
todo.js
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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
var listElement = document.querySelector("#app ul");
var inputElement = document.querySelector("#app input");
var buttonElement = document.querySelector("#app button");
var completeElement = document.querySelector("check-complete");
var todos = JSON.parse(localStorage.getItem("list_todos")) || [];
var completedTodos = localStorage.getItem("completed") || [];
renderTodos();
function renderTodos() {
listElement.innerHTML = "";
pos = 0;
for (var todo of todos) {
var todoElement = document.createElement("li");
inputElement.value = "";
if (todo != "" && todo != " ") {
todoElement.id = "todo " + pos;
var linkElement = document.createElement("a");
linkElement.setAttribute("href", "#");
var completeElement = document.createElement("input");
completeElement.type = "checkbox";
completeElement.className = "check-complete";
var linkText = document.createTextNode("X");
var okElement = document.createElement("a");
okElement.setAttribute("href", "#");
okElement.setAttribute("id", "todos");
var okTextNode = document.createTextNode(pos + 1 + " - " + todo + " ");
okElement.appendChild(okTextNode);
linkElement.style.textDecoration = "none";
completeElement.setAttribute("id", pos);
completeElement.setAttribute("onclick", "complete(" + pos + ")");
if (completedTodos.indexOf(`[${pos}]`) >= 0) {
completeElement.setAttribute("checked", true);
okElement.className = "CheckedTodo";
} else {
completeElement.removeAttribute("checked", true);
}
linkElement.setAttribute("onclick", "deleteTodo(" + pos + ")");
linkElement.appendChild(linkText);
todoElement.appendChild(completeElement);
todoElement.appendChild(linkElement);
todoElement.appendChild(okElement);
listElement.appendChild(todoElement);
pos = pos + 1;
}
}
}
function complete(pos) {
if (completedTodos.indexOf(`[${pos}]`) >= 0) {
completedTodos = completedTodos.replace(`[${pos}]`, "");
completedTodos = completedTodos.replace("[]", "");
localStorage.setItem("completed", completedTodos);
} else {
completedTodos = completedTodos + `[${pos}]`;
localStorage.setItem("completed", completedTodos);
}
renderTodos();
}
buttonElement.addEventListener("click", function() {
addTodo();
inputElement.value = "";
});
inputElement.addEventListener("keydown", function(event) {
if (event.keyCode == "13") {
addTodo();
}
}); //faz com que o ENTER adicione um novo item
function addTodo() {
var todoText = inputElement.value;
var filtro = todoText.split(" ");
inputElement.Value = "";
if (todoText != "" && filtro[0] != "") {
todos.push(todoText);
saveStorage();
}
renderTodos();
document.getElementById("input").select();
}
function deleteTodo(pos) {
todos.splice(pos, 1);
if (completedTodos.indexOf(`[${pos}]`) >= 0) {
completedTodos = completedTodos.replace(`[${pos}]`, "");
completedTodos = completedTodos.replace("[]", "");
}
localStorage.setItem("completed", completedTodos);
for (let index = 0; index <= completedTodos.length; index++) {
numero = completedTodos[index];
if (numero > pos) {
completedTodos = completedTodos.replace(`[${numero}]`, `[${numero - 1}]`);
}
}
localStorage.setItem("completed", completedTodos);
renderTodos();
saveStorage();
}
function saveStorage() {
var pos = todos.indexOf("");
localStorage.setItem("list_todos", JSON.stringify(todos));
}