From 9de8322706d2ca4d50eb0b76b9d8b4b718a30012 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 22:48:19 +0530 Subject: [PATCH 01/13] Completed all functions --- src/main.js | 161 +++++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 141 insertions(+), 20 deletions(-) diff --git a/src/main.js b/src/main.js index 05849df..c2bca77 100644 --- a/src/main.js +++ b/src/main.js @@ -1,4 +1,19 @@ import axios from 'axios'; +import { getTasks } from './init'; +const logoutBtn = document.getElementById("logout") +const registerBtn = document.getElementById("register") +const loginBtn = document.getElementById("login") +const addTaskBtn = document.getElementById("addTaskButton"); +const searchTaskBtn = document.getElementById("searchTaskBtn"); + + +window.onload = ()=>{ + if (logoutBtn) logoutBtn.onclick = logout + if (loginBtn) loginBtn.onclick = login + if (registerBtn) registerBtn.onclick = register + if (addTaskBtn) addTaskButton.onclick = addTask; + if (searchTaskBtn) searchTaskBtn.onclick = searchTask; +} function displaySuccessToast(message) { iziToast.success({ title: 'Success', @@ -70,19 +85,61 @@ function register() { } function login() { - /*** - * @todo Complete this function. - * @todo 1. Write code for form validation. - * @todo 2. Fetch the auth token from backend, login and direct user to home page. - */ + const username = document.getElementById('inputUsername').value.trim(); + const password = document.getElementById('inputPassword').value; + + if (username == '' || password == '') { + displayErrorToast("Please fill all the required fields."); + return; + } + displayInfoToast("Loading"); + const dataForApiRequest = { + username: username, + password: password + } + axios({ + url: API_BASE_URL + 'auth/login/', + method: 'POST', + data: dataForApiRequest, + }).then(function ({ data, status }) { + displaySuccessToast("Logged in successfully"); + localStorage.setItem('token', data.token); + window.location.href = '/'; + }).catch(function (err) { + displayErrorToast("Invalid credentials"); + document.getElementById('inputUsername').value = ''; + document.getElementById('inputPassword').value = ''; + }) } 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 enteredTask = document.getElementById('inputTask').value.trim(); + + if (enteredTask == '') { + displayErrorToast("Invalid Task Title : Empty"); + return; + } + + displayInfoToast("Adding Task"); + + const headersForApiRequest = { + Authorization: 'Token ' + localStorage.getItem('token') + } + + axios({ + headers: headersForApiRequest, + url: API_BASE_URL + 'todo/create/', + method: 'POST', + data: { + title: enteredTask, + }, + }).then(({ data, status }) => { + displaySuccessToast("Task added successfully"); + document.getElementById('inputTask').value = ''; + getTasks(); + }).catch((err) => { + displayErrorToast("Failed to add task"); + }) } function editTask(id) { @@ -93,17 +150,81 @@ 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. - */ + displayInfoToast("Deleting Task"); + + const headersForApiRequest = { + Authorization: 'Token ' + localStorage.getItem('token') + } + + axios({ + headers: headersForApiRequest, + url: API_BASE_URL + 'todo/' + id + '/', + method: 'DELETE', + }).then(function ({ data, status }) { + displaySuccessToast("Task deleted successfully"); + getTasks(); + }).catch(function (err) { + displayErrorToast("Failed to delete task.Try again later"); + }) } 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 newTask = document.getElementById("input-button-" + id).value.trim(); + const task = document.getElementById("task-" + id); + + if (newTask==""){ + displayErrorToast("Invalid Task Title : Empty"); + return; + } + + const dataForApiRequest = { + title: newTask + } + const headersForApiRequest = { + Authorization: 'Token ' + localStorage.getItem('token') + } + + axios({ + headers: headersForApiRequest, + url: API_BASE_URL + 'todo/' + id + '/', + method: 'PUT', + data: dataForApiRequest, + }).then(function ({ data, status }) { + task.textContent=data.title; + editTask(data.id); + displaySuccessToast("Task updated successfully"); + getTasks(); + }).catch(function (err) { + displayErrorToast("Failed to update task. Try again later"); + }) +} + +function searchTask(){ + const taskforSearch = document.getElementById('searchTask').value.trim(); + + if (taskforSearch == '') { + displayErrorToast("Invalid Task Title : Empty"); + return; + } + + displayInfoToast("Searching"); + + const headersForApiRequest = { + Authorization: 'Token ' + localStorage.getItem('token') + } + + axios({ + headers: headersForApiRequest, + url: API_BASE_URL + 'todo/', + method: 'GET', + }).then(function ({ data, status }) { + console.log(data); + for (var j = 0; j < data.length; j++) if (data[j].title == taskforSearch){ + taskList.innerHTML = ""; + displaySuccessToast("Task found"); + + return; + } + displayErrorToast("Specified task does not exist") + }) } From abb525e4c54d116cdad23d9e96b7dfea822e25d1 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 22:58:04 +0530 Subject: [PATCH 02/13] Completed getTasks function --- src/init.js | 45 ++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 42 insertions(+), 3 deletions(-) diff --git a/src/init.js b/src/init.js index 3a88d74..f96b39d 100644 --- a/src/init.js +++ b/src/init.js @@ -1,10 +1,49 @@ import axios from 'axios'; +import {updateTask, deleteTask, editTask} from './main'; +window.deleteTask = deleteTask; +window.updateTask = updateTask; +window.editTask = editTask; const API_BASE_URL = 'https://todo-app-csoc.herokuapp.com/'; function getTasks() { - /*** - * @todo Fetch the tasks created by the user and display them in the dom. - */ + const task = document.getElementById('tasks') + const headersForApiRequest = { + Authorization: 'Token ' + localStorage.getItem('token') + } + + axios({ + headers: headersForApiRequest, + url: API_BASE_URL + "todo/", + }) + .then(function({data, status}) { + document.getElementById('tasksList').innerHTML = ""; + for(let i=0; i + +
+ +
+
+ ${data[i].title} +
+ + + + + + ` + document.getElementById('tasksList').innerHTML += content; + } + }) + .catch((err) => { + displayErrorToast("Error!") + }); } axios({ From 24fed353509ae7d6535e57004d6273e6e2313e74 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 22:59:59 +0530 Subject: [PATCH 03/13] Added functionality --- src/auth_required.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/auth_required.js b/src/auth_required.js index 7f5e7bc..aa8566f 100644 --- a/src/auth_required.js +++ b/src/auth_required.js @@ -1,3 +1,6 @@ /*** * @todo Redirect the user to login page if token is not present. */ +if(localStorage.token == undefined) { + window.location.href = '/login/'; +} From eee012b5ddc57db4d3cfd457f1e9ffca527ebc11 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 23:00:50 +0530 Subject: [PATCH 04/13] Added functionality --- src/no_auth_required.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/no_auth_required.js b/src/no_auth_required.js index 82558d4..62c755a 100644 --- a/src/no_auth_required.js +++ b/src/no_auth_required.js @@ -1,3 +1,6 @@ /*** * @todo Redirect the user to main page if token is present. - */ \ No newline at end of file + */ +if (localStorage.token) { + window.location.href = '/'; +} From 64d58f5e1f41acab2d15d8f3b24843bac1ae9200 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 23:05:11 +0530 Subject: [PATCH 05/13] Added search task button --- style.css | 3 +++ 1 file changed, 3 insertions(+) diff --git a/style.css b/style.css index 2817a0d..2d14af2 100644 --- a/style.css +++ b/style.css @@ -11,6 +11,9 @@ margin-bottom:30px; max-width:400px; } +.todo-search-task { + max-width:400px; +} .todo-available-tasks-text { margin-left:30%; From 336138c682671d80e06cbb5a113c31dc332f29b6 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 23:14:34 +0530 Subject: [PATCH 06/13] Made necessary changes --- index.html | 62 +++++++++++------------------------------------------- 1 file changed, 12 insertions(+), 50 deletions(-) diff --git a/index.html b/index.html index ffda4cf..71c7b7b 100644 --- a/index.html +++ b/index.html @@ -45,7 +45,7 @@ data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Loading ...
- Logout + Logout
@@ -54,61 +54,23 @@
- +
- + +
+
+
+ +
+
From 30d521ad35d69cc64355ec6e98af7bec3a41619f Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 23:17:12 +0530 Subject: [PATCH 07/13] Made necessary changes --- login/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/login/index.html b/login/index.html index 305d461..52ff2a2 100644 --- a/login/index.html +++ b/login/index.html @@ -50,7 +50,7 @@ - + From bb92450aaa0c23322d04c0e7dc9ce947fe39ada3 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 23:19:48 +0530 Subject: [PATCH 08/13] Made necessary changes --- register/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/register/index.html b/register/index.html index 3a1f03d..2fbc7e4 100644 --- a/register/index.html +++ b/register/index.html @@ -64,7 +64,7 @@ - + From 0b3128b0e242cbb2d75f777aaea2479e681ce01b Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Tue, 21 Jun 2022 23:27:29 +0530 Subject: [PATCH 09/13] Update init.js --- src/init.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/init.js b/src/init.js index f96b39d..dced927 100644 --- a/src/init.js +++ b/src/init.js @@ -6,7 +6,7 @@ window.editTask = editTask; const API_BASE_URL = 'https://todo-app-csoc.herokuapp.com/'; function getTasks() { - const task = document.getElementById('tasks') + const headersForApiRequest = { Authorization: 'Token ' + localStorage.getItem('token') } From 034fd77571572b10ceb71a447dc285c5dc011e06 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Wed, 22 Jun 2022 00:27:52 +0530 Subject: [PATCH 10/13] Update init.js --- src/init.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/init.js b/src/init.js index dced927..969f17e 100644 --- a/src/init.js +++ b/src/init.js @@ -5,7 +5,7 @@ window.updateTask = updateTask; window.editTask = editTask; const API_BASE_URL = 'https://todo-app-csoc.herokuapp.com/'; -function getTasks() { +export function getTasks() { const headersForApiRequest = { Authorization: 'Token ' + localStorage.getItem('token') From affac17e5251826ffb585b090a5f8bc80d95aac3 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Wed, 22 Jun 2022 00:28:30 +0530 Subject: [PATCH 11/13] Update main.js --- src/main.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/main.js b/src/main.js index c2bca77..2c53540 100644 --- a/src/main.js +++ b/src/main.js @@ -142,14 +142,14 @@ function addTask() { }) } -function editTask(id) { +export function editTask(id) { document.getElementById('task-' + id).classList.add('hideme'); document.getElementById('task-actions-' + id).classList.add('hideme'); document.getElementById('input-button-' + id).classList.remove('hideme'); document.getElementById('done-button-' + id).classList.remove('hideme'); } -function deleteTask(id) { +export function deleteTask(id) { displayInfoToast("Deleting Task"); const headersForApiRequest = { @@ -168,7 +168,7 @@ function deleteTask(id) { }) } -function updateTask(id) { +export function updateTask(id) { const newTask = document.getElementById("input-button-" + id).value.trim(); const task = document.getElementById("task-" + id); From e9953787a31132f9f81cabd7cbb304e665b19814 Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Wed, 22 Jun 2022 00:36:42 +0530 Subject: [PATCH 12/13] Update main.js --- src/main.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/main.js b/src/main.js index 2c53540..49cc0a7 100644 --- a/src/main.js +++ b/src/main.js @@ -220,8 +220,9 @@ function searchTask(){ }).then(function ({ data, status }) { console.log(data); for (var j = 0; j < data.length; j++) if (data[j].title == taskforSearch){ - taskList.innerHTML = ""; displaySuccessToast("Task found"); + document.getElementById('tasksList').innerHTML = " "; + return; } From b1a173574a9ac25d7a4fda60d23402c91fc78fac Mon Sep 17 00:00:00 2001 From: Anoushka Jha <95405559+BabyElias@users.noreply.github.com> Date: Wed, 22 Jun 2022 00:38:49 +0530 Subject: [PATCH 13/13] Added searchTask --- src/main.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/main.js b/src/main.js index 49cc0a7..e9a41da 100644 --- a/src/main.js +++ b/src/main.js @@ -221,7 +221,7 @@ function searchTask(){ console.log(data); for (var j = 0; j < data.length; j++) if (data[j].title == taskforSearch){ displaySuccessToast("Task found"); - document.getElementById('tasksList').innerHTML = " "; + return;