View difference between Paste ID: NhKpVsV7 and Ytf6MQUZ
SHOW: | | - or go back to the newest paste.
1
function solve() {
2
  let openSection = document.getElementsByTagName("section")[1];
3
  let progressSection = document.getElementsByTagName("section")[2];
4
  let completedSection = document.getElementsByTagName("section")[3];
5
6
  let addBtn = document.getElementById("add");
7
  addBtn.addEventListener("click", (event) => {
8
    event.preventDefault();
9
    let task = document.getElementById("task");
10
    let description = document.getElementById("description");
11
    let date = document.getElementById("date");
12
13
    if (task.value === "" || description.value === "" || date.value === "") {
14
      return;
15
    }
16
17
    let article = document.createElement("article");
18
    let h3 = document.createElement("h3");
19
    h3.innerText = task.value;
20
    let pDescription = document.createElement("p");
21
    pDescription.innerText = `Description: ${description.value}`;
22
    let pDate = document.createElement("p");
23
    pDate.innerText = `Due Date: ${date.value}`;
24
25
    let div = document.createElement("div");
26
    div.className = "flex";
27
    let btnStart = document.createElement("button");
28
    btnStart.className = "green";
29
    btnStart.innerText = "Start";
30
    let btnDelete = document.createElement("button");
31
    btnDelete.className = "red";
32
    btnDelete.innerText = "Delete";
33
34
    btnDelete.addEventListener("click", deleteArticle);
35
36
    btnStart.addEventListener("click", (event) => {
37
      let btnFinish = document.createElement("button");
38
      btnFinish.className = "orange";
39
      btnFinish.innerText = "Finish";
40
41
      btnFinish.addEventListener("click", () => {
42
        article.lastElementChild.remove();
43
        completedSection.lastElementChild.appendChild(article);
44
      });
45
46
      article.lastElementChild.children[0].remove();
47
      article.lastElementChild.appendChild(btnFinish);
48
      progressSection.lastElementChild.appendChild(article);
49
    });
50
51
    div.appendChild(btnStart);
52
    div.appendChild(btnDelete);
53
54
    article.appendChild(h3);
55
    article.appendChild(pDescription);
56
    article.appendChild(pDate);
57
    article.appendChild(div);
58
59
    openSection.lastElementChild.appendChild(article);
60
61
    task.value = "";
62
    description.value = "";
63
    date.value = "";
64
  });
65
66
  function deleteArticle(event) {
67
    event.target.parentElement.parentElement.remove();
68
  }
69
}
70