COPS-IITBHU · nb9960 · Apr 28, 2020 · Apr 28, 2020 · May 1, 2020
diff --git a/auth_required.js b/auth_required.js
@@ -1,3 +1,3 @@
-/***
- * @todo Redirect the user to login page if token is not present.
- */
+if (!(localStorage.getItem("token"))) {
+    window.location.href = '/login';
+}
diff --git a/index.html b/index.html
@@ -65,8 +65,7 @@
                 Available Tasks
             </span>
 
-
-            <li class="list-group-item d-flex justify-content-between align-items-center">
+             <!-- <li class="list-group-item d-flex justify-content-between align-items-center">
                     <input id="input-button-1" type="text" class="form-control todo-edit-task-input hideme" placeholder="Edit The Task">
                     <div id="done-button-1"  class="input-group-append hideme">
                         <button class="btn btn-outline-secondary todo-update-task" type="button" onclick="updateTask(1)">Done</button>
@@ -109,7 +108,7 @@
                                 width="18px" height="22px">
                         </button>
                     </span>
-            </li>
+            </li> -->
 
 
         </ul>

diff --git a/init.js b/init.js
@@ -1,10 +1,23 @@
 function getTasks() {
-    /***
-     * @todo Fetch the tasks created by the user and display them in the dom.
-     */
-}
-
-$.ajax({
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/',
+        method: 'GET',
+        success: function(data,status,xhr){
+            $(".list-group").html("<span class='badge badge-primary badge-pill todo-available-tasks-text'>Available Tasks</span>");
+            $.each(data, function(i, task){
+                $('.list-group').append('<li class="list-group-item d-flex justify-content-between align-items-center"><input id="input-button-'+task.id+'" type="text" class="form-control todo-edit-task-input hideme" placeholder="Edit The Task"><div id="done-button-'+task.id+'"  class="input-group-append hideme"><button class="btn btn-outline-secondary todo-update-task" type="button" onclick="updateTask('+task.id+')">Done</button></div><div id="task-'+task.id+'" class="todo-task">'+task.title+'</div><span id="task-actions-'+task.id+'"><button style="margin-right:5px;" type="button" onclick="editTask('+task.id+')"class="btn btn-outline-warning"><img src="https://res.cloudinary.com/nishantwrp/image/upload/v1587486663/CSOC/edit.png" width="18px" height="20px"></button><button type="button" class="btn btn-outline-danger" onclick="deleteTask('+task.id+')"><img src="https://res.cloudinary.com/nishantwrp/image/upload/v1587486661/CSOC/delete.svg" width="18px" height="22px"></button></span></li>');
+            })
+        },
+        error: function(xhr,status,err){
+            alert("ERROR!");
+        }
+    })
+  }
+
+  $.ajax({
     headers: {
         Authorization: 'Token ' + localStorage.getItem('token'),
     },
@@ -15,4 +28,4 @@ $.ajax({
         document.getElementById('profile-name').innerHTML = data.name;
         getTasks();
     }
-})
+  })
diff --git a/main.js b/main.js
@@ -71,19 +71,53 @@ function register() {
 }
 
 function login() {
-    /***
-     * @todo Complete this function.
-     * @todo 1. Write code for form validation.
-     * @todo 2. Fetch the auth token from backend and login the user.
-     */
+    const name = document.getElementById("inputUsername").value.trim();
+    const pass = document.getElementById("inputPassword").value;
+
+    if(name==="" || pass===""){
+        displayErrorToast("Please fill all the fields correctly.");
+        return false;
+    }
+
+    $.ajax({
+        url: API_BASE_URL + 'auth/login/',
+        type: "POST",
+        data : {
+            username: name,
+            password: pass
+        },
+        success : function(data,status,xhr){
+            localStorage.setItem('token',data.token);
+            window.location.href = '/';
+        },
+        error: function(xhr,status,error){
+            document.getElementById('inputPassword').value='';
+            displayErrorToast('Please enter correct email and password');
+        }
+    });
 }
 
 function addTask() {
-    /**
-     * @todo Complete this function.
-     * @todo 1. Send the request to add the task to the backend server.
-     * @todo 2. Add the task in the dom.
-     */
+    const Task = document.querySelector(".form-control").value.trim();
+
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/create/',
+        type: "POST",
+        data:{
+            title:Task,
+        },
+        success: function(status,xhr){
+            displaySuccessToast("ADDED!");
+            getTasks();
+        },
+        error: function(xhr,status,error){
+            displayErrorToast("Invalid input!");
+        }
+    });
+    document.querySelector(".form-control").value="";
 }
 
 function editTask(id) {
@@ -94,17 +128,50 @@ function editTask(id) {
 }
 
 function deleteTask(id) {
-    /**
-     * @todo Complete this function.
-     * @todo 1. Send the request to delete the task to the backend server.
-     * @todo 2. Remove the task from the dom.
-     */
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/'+id+'/',
+        type: "DELETE",
+        data: {
+            id:id,
+        },
+        success: function(status,xhr){
+            document.getElementById("task-" + id).parentElement.remove();
+            displaySuccessToast("DELETED!");
+        },
+        error: function(xhr,status,err){
+            displayErrorToast("ERROR!");
+        }
+    });
 }
 
 function updateTask(id) {
-    /**
-     * @todo Complete this function.
-     * @todo 1. Send the request to update the task to the backend server.
-     * @todo 2. Update the task in the dom.
-     */
-}
+    const update = document.getElementById("input-button-"+id).value;
+
+    if(update===""){
+        displayErrorToast('Invalid input!');
+        return false;
+    }
+
+    $.ajax({
+        headers: {
+            Authorization: 'Token ' + localStorage.getItem('token'),
+        },
+        url: API_BASE_URL + 'todo/'+id+'/',
+        type: "PUT",
+        data: {
+            title:update,
+        },
+        success: function(data,status,xhr){
+                displaySuccessToast("UPDATED!");
+                getTasks();
+        },
+        error: function(xhr,status,err){
+            displayErrorToast("ERROR!");
+            editTask(id);
+        }
+
+    })
+}
diff --git a/no_auth_required.js b/no_auth_required.js
@@ -1,3 +1,3 @@
-/***
- * @todo Redirect the user to main page if token is present.
- */
+if (localStorage.getItem("token")) {
+    window.location.href = '/';
+}