From bdeb1e70d98ddc89316b0912d9d5ee6d11d0bee5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cl=C3=A9ment=20OUDOT?= <clement@oodo.net>
Date: Wed, 16 Jun 2021 20:50:11 +0200
Subject: [PATCH] Allow to display password value in login form (#2454)

---
 .../lib/Lemonldap/NG/Portal/Main/Display.pm            |  1 +
 lemonldap-ng-portal/site/coffee/portal.coffee          | 10 +++++++++-
 .../site/htdocs/static/common/js/portal.js             | 10 ++++++++++
 .../site/templates/bootstrap/standardform.tpl          |  5 +++++
 lemonldap-ng-portal/site/templates/common/script.tpl   |  5 +++--
 5 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/lemonldap-ng-portal/lib/Lemonldap/NG/Portal/Main/Display.pm b/lemonldap-ng-portal/lib/Lemonldap/NG/Portal/Main/Display.pm
index 9a4b3cd72..6760fc3cd 100644
--- a/lemonldap-ng-portal/lib/Lemonldap/NG/Portal/Main/Display.pm
+++ b/lemonldap-ng-portal/lib/Lemonldap/NG/Portal/Main/Display.pm
@@ -396,6 +396,7 @@ sub display {
                 ? ( CUSTOM_SCRIPT => $req->data->{customScript} )
                 : ()
             ),
+            ENABLE_PASSWORD_DISPLAY => $self->conf->{portalEnablePasswordDisplay},
         );
 
         # Display captcha if it's enabled
diff --git a/lemonldap-ng-portal/site/coffee/portal.coffee b/lemonldap-ng-portal/site/coffee/portal.coffee
index af6f2c870..32bbbec9c 100644
--- a/lemonldap-ng-portal/site/coffee/portal.coffee
+++ b/lemonldap-ng-portal/site/coffee/portal.coffee
@@ -515,6 +515,14 @@ $(window).on 'load', () ->
 	if window.datas.ppolicy? and $('#newpassword').length
 		$('#reset').change togglecheckpassword
 
+	if datas['enablePasswordDisplay']
+		$(".toggle-password").mousedown (e) ->
+			$(this).toggleClass("fa-eye fa-eye-slash");
+			$("input[name=password]").attr("type", "text");
+		$(".toggle-password").mouseup (e) ->
+			$(this).toggleClass("fa-eye fa-eye-slash");
+			$("input[name=password]").attr("type", "password");
+
 	# Ping if asked
 	if datas['pingInterval'] and datas['pingInterval'] > 0
 		window.setTimeout ping, datas['pingInterval']
@@ -577,4 +585,4 @@ $(window).on 'load', () ->
 				console.log 'Error', err  if err
 				res = JSON.parse j.responseText if j
 				if res and res.error
-					console.log 'Returned error', res
\ No newline at end of file
+					console.log 'Returned error', res
diff --git a/lemonldap-ng-portal/site/htdocs/static/common/js/portal.js b/lemonldap-ng-portal/site/htdocs/static/common/js/portal.js
index b32b11d3c..d4237a225 100644
--- a/lemonldap-ng-portal/site/htdocs/static/common/js/portal.js
+++ b/lemonldap-ng-portal/site/htdocs/static/common/js/portal.js
@@ -561,6 +561,16 @@ LemonLDAP::NG Portal jQuery scripts
     if ((window.datas.ppolicy != null) && $('#newpassword').length) {
       $('#reset').change(togglecheckpassword);
     }
+    if (datas['enablePasswordDisplay']) {
+      $(".toggle-password").mousedown(function(e) {
+        $(this).toggleClass("fa-eye fa-eye-slash");
+        return $("input[name=password]").attr("type", "text");
+      });
+      $(".toggle-password").mouseup(function(e) {
+        $(this).toggleClass("fa-eye fa-eye-slash");
+        return $("input[name=password]").attr("type", "password");
+      });
+    }
     if (datas['pingInterval'] && datas['pingInterval'] > 0) {
       window.setTimeout(ping, datas['pingInterval']);
     }
diff --git a/lemonldap-ng-portal/site/templates/bootstrap/standardform.tpl b/lemonldap-ng-portal/site/templates/bootstrap/standardform.tpl
index 887bb6338..904007808 100644
--- a/lemonldap-ng-portal/site/templates/bootstrap/standardform.tpl
+++ b/lemonldap-ng-portal/site/templates/bootstrap/standardform.tpl
@@ -20,6 +20,11 @@
       <input id="passwordfield" name="password" type="text" class="form-control key" autocomplete="off" required aria-required="true" aria-hidden="true"/>
     <TMPL_ELSE>
       <input id="passwordfield" name="password" type="password" class="form-control" trplaceholder="password" required aria-required="true"/>
+      <TMPL_IF NAME="ENABLE_PASSWORD_DISPLAY">
+      <div class="input-group-append">
+        <span class="input-group-text"><i class="fa fa-eye-slash toggle-password"></i></span>
+      </div>
+      </TMPL_IF>
     </TMPL_IF>
   </div>
 
diff --git a/lemonldap-ng-portal/site/templates/common/script.tpl b/lemonldap-ng-portal/site/templates/common/script.tpl
index 9b6dfd9c6..19f678a24 100644
--- a/lemonldap-ng-portal/site/templates/common/script.tpl
+++ b/lemonldap-ng-portal/site/templates/common/script.tpl
@@ -26,7 +26,7 @@
  "scriptname":"<TMPL_VAR NAME="SCRIPT_NAME">",
  "activeTimer":<TMPL_VAR NAME="ACTIVE_TIMER" DEFAULT="0">,
  "pingInterval":<TMPL_VAR NAME="PING" DEFAULT="0">,
- "trOver":<TMPL_VAR NAME="TROVER" DEFAULT="[]"><TMPL_IF NAME="DISPLAY_PPOLICY">,
+ "trOver":<TMPL_VAR NAME="TROVER" DEFAULT="[]">,<TMPL_IF NAME="DISPLAY_PPOLICY">
  "ppolicy": {
             "display": "<TMPL_VAR NAME="DISPLAY_PPOLICY" DEFAULT="0">",
             "minsize": "<TMPL_VAR NAME="PPOLICY_MINSIZE" DEFAULT="0">",
@@ -36,7 +36,8 @@
             "nopolicy": "<TMPL_VAR NAME="PPOLICY_NOPOLICY" DEFAULT="0">",
             "allowedspechar": "<TMPL_VAR NAME="PPOLICY_ALLOWEDSPECHAR" ESCAPE="js" DEFAULT="">",
             "minspechar": "<TMPL_VAR NAME="PPOLICY_MINSPECHAR" DEFAULT="0">"
-            }</TMPL_IF>
+            },</TMPL_IF>
+ "enablePasswordDisplay":<TMPL_VAR NAME="ENABLE_PASSWORD_DISPLAY" DEFAULT="0">
  }
  </script>