Commit 7507f85e authored by Milan Iliev's avatar Milan Iliev

Deleting Tasks

parent f49f843b
......@@ -3,6 +3,8 @@
<head>
<meta charset="utf8"/>
<link rel="stylesheet" href="main.css"/>
<script src="sugar.js"></script>
<script>Sugar.extend()</script>
</head>
<body>
......@@ -15,7 +17,7 @@
<input type="date" name="due_date"/>
<button>Delete</button>
<button id="delete_button">Delete</button>
</task-detail>
<button id="add_button">Add Task</button>
......
......@@ -29,6 +29,11 @@ let tasks = [
new Task({done: false, description: "Do Chores" }),
]
let task_views = []
let list = document.querySelector("task-list")
class TaskView {
static template = `
<input type="checkbox" name="done"/>
......@@ -61,7 +66,6 @@ class TaskView {
}
class DetailTaskView {
constructor(element){
this.element = element
this.fields = {
......@@ -76,6 +80,18 @@ class DetailTaskView {
this.fields.done.addEventListener("change", () => {
this.task.done = this.fields.done.checked
})
this.deleteButton = this.element.querySelector("#delete_button")
this.deleteButton.addEventListener("click", () => {
let summary_view_for_deleted_task = task_views.find((summary_view) => summary_view.task === this.task)
task_views.remove(summary_view_for_deleted_task)
tasks.remove(this.task)
list.removeChild(summary_view_for_deleted_task.element)
})
}
get task(){
......@@ -96,12 +112,12 @@ class DetailTaskView {
let detail_view = new DetailTaskView(document.querySelector("task-detail"))
let list = document.querySelector("task-list")
let addTask = function(task){
let view = new TaskView(task)
view.element.addEventListener("click", () => detail_view.task = task )
list.appendChild(view.element)
task_views.push(view)
}
for (let task of tasks){ addTask(task) }
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment