From 7827816a3de71fe64fde2f23b16b9a652f28139e Mon Sep 17 00:00:00 2001 From: rajvaibhavdubey <17dec004@lnmiit.ac.in> Date: Fri, 2 Nov 2018 01:27:08 +0530 Subject: [PATCH] Added Show/Hide password in signup page Adds show/hide password button on signup page. Fixes #445 --- src/css/signup.css | 19 ++++++++++++++++++- src/js/signup.js | 22 ++++++++++++++++++++++ src/signup.html | 23 +++++++++++++++++++---- 3 files changed, 59 insertions(+), 5 deletions(-) diff --git a/src/css/signup.css b/src/css/signup.css index ef167fc..83fd6a3 100644 --- a/src/css/signup.css +++ b/src/css/signup.css @@ -47,4 +47,21 @@ label { #passwordlim{ color: white; -} \ No newline at end of file +} +.field-icon{ + float: right; + font-size:24px; + display: flex; + align-items: center; +} +.fa-eye, .fa-eye-slash{ + position: absolute; + top: 6px; + right: 5px; + z-index: 15; + display: block; + width: 34px; + height: 34px; + line-height: 34px; + text-align: center; +} diff --git a/src/js/signup.js b/src/js/signup.js index d242436..6df6831 100644 --- a/src/js/signup.js +++ b/src/js/signup.js @@ -5,6 +5,8 @@ var signupBlock = document.getElementById("signedup"); var BASE_URL = "https://api.susi.ai"; var passwordlim = document.getElementById("passwordlim"); var password = document.getElementById("password"); +var toggle = document.getElementById("toggle"); +var cptoggle = document.getElementById("cptoggle"); window.onload = () => { showsignupBlock(true); @@ -21,6 +23,26 @@ let showsignupBlock = (show) => { } }; +toggle.addEventListener("click", ()=>{ + toggle.classList.toggle("fa-eye"); + toggle.classList.toggle("fa-eye-slash"); + if (toggle.classList.contains("fa-eye-slash")) { + document.getElementById("password").type = "password"; + } else { + document.getElementById("password").type = "text"; + } +}); + +cptoggle.addEventListener("click", ()=>{ + cptoggle.classList.toggle("fa-eye"); + cptoggle.classList.toggle("fa-eye-slash"); + if (cptoggle.classList.contains("fa-eye-slash")) { + document.getElementById("cpassword").type = "password"; + } else { + document.getElementById("cpassword").type = "text"; + } +}); + password.addEventListener("keyup", ()=>{ if(password.value.length<6){ passwordlim.removeAttribute("hidden"); diff --git a/src/signup.html b/src/signup.html index d902484..8dd1cf2 100644 --- a/src/signup.html +++ b/src/signup.html @@ -1,10 +1,14 @@ +