From 09286146441bfb31e4ad292dca5f1727db61e7bc Mon Sep 17 00:00:00 2001 From: Bobur Date: Wed, 22 Oct 2025 22:21:52 +0300 Subject: [PATCH 01/23] fix: add for accessibility (rule 1.1) --- index.html | 72 ++++++++++++++++++++++++++++++++++++++++++------------ 1 file changed, 56 insertions(+), 16 deletions(-) diff --git a/index.html b/index.html index ef4aa1f60c..6127ee1011 100644 --- a/index.html +++ b/index.html @@ -1,19 +1,59 @@ - -Todo App - - - + + + + + + Todo App + + + -
Want more details?
-

-

Todo

-

Completed

-
- +
+ + Want more details? +
+
+

+ +

+ + +
+

+

Todo

+ +

Completed

+ +
+ \ No newline at end of file From 5c19f4f24f8a422d3bc784c387d034209759a595 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 16:38:21 +0300 Subject: [PATCH 02/23] fix: add alt attributes to all images for accessibility according to rule 1.2 in html-and-css-extended.md --- app.js | 3 ++- index.html | 8 ++++---- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/app.js b/app.js index ab737a6002..4f64d823b7 100644 --- a/app.js +++ b/app.js @@ -44,7 +44,8 @@ var createNewTaskElement=function(taskString){ editButton.className="edit"; deleteButton.className="delete"; - deleteButtonImg.src='./remove.svg'; + deleteButtonImg.src='./remove.svg'; + deleteButtonImg.alt = "remove task"; deleteButton.appendChild(deleteButtonImg); diff --git a/index.html b/index.html index 6127ee1011..668db9a82a 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@
- + eisenhower-matrix Want more details?
@@ -28,7 +28,7 @@

Todo

  • @@ -37,7 +37,7 @@

    Todo

    • @@ -49,7 +49,7 @@

    Completed

    From 7bf14f4b4199020462d3b18a1e7f8ab8153a84f2 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 22:28:00 +0300 Subject: [PATCH 03/23] refactor: use meaningful class names (.aaa to .app-header) according to rule 3.2 in html-and-css.md --- index.html | 2 +- style.css | 10 +++++----- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/index.html b/index.html index 668db9a82a..b7fe2cb984 100644 --- a/index.html +++ b/index.html @@ -10,7 +10,7 @@
    eisenhower-matrix - Want more details? + Want more details?

    diff --git a/style.css b/style.css index ab36227705..917e0706e6 100644 --- a/style.css +++ b/style.css @@ -4,21 +4,21 @@ body { color: #333; font-family: Lato, sans-serif; } -.aaa { +.aaa-header { width: 500px; margin: 0 auto; display: block; text-align: right; } -.aaa img { +.aaa-header img { width: 100%; } -.aaa .more_inf { +.aaa-header .more-info { font-family: fantasy, cursive; } @media (max-width:768px) { -.aaa { text-align: center; +.aaa-header { text-align: center; } } .centered-main-page-element { @@ -129,7 +129,7 @@ button.delete img:hover { /* Completed */ ul#completed-tasks label { - text-decoration: line-through + text-decoration: line-through; color: #888; } From c8717af69916c127df8258240df2e7bef288b1f6 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 22:43:39 +0300 Subject: [PATCH 04/23] refactor: use kebab-case for class and id names according to rule 3.1 in html-and-css.md --- app.js | 2 +- index.html | 6 +++--- style.css | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/app.js b/app.js index 4f64d823b7..b01469765a 100644 --- a/app.js +++ b/app.js @@ -10,7 +10,7 @@ var taskInput=document.getElementById("new-task");//Add a new task. var addButton=document.getElementsByTagName("button")[0];//first button -var incompleteTaskHolder=document.getElementById("incompleteTasks");//ul of #incompleteTasks +var incompleteTaskHolder=document.getElementById("incomplete-tasks");//ul of #incompleteTasks var completedTasksHolder=document.getElementById("completed-tasks");//completed-tasks diff --git a/index.html b/index.html index b7fe2cb984..0ef9aa42ec 100644 --- a/index.html +++ b/index.html @@ -12,8 +12,8 @@ eisenhower-matrix Want more details?

    -
    -

    +

    +

    @@ -21,7 +21,7 @@

    Todo

    -
      +
      • diff --git a/style.css b/style.css index 917e0706e6..74e8948510 100644 --- a/style.css +++ b/style.css @@ -21,7 +21,7 @@ body { .aaa-header { text-align: center; } } -.centered-main-page-element { +.todo-container { display: block; width: 500px; margin: 0 auto 0; From 505dd930270aeaf368f90bdac5f460569d2d4d41 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:00:44 +0300 Subject: [PATCH 05/23] refactor: separate selectors and properties with line breaks according to rule 3.8 in html-and-css.md --- style.css | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 74e8948510..d31fe3af42 100644 --- a/style.css +++ b/style.css @@ -38,10 +38,12 @@ ul { margin:0; padding: 0px; } -li, h3 { +li, +h3 { list-style:none; } -input,button{ +input, +button{ outline:none; } button { From 4b2cd7a0e0c183f18f37739fac7831b7bdd8629f Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:10:49 +0300 Subject: [PATCH 06/23] refactor: use consistent 2-space indentation according to rule 1.1 and 3.5 in html-and-css.md --- style.css | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/style.css b/style.css index d31fe3af42..c110582fbc 100644 --- a/style.css +++ b/style.css @@ -1,8 +1,8 @@ /* Basic Style */ body { - background-color: #f8f8f8; - color: #333; - font-family: Lato, sans-serif; + background-color: #f8f8f8; + color: #333; + font-family: Lato, sans-serif; } .aaa-header { width: 500px; From a6be3df2a2d6cf1771f332a37a8931185ea33aed Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:15:23 +0300 Subject: [PATCH 07/23] fix: add space after colon in CSS properties according to rule 3.6 in html-and-css.md --- style.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/style.css b/style.css index c110582fbc..181c9ce91e 100644 --- a/style.css +++ b/style.css @@ -35,7 +35,7 @@ body { display: flex; } ul { - margin:0; + margin: 0; padding: 0px; } li, @@ -137,14 +137,14 @@ ul#completed-tasks label { /* Edit Task */ ul li input[type=text] { - display:none + display: none; } ul li.editMode input[type=text] { display:inline-block; - width:224px + width: 224px; } ul li.editMode label { - display:none; + display: none; } \ No newline at end of file From e61f41e5800d30fff5dec646d42d2a16e81297f8 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:20:41 +0300 Subject: [PATCH 08/23] fix: add semicolon after each CSS property according to rule 3.7 in html-and-css.md --- style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 181c9ce91e..1761d184b2 100644 --- a/style.css +++ b/style.css @@ -29,7 +29,7 @@ body { .task { width: 56%; display: inline-block; - flex-grow: 1 + flex-grow: 1; } .task-row-wrapper { display: flex; @@ -118,7 +118,7 @@ li > label { width: 226px; } li > input[type="text"] { - width: 226px + width: 226px; } button.delete img { height: 2em; From 7fb9348eedd6b00d92bcfc6811feb0d3d3817575 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:32:04 +0300 Subject: [PATCH 09/23] fix: convert hex color values to lowercase according to rule 1.2 in html-and-css.md --- style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 1761d184b2..e5219a898e 100644 --- a/style.css +++ b/style.css @@ -75,8 +75,8 @@ input[type="text"] { line-height: 18px; height: 21px; padding: 0 9px; - border: 1px solid #dDd; - background: #FFF; + border: 1px solid #ddd; + background: #fff; border-radius: 6px; font-family: Lato, sans-serif; color: #888; From 8a31f54b696ceb63acb8caa6bc5e32671a5db98e Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:35:56 +0300 Subject: [PATCH 10/23] refactor: remove tag selectors from CSS according to rule 3.4 in html-and-css.md --- style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/style.css b/style.css index e5219a898e..c7528a6fdd 100644 --- a/style.css +++ b/style.css @@ -130,7 +130,7 @@ button.delete img:hover { } /* Completed */ -ul#completed-tasks label { +#completed-tasks label { text-decoration: line-through; color: #888; } From ace8e4d34bcb9e84b5d0897435682c8eb9d4c945 Mon Sep 17 00:00:00 2001 From: Bobur Date: Thu, 16 Oct 2025 23:44:12 +0300 Subject: [PATCH 11/23] fix: add space after colon in CSS properties according to rule 3.6 in html-and-css.md --- style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index c7528a6fdd..b47239ff12 100644 --- a/style.css +++ b/style.css @@ -40,11 +40,11 @@ ul { } li, h3 { - list-style:none; + list-style: none; } input, button{ - outline:none; + outline: none; } button { background: none; From 19f0c65a1166b80f1686ef93861eefcb69b3d749 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 00:17:51 +0300 Subject: [PATCH 12/23] fix: add space after colon in CSS properties according to rule 3.6 in html-and-css.md --- style.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index b47239ff12..c8111eef65 100644 --- a/style.css +++ b/style.css @@ -17,8 +17,9 @@ body { font-family: fantasy, cursive; } -@media (max-width:768px) { -.aaa-header { text-align: center; +@media (max-width: 768px) { +.aaa-header { + text-align: center; } } .todo-container { From b59e414954d8f27883fefd61e1f0bca774d0d845 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 00:41:14 +0300 Subject: [PATCH 13/23] refactor: use consistent 2-space indentation according to rule 1.1 in html-and-css.md --- style.css | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/style.css b/style.css index c8111eef65..27c6befb89 100644 --- a/style.css +++ b/style.css @@ -5,21 +5,21 @@ body { font-family: Lato, sans-serif; } .aaa-header { - width: 500px; - margin: 0 auto; - display: block; - text-align: right; + width: 500px; + margin: 0 auto; + display: block; + text-align: right; } .aaa-header img { - width: 100%; + width: 100%; } .aaa-header .more-info { - font-family: fantasy, cursive; + font-family: fantasy, cursive; } @media (max-width: 768px) { .aaa-header { - text-align: center; + text-align: center; } } .todo-container { From 577719673e9d1743f651da51cce711d19e42ef84 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 00:45:28 +0300 Subject: [PATCH 14/23] fix: use double quotes in attribute selectors according to rule 1.3 in html-and-css.md --- style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 27c6befb89..d3a682ef43 100644 --- a/style.css +++ b/style.css @@ -61,7 +61,7 @@ button:hover { } /* Heading */ h3, -label[for='new-task'] { +label[for="new-task"] { color: #333; font-weight: 700; font-size: 15px; @@ -87,7 +87,7 @@ input[type="text"]:focus { } /* New Task */ -label[for='new-task'] { +label[for="new-task"] { display: block; margin: 0 0 20px; } From 4c644090bfbe65679c533971c6695170fe5ed668 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 00:50:50 +0300 Subject: [PATCH 15/23] fix: convert hex color to lowercase according to rule 1.2 in html-and-css.md --- style.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/style.css b/style.css index d3a682ef43..b410999576 100644 --- a/style.css +++ b/style.css @@ -57,7 +57,7 @@ button { cursor: pointer; } button:hover { - color: #3a3A3a; + color: #3a3a3a; } /* Heading */ h3, From ee0a86e71c664c216b66a6b6f192c14099053e3f Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 00:58:57 +0300 Subject: [PATCH 16/23] refactor: rename .aaa-header to .app-header for meaningful naming according to rule 3.2 in html-and-css.md --- index.html | 2 +- style.css | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/index.html b/index.html index 0ef9aa42ec..464399b479 100644 --- a/index.html +++ b/index.html @@ -8,7 +8,7 @@ -
        +
        eisenhower-matrix Want more details?
        diff --git a/style.css b/style.css index b410999576..56535036a6 100644 --- a/style.css +++ b/style.css @@ -4,21 +4,21 @@ body { color: #333; font-family: Lato, sans-serif; } -.aaa-header { +.app-header { width: 500px; margin: 0 auto; display: block; text-align: right; } -.aaa-header img { +.app-header img { width: 100%; } -.aaa-header .more-info { +.app-header .more-info { font-family: fantasy, cursive; } @media (max-width: 768px) { -.aaa-header { +.app-header { text-align: center; } } From 0da8c53c69dbb593eab69a50845aab84071467f9 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 01:09:35 +0300 Subject: [PATCH 17/23] fix: fix spacing issues in CSS properties according to rule 3.6 in html-and-css.md --- style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 56535036a6..64fd39c829 100644 --- a/style.css +++ b/style.css @@ -118,7 +118,7 @@ li > label { font-size: 18px; width: 226px; } -li > input[type="text"] { +li > input[type="text"] { width: 226px; } button.delete img { @@ -142,7 +142,7 @@ ul li input[type=text] { } ul li.editMode input[type=text] { - display:inline-block; + display: inline-block; width: 224px; } From cd53576f5cc0400deece26065a527791f2a37e26 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 01:11:52 +0300 Subject: [PATCH 18/23] refactor: remove units from zero values for cleaner CSS --- style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index 64fd39c829..e549fe6bef 100644 --- a/style.css +++ b/style.css @@ -37,7 +37,7 @@ body { } ul { margin: 0; - padding: 0px; + padding: 0; } li, h3 { @@ -49,7 +49,7 @@ button{ } button { background: none; - border: 0px; + border: 0; color: #888; font-size: 15px; width: 60px; From d765e547d130c2a9263a9c874228d0e956797117 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 01:38:38 +0300 Subject: [PATCH 19/23] refactor: use semantic HTML5 elements according to rule 1.1 in html-and-css-extended.md --- index.html | 88 +++++++++++++++++++++++++++++------------------------- 1 file changed, 48 insertions(+), 40 deletions(-) diff --git a/index.html b/index.html index 464399b479..26d9463f5b 100644 --- a/index.html +++ b/index.html @@ -8,52 +8,60 @@ -
        - eisenhower-matrix +
        + Eisenhower Matrix diagram Want more details? -
        -
        -

        + + +

        +
        -

        -

        Todo

        -
          -
        • - - - - - -
          • -
        • - - - - - -
          • -
        -

        Completed

        -
          -
        • - - - - - -
          • -
        -
        + + +
        +

        Todo

        +
          +
        • + + + + + +
          • +
        • + + + + + +
          • +
        +
        + +
        +

        Completed

        +
          +
        • + + + + + +
          • +
        +
        + + \ No newline at end of file From 04d16fccb89c6515e65b5eeb419ef928d3707df4 Mon Sep 17 00:00:00 2001 From: Bobur Date: Fri, 17 Oct 2025 01:48:23 +0300 Subject: [PATCH 20/23] refactor: improve JavaScript code style and formatting --- app.js | 316 ++++++++++++++++++++++++++------------------------------- 1 file changed, 145 insertions(+), 171 deletions(-) diff --git a/app.js b/app.js index b01469765a..45ee1ece86 100644 --- a/app.js +++ b/app.js @@ -1,196 +1,170 @@ -//Document is the DOM can be accessed in the console with document.window. +// Document is the DOM can be accessed in the console with document.window. // Tree is from the top, html, body, p etc. -//Problem: User interaction does not provide the correct results. -//Solution: Add interactivity so the user can manage daily tasks. -//Break things down into smaller steps and take each step at a time. - +// Problem: User interaction does not provide the correct results. +// Solution: Add interactivity so the user can manage daily tasks. +// Break things down into smaller steps and take each step at a time. // Event handling, user interaction is what starts the code execution. -var taskInput=document.getElementById("new-task");//Add a new task. -var addButton=document.getElementsByTagName("button")[0];//first button -var incompleteTaskHolder=document.getElementById("incomplete-tasks");//ul of #incompleteTasks -var completedTasksHolder=document.getElementById("completed-tasks");//completed-tasks - - -//New task list item -var createNewTaskElement=function(taskString){ - - var listItem=document.createElement("li"); - - //input (checkbox) - var checkBox=document.createElement("input");//checkbx - //label - var label=document.createElement("label");//label - //input (text) - var editInput=document.createElement("input");//text - //button.edit - var editButton=document.createElement("button");//edit button - - //button.delete - var deleteButton=document.createElement("button");//delete button - var deleteButtonImg=document.createElement("img");//delete button image - - label.innerText=taskString; - label.className='task'; - - //Each elements, needs appending - checkBox.type="checkbox"; - editInput.type="text"; - editInput.className="task"; - - editButton.innerText="Edit"; //innerText encodes special characters, HTML does not. - editButton.className="edit"; - - deleteButton.className="delete"; - deleteButtonImg.src='./remove.svg'; - deleteButtonImg.alt = "remove task"; - deleteButton.appendChild(deleteButtonImg); - - - //and appending. - listItem.appendChild(checkBox); - listItem.appendChild(label); - listItem.appendChild(editInput); - listItem.appendChild(editButton); - listItem.appendChild(deleteButton); - return listItem; -} - - - -var addTask=function(){ - console.log("Add Task..."); - //Create a new list item with the text from the #new-task: - if (!taskInput.value) return; - var listItem=createNewTaskElement(taskInput.value); - - //Append listItem to incompleteTaskHolder - incompleteTaskHolder.appendChild(listItem); - bindTaskEvents(listItem, taskCompleted); - - taskInput.value=""; - -} - -//Edit an existing task. - -var editTask=function(){ - console.log("Edit Task..."); - console.log("Change 'edit' to 'save'"); - - - var listItem=this.parentNode; - - var editInput=listItem.querySelector('input[type=text]'); - var label=listItem.querySelector("label"); - var editBtn=listItem.querySelector(".edit"); - var containsClass=listItem.classList.contains("editMode"); - //If class of the parent is .editmode - if(containsClass){ - - //switch to .editmode - //label becomes the inputs value. - label.innerText=editInput.value; - editBtn.innerText="Edit"; - }else{ - editInput.value=label.innerText; - editBtn.innerText="Save"; - } - - //toggle .editmode on the parent. - listItem.classList.toggle("editMode"); +var taskInput = document.getElementById("new-task"); // Add a new task. +var addButton = document.getElementsByTagName("button")[0]; // first button +var incompleteTaskHolder = document.getElementById("incomplete-tasks"); // ul of #incomplete-tasks +var completedTasksHolder = document.getElementById("completed-tasks"); // completed-tasks + +// New task list item +var createNewTaskElement = function(taskString) { + var listItem = document.createElement("li"); + + // input (checkbox) + var checkBox = document.createElement("input"); // checkbox + // label + var label = document.createElement("label"); // label + // input (text) + var editInput = document.createElement("input"); // text + // button.edit + var editButton = document.createElement("button"); // edit button + // button.delete + var deleteButton = document.createElement("button"); // delete button + var deleteButtonImg = document.createElement("img"); // delete button image + + label.innerText = taskString; + label.className = "task"; + + // Each elements, needs appending + checkBox.type = "checkbox"; + editInput.type = "text"; + editInput.className = "task"; + + editButton.innerText = "Edit"; // innerText encodes special characters, HTML does not. + editButton.className = "edit"; + + deleteButton.className = "delete"; + deleteButtonImg.src = "./remove.svg"; + deleteButtonImg.alt = "Delete task"; + deleteButton.appendChild(deleteButtonImg); + + // and appending. + listItem.appendChild(checkBox); + listItem.appendChild(label); + listItem.appendChild(editInput); + listItem.appendChild(editButton); + listItem.appendChild(deleteButton); + + return listItem; }; +var addTask = function() { + console.log("Add Task..."); + // Create a new list item with the text from the #new-task: + if (!taskInput.value) return; + var listItem = createNewTaskElement(taskInput.value); -//Delete task. -var deleteTask=function(){ - console.log("Delete Task..."); - - var listItem=this.parentNode; - var ul=listItem.parentNode; - //Remove the parent list item from the ul. - ul.removeChild(listItem); + // Append listItem to incompleteTaskHolder + incompleteTaskHolder.appendChild(listItem); + bindTaskEvents(listItem, taskCompleted); -} - - -//Mark task completed -var taskCompleted=function(){ - console.log("Complete Task..."); - - //Append the task list item to the #completed-tasks - var listItem=this.parentNode; - completedTasksHolder.appendChild(listItem); - bindTaskEvents(listItem, taskIncomplete); - -} - - -var taskIncomplete=function(){ - console.log("Incomplete Task..."); -//Mark task as incomplete. - //When the checkbox is unchecked - //Append the task list item to the #incompleteTasks. - var listItem=this.parentNode; - incompleteTaskHolder.appendChild(listItem); - bindTaskEvents(listItem,taskCompleted); -} - - - -var ajaxRequest=function(){ - console.log("AJAX Request"); -} + taskInput.value = ""; +}; -//The glue to hold it all together. +// Edit an existing task. +var editTask = function() { + console.log("Edit Task..."); + console.log("Change 'edit' to 'save'"); + + var listItem = this.parentNode; + + var editInput = listItem.querySelector("input[type=text]"); + var label = listItem.querySelector("label"); + var editButton = listItem.querySelector(".edit"); + var containsClass = listItem.classList.contains("editMode"); + + // If class of the parent is .editMode + if (containsClass) { + // switch to .editMode + // label becomes the inputs value. + label.innerText = editInput.value; + editButton.innerText = "Edit"; + } else { + editInput.value = label.innerText; + editButton.innerText = "Save"; + } + + // toggle .editMode on the parent. + listItem.classList.toggle("editMode"); +}; +// Delete task. +var deleteTask = function() { + console.log("Delete Task..."); -//Set the click handler to the addTask function. -addButton.onclick=addTask; -addButton.addEventListener("click",addTask); -addButton.addEventListener("click",ajaxRequest); + var listItem = this.parentNode; + var ul = listItem.parentNode; + // Remove the parent list item from the ul. + ul.removeChild(listItem); +}; +// Mark task completed +var taskCompleted = function() { + console.log("Complete Task..."); -var bindTaskEvents=function(taskListItem,checkBoxEventHandler){ - console.log("bind list item events"); -//select ListItems children - var checkBox=taskListItem.querySelector("input[type=checkbox]"); - var editButton=taskListItem.querySelector("button.edit"); - var deleteButton=taskListItem.querySelector("button.delete"); + // Append the task list item to the #completed-tasks + var listItem = this.parentNode; + completedTasksHolder.appendChild(listItem); + bindTaskEvents(listItem, taskIncomplete); +}; +var taskIncomplete = function() { + console.log("Incomplete Task..."); + // Mark task as incomplete. + // When the checkbox is unchecked + // Append the task list item to the #incomplete-tasks. + var listItem = this.parentNode; + incompleteTaskHolder.appendChild(listItem); + bindTaskEvents(listItem, taskCompleted); +}; - //Bind editTask to edit button. - editButton.onclick=editTask; - //Bind deleteTask to delete button. - deleteButton.onclick=deleteTask; - //Bind taskCompleted to checkBoxEventHandler. - checkBox.onchange=checkBoxEventHandler; -} +var ajaxRequest = function() { + console.log("AJAX Request"); +}; -//cycle over incompleteTaskHolder ul list items -//for each list item -for (var i=0; i Date: Wed, 22 Oct 2025 23:34:53 +0300 Subject: [PATCH 21/23] fix: add for encoding HTML5 compliance --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 26d9463f5b..5c1e7fec93 100644 --- a/index.html +++ b/index.html @@ -1,7 +1,7 @@ - + Todo App From 7bc58eeb1950d2bb0083311f63052dea713bd15a Mon Sep 17 00:00:00 2001 From: Bobur Date: Wed, 22 Oct 2025 23:44:34 +0300 Subject: [PATCH 22/23] fix: add for responsive design setup --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 5c1e7fec93..334749638e 100644 --- a/index.html +++ b/index.html @@ -2,7 +2,7 @@ - + Todo App From 80d8542b201f4dc795649411ec1ee5ba02daa783 Mon Sep 17 00:00:00 2001 From: Bobur Date: Wed, 22 Oct 2025 23:51:45 +0300 Subject: [PATCH 23/23] fix: add for HTML5 compliance (rule 2.2) --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 334749638e..921e4fc706 100644 --- a/index.html +++ b/index.html @@ -1,4 +1,4 @@ - +