From d79437d2a2fc666fb4c114c4af56ff54e506706c Mon Sep 17 00:00:00 2001
From: Daniel Steglich <steglich@datasystems24.de>
Date: Thu, 13 Aug 2015 20:58:35 +0200
Subject: [PATCH] show / hide password box

Added a selectbox to change the input box type from password to text.
---
 plinth/modules/networks/forms.py                   |  5 ++++-
 .../networks/templates/connections_create.html     | 14 ++++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/plinth/modules/networks/forms.py b/plinth/modules/networks/forms.py
index 32166bfeb..7ff371c0c 100644
--- a/plinth/modules/networks/forms.py
+++ b/plinth/modules/networks/forms.py
@@ -87,7 +87,10 @@ class AddPPPoEForm(forms.Form):
 available over this interfaces. Select Internal only for trusted networks.'),
         choices=[('external', 'External'), ('internal', 'Internal')])
     username = forms.CharField(label=_('Username'))
-    password = forms.CharField(label=_('Password'))
+    password = forms.CharField(label=_('Password'),
+                               widget=forms.PasswordInput())
+    showpw = forms.BooleanField(label=_('show password'),
+                                required=False)
 
     def __init__(self, *args, **kwargs):
         """Initialize the form, populate interface choices."""
diff --git a/plinth/modules/networks/templates/connections_create.html b/plinth/modules/networks/templates/connections_create.html
index a42f162c8..c28737d7a 100644
--- a/plinth/modules/networks/templates/connections_create.html
+++ b/plinth/modules/networks/templates/connections_create.html
@@ -58,6 +58,20 @@
       }
     });
 
+    $('#id_showpw').change(function() {
+        //changing type attribute from password to text is prevented by
+        //most browsers make a new form field works for me
+        if ($('#id_showpw').prop('checked')) {
+          $('#id_password').replaceWith(
+            $('#id_password').clone().attr(
+            'type', 'text'));
+        } else {
+          $('#id_password').replaceWith(
+            $('#id_password').clone().attr(
+            'type', 'password'));
+        }
+      });
+
     })(jQuery);
   </script>