diff --git a/index.html b/index.html index ffda4cf..3d6d258 100644 --- a/index.html +++ b/index.html @@ -45,7 +45,7 @@ data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Loading ...
- Logout + Logout
@@ -54,65 +54,18 @@
- +
-
+ diff --git a/login/index.html b/login/index.html index 305d461..186c537 100644 --- a/login/index.html +++ b/login/index.html @@ -50,8 +50,8 @@ - + - + \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 58aab2e..ce8e85a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3,191 +3,13 @@ "version": "1.0.0", "lockfileVersion": 1, "requires": true, - "packages": { - "": { - "version": "1.0.0", - "license": "ISC", - "dependencies": { - "axios": "^0.21.1", - "vite": "^2.3.7" - } - }, - "node_modules/axios": { - "version": "0.21.1", - "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz", - "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==", - "dependencies": { - "follow-redirects": "^1.10.0" - } - }, - "node_modules/colorette": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/colorette/-/colorette-1.2.2.tgz", - "integrity": "sha512-MKGMzyfeuutC/ZJ1cba9NqcNpfeqMUcYmyF1ZFY6/Cn7CNSAKx6a+s48sqLqyAiZuaP2TcqMhoo+dlwFnVxT9w==" - }, - "node_modules/esbuild": { - "version": "0.12.8", - "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.12.8.tgz", - "integrity": "sha512-sx/LwlP/SWTGsd9G4RlOPrXnIihAJ2xwBUmzoqe2nWwbXORMQWtAGNJNYLBJJqa3e9PWvVzxdrtyFZJcr7D87g==", - "hasInstallScript": true, - "bin": { - "esbuild": "bin/esbuild" - } - }, - "node_modules/follow-redirects": { - "version": "1.14.1", - "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz", - "integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==", - "funding": [ - { - "type": "individual", - "url": "https://github.com/sponsors/RubenVerborgh" - } - ], - "engines": { - "node": ">=4.0" - }, - "peerDependenciesMeta": { - "debug": { - "optional": true - } - } - }, - "node_modules/fsevents": { - "version": "2.3.2", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", - "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", - "hasInstallScript": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": "^8.16.0 || ^10.6.0 || >=11.0.0" - } - }, - "node_modules/function-bind": { - "version": "1.1.1", - "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.1.tgz", - "integrity": "sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==" - }, - "node_modules/has": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", - "integrity": "sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==", - "dependencies": { - "function-bind": "^1.1.1" - }, - "engines": { - "node": ">= 0.4.0" - } - }, - "node_modules/is-core-module": { - "version": "2.4.0", - "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.4.0.tgz", - "integrity": "sha512-6A2fkfq1rfeQZjxrZJGerpLCTHRNEBiSgnu0+obeJpEPZRUooHgsizvzv0ZjJwOz3iWIHdJtVWJ/tmPr3D21/A==", - "dependencies": { - "has": "^1.0.3" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/nanoid": { - "version": "3.1.23", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz", - "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==", - "bin": { - "nanoid": "bin/nanoid.cjs" - }, - "engines": { - "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" - } - }, - "node_modules/path-parse": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", - "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==" - }, - "node_modules/postcss": { - "version": "8.3.4", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.4.tgz", - "integrity": "sha512-/tZY0PXExXXnNhKv3TOvZAOUYRyuqcCbBm2c17YMDK0PlVII3K7/LKdt3ScHL+hhouddjUWi+1sKDf9xXW+8YA==", - "dependencies": { - "colorette": "^1.2.2", - "nanoid": "^3.1.23", - "source-map-js": "^0.6.2" - }, - "engines": { - "node": "^10 || ^12 || >=14" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" - } - }, - "node_modules/resolve": { - "version": "1.20.0", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.20.0.tgz", - "integrity": "sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==", - "dependencies": { - "is-core-module": "^2.2.0", - "path-parse": "^1.0.6" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, - "node_modules/rollup": { - "version": "2.51.2", - "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.51.2.tgz", - "integrity": "sha512-ReV2eGEadA7hmXSzjxdDKs10neqH2QURf2RxJ6ayAlq93ugy6qIvXMmbc5cWMGCDh1h5T4thuWO1e2VNbMq8FA==", - "bin": { - "rollup": "dist/bin/rollup" - }, - "engines": { - "node": ">=10.0.0" - }, - "optionalDependencies": { - "fsevents": "~2.3.1" - } - }, - "node_modules/source-map-js": { - "version": "0.6.2", - "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-0.6.2.tgz", - "integrity": "sha512-/3GptzWzu0+0MBQFrDKzw/DvvMTUORvgY6k6jd/VS6iCR4RDTKWH6v6WPwQoUO8667uQEf9Oe38DxAYWY5F/Ug==", - "engines": { - "node": ">=0.10.0" - } - }, - "node_modules/vite": { - "version": "2.3.7", - "resolved": "https://registry.npmjs.org/vite/-/vite-2.3.7.tgz", - "integrity": "sha512-Y0xRz11MPYu/EAvzN94+FsOZHbSvO6FUvHv127CyG7mV6oDoay2bw+g5y9wW3Blf8OY3chaz3nc/DcRe1IQ3Nw==", - "dependencies": { - "esbuild": "^0.12.5", - "postcss": "^8.3.0", - "resolve": "^1.19.0", - "rollup": "^2.38.5" - }, - "bin": { - "vite": "bin/vite.js" - }, - "engines": { - "node": ">=12.0.0" - }, - "optionalDependencies": { - "fsevents": "~2.3.1" - } - } - }, "dependencies": { "axios": { - "version": "0.21.1", - "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz", - "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==", + "version": "0.21.4", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.4.tgz", + "integrity": "sha512-ut5vewkiu8jjGBdqpM44XxjuCjq9LAKeHVmoVfHVzy8eHgxxq8SbAVQNovDA8mVi05kP0Ea/n/UzcSHcTJQfNg==", "requires": { - "follow-redirects": "^1.10.0" + "follow-redirects": "^1.14.0" } }, "colorette": { @@ -201,9 +23,9 @@ "integrity": "sha512-sx/LwlP/SWTGsd9G4RlOPrXnIihAJ2xwBUmzoqe2nWwbXORMQWtAGNJNYLBJJqa3e9PWvVzxdrtyFZJcr7D87g==" }, "follow-redirects": { - "version": "1.14.1", - "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz", - "integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==" + "version": "1.15.1", + "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.1.tgz", + "integrity": "sha512-yLAMQs+k0b2m7cVxpS1VKJVvoz7SS9Td1zss3XRwXj+ZDH00RJgnuLx7E44wx02kQLrdM3aOOy+FpzS7+8OizA==" }, "fsevents": { "version": "2.3.2", @@ -233,9 +55,9 @@ } }, "nanoid": { - "version": "3.1.23", - "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.1.23.tgz", - "integrity": "sha512-FiB0kzdP0FFVGDKlRLEQ1BgDzU87dy5NnzjeW9YZNt+/c3+q82EQDUwniSAUxp/F0gFNI1ZhKU1FqYsMuqZVnw==" + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", + "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" }, "path-parse": { "version": "1.0.7", diff --git a/package.json b/package.json index 1f8de65..2f0a6a3 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ }, "homepage": "https://github.com/COPS-CSOC-2022/csoc-task-2-web#readme", "dependencies": { - "axios": "^0.21.1", + "axios": "^0.21.4", "vite": "^2.3.7" } } diff --git a/register/index.html b/register/index.html index 3a1f03d..4df4255 100644 --- a/register/index.html +++ b/register/index.html @@ -64,7 +64,7 @@ - + diff --git a/src/auth_required.js b/src/auth_required.js index 7f5e7bc..f1092de 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.getItem("token")==null){ + window.location.href = "/login/"; +} diff --git a/src/init.js b/src/init.js index 3a88d74..b2e8ff8 100644 --- a/src/init.js +++ b/src/init.js @@ -1,20 +1,59 @@ import axios from 'axios'; const API_BASE_URL = 'https://todo-app-csoc.herokuapp.com/'; -function getTasks() { +export function getTasks() { /*** * @todo Fetch the tasks created by the user and display them in the dom. - */ -} + */ + axios({ + headers: { + Authorization: 'Token ' + localStorage.getItem('token'), + }, + url: API_BASE_URL + 'todo/', + method: 'get', + }) + .then(function({data, status}){ + const list = document.getElementById('tasks_Available'); + list.innerHTML=""; + for(var i=0; i + +
+ +
+
+ ${curr_ele.title} +
+ + + + + `; + } + }) + .catch(function(err){ + displayErrorToast("Please Try Again!!") + }) +} + axios({ + headers: { + Authorization: 'Token ' + localStorage.getItem('token'), + }, + url: API_BASE_URL + 'auth/profile/', + method: 'get', + }) + .then(function({data, status}) { + document.getElementById('avatar-image').src = 'https://ui-avatars.com/api/?name=' + data.name + '&background=fff&size=33&color=007bff'; + document.getElementById('profile-name').innerHTML = data.name; + getTasks(); + }) diff --git a/src/main.js b/src/main.js index 05849df..0ebf850 100644 --- a/src/main.js +++ b/src/main.js @@ -26,6 +26,7 @@ function logout() { localStorage.removeItem('token'); window.location.href = '/login/'; } +window.logout = logout; function registerFieldsAreValid(firstName, lastName, email, username, password) { if (firstName === '' || lastName === '' || email === '' || username === '' || password === '') { @@ -46,7 +47,7 @@ function register() { const username = document.getElementById('inputUsername').value.trim(); const password = document.getElementById('inputPassword').value; - if (registerFieldsAreValid(firstName, lastName, email, username, password)) { + if (registerFieldsAreValid(firstName, lastName, email, username, password)) { displayInfoToast("Please wait..."); const dataForApiRequest = { @@ -60,14 +61,26 @@ function register() { url: API_BASE_URL + 'auth/register/', method: 'post', data: dataForApiRequest, - }).then(function({data, status}) { + }) + .then(function({data, status}) { localStorage.setItem('token', data.token); window.location.href = '/'; - }).catch(function(err) { + } + ).catch(function(err) { displayErrorToast('An account using same email or username is already created'); }) } } +window.register = register; + +function loginFieldsAreValid(username,password) +{ + if(username === "" || password === ""){ + displayErrorToast("Please fill all the fields!!") + return false; + } + return true; +} function login() { /*** @@ -75,15 +88,62 @@ function login() { * @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; + const password = document.getElementById('inputPassword').value; + + if(loginFieldsAreValid(username, password)){ + displayInfoToast("Please wait!!"); + const dataForApiRequest = { + username: username, + password: password + }; + axios({ + url: API_BASE_URL + 'auth/login/', + method: 'post', + data: dataForApiRequest + }) + .then(function({data, status}){ + localStorage.setItem('token', data.token); + window.location.href='/'; + displaySuccessToast("LOGIN SUCCESSFULLY!! WELCOME TO TODO WEB APP") + }) + .catch(function (err) { + displayErrorToast("TRY AGAIN! Invalid username or password"); + }); + } } +window.login = login; -function addTask() { +function addTask(id) { /** * @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.getElementById('addTask').value.trim(); + const dataForApiRequest = { + title: task, + }; + axios({ + headers: { + Authorization: 'Token' + localStorage.getItem('token') + }, + url: API_BASE_URL + "todo/create/", + method: "post", + data: dataForApiRequest, + }) + .then(function({data, status}){ + document.getElementById("addTask").value = ""; + getTasks(); + displaySuccessToast("Task ADDED"); + }) + .catch(function(err){ + displayErrorToast("Try Again!!"); + }); + document.getElementById('task_enter').value=''; } +window.addTask = addTask; function editTask(id) { document.getElementById('task-' + id).classList.add('hideme'); @@ -91,6 +151,7 @@ function editTask(id) { document.getElementById('input-button-' + id).classList.remove('hideme'); document.getElementById('done-button-' + id).classList.remove('hideme'); } +window.editTask = editTask; function deleteTask(id) { /** @@ -98,7 +159,23 @@ function deleteTask(id) { * @todo 1. Send the request to delete the task to the backend server. * @todo 2. Remove the task from the dom. */ + axios({ + headers:{ + Authorization: 'Token' + localStorage.getItem('token'), + }, + url: API_BASE_URL + 'todo/' + id + '/', + method: 'delete' + }) + .then(function ({data, status}){ + const listItem = document.getElementById("taskItem " + id); + listItem.parentElement.removeChild(listItem); + displayInfoToast("Selected item is deleted successfully"); + }) + .catch(function (err){ + displayErrorToast("Selected item is not deleted. Please Try Again!"); + }); } +window.deleteTask = deleteTask; function updateTask(id) { /** @@ -106,4 +183,26 @@ function updateTask(id) { * @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("edit_task" + id).value; + const dataForApiRequest = { + title: update, + } + axios({ + headers:{ + Authorization: 'Token' + localStorage.getItem('token'), + }, + url: API_BASE_URL + 'todo/' + id + '/', + method: 'patch', + data: dataForApiRequest, + }) + .then(function({data, status}){ + taskItem.textContent=data.title; + editTask(data.id); + displaySuccessToast("Task UPDATED"); + getTasks(); + }) + .catch(function(err){ + displayErrorToast("Task not UPDATED... Please Try Again!! "); + }); } +window.updateTask = updateTask; diff --git a/src/no_auth_required.js b/src/no_auth_required.js index 82558d4..212d654 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.getItem('token')){ + window.location.href = "/"; +}