From 2abf30cf3d1f007690ab3c17c3d2ecd453f1fb23 Mon Sep 17 00:00:00 2001
From: Simon Rettberg
Date: Tue, 27 Mar 2018 10:56:14 +0200
Subject: [adduser] add user: Check various input fields via js for immediate
 feedback

Refs #3344
---
 .../adduser/lang/de/template-tags.json             |  4 +++
 .../adduser/lang/en/template-tags.json             |  4 +++
 modules-available/adduser/style.css                |  4 +++
 .../adduser/templates/page-adduser.html            | 36 +++++++++++++++++++---
 4 files changed, 43 insertions(+), 5 deletions(-)

(limited to 'modules-available/adduser')

diff --git a/modules-available/adduser/lang/de/template-tags.json b/modules-available/adduser/lang/de/template-tags.json
index 31a7871e..e13c3876 100644
--- a/modules-available/adduser/lang/de/template-tags.json
+++ b/modules-available/adduser/lang/de/template-tags.json
@@ -10,8 +10,12 @@
     "lang_editUser": "Benutzer bearbeiten",
     "lang_email": "E-Mail",
     "lang_fullName": "Vollst\u00e4ndiger Name",
+    "lang_fullnameMissing": "Kein Name angegeben",
     "lang_login": "Login",
+    "lang_loginTooShort": "Login zu kurz",
     "lang_name": "Name",
+    "lang_passwordTooShort": "Passwort zu kurz",
+    "lang_passwordsDontMatch": "Passworte stimmen nicht \u00fcberein",
     "lang_phone": "Telefon",
     "lang_role": "Rolle",
     "lang_userDeleteConfirm": "M\u00f6chten Sie diesen Benutzer wirklich l\u00f6schen?",
diff --git a/modules-available/adduser/lang/en/template-tags.json b/modules-available/adduser/lang/en/template-tags.json
index 4fe03711..de57b385 100644
--- a/modules-available/adduser/lang/en/template-tags.json
+++ b/modules-available/adduser/lang/en/template-tags.json
@@ -10,8 +10,12 @@
     "lang_editUser": "Edit user",
     "lang_email": "Email",
     "lang_fullName": "Full Name",
+    "lang_fullnameMissing": "Full name missing",
     "lang_login": "Login",
+    "lang_loginTooShort": "Login too short",
     "lang_name": "Name",
+    "lang_passwordTooShort": "Password too short",
+    "lang_passwordsDontMatch": "Passwords don't match",
     "lang_phone": "Phone",
     "lang_role": "Role",
     "lang_userDeleteConfirm": "Do you want to delete this user?",
diff --git a/modules-available/adduser/style.css b/modules-available/adduser/style.css
index e459352b..15f04b80 100644
--- a/modules-available/adduser/style.css
+++ b/modules-available/adduser/style.css
@@ -13,3 +13,7 @@
     -moz-box-sizing: border-box;
     box-sizing: border-box;
 }
+
+#add-msg {
+    height: 1em;
+}
\ No newline at end of file
diff --git a/modules-available/adduser/templates/page-adduser.html b/modules-available/adduser/templates/page-adduser.html
index bd16dbbf..18d79a3b 100644
--- a/modules-available/adduser/templates/page-adduser.html
+++ b/modules-available/adduser/templates/page-adduser.html
@@ -3,18 +3,18 @@
 <h2>{{lang_createUser}}</h2>
 <div class="row">
 	<div class="col-md-4"><label for="login">{{lang_login}} *</label></div>
-	<div class="col-md-4"><input id="label" type="text" name="login" value="{{login}}" class="form-control" placeholder="{{lang_username}}" autofocus></div>
+	<div class="col-md-4"><input id="login" type="text" name="login" value="{{login}}" class="form-control event-box" placeholder="{{lang_username}}" autofocus></div>
 </div>
 <br>
 <div class="row">
 	<div class="col-md-4"><label for="pass1">{{lang_password}} *</label></div>
-	<div class="col-md-4"><input id="pass1" type="password" name="pass1" class="form-control" placeholder="{{lang_password}}"></div>
-	<div class="col-md-4"><input type="password" name="pass2" class="form-control" placeholder="{{lang_confirmation}}"></div>
+	<div class="col-md-4"><input id="pass1" type="password" name="pass1" class="form-control event-box" placeholder="{{lang_password}}"></div>
+	<div class="col-md-4"><input id="pass2" type="password" name="pass2" class="form-control event-box" placeholder="{{lang_confirmation}}"></div>
 </div>
 <br>
 <div class="row">
 	<div class="col-md-4"><label for="fullname">{{lang_fullName}} *</label></div>
-	<div class="col-md-4"><input id="fullname" type="text" name="fullname" value="{{fullname}}" class="form-control" placeholder="{{lang_fullName}}"></div>
+	<div class="col-md-4"><input id="fullname" type="text" name="fullname" value="{{fullname}}" class="form-control event-box" placeholder="{{lang_fullName}}"></div>
 </div>
 <br>
 <div class="row">
@@ -30,8 +30,34 @@
 <div class="row">
 	<div class="col-md-4"></div>
 	<div class="col-md-8">
-		<button class="btn btn-lg btn-primary btn-block" type="submit">{{lang_createUser}}</button>
+		<button id="add-btn" class="btn btn-lg btn-primary btn-block" type="submit" disabled>{{lang_createUser}}</button>
+		<div id="add-msg" class="text-danger slx-bold"></div>
 	</div>
 </div>
 <input type="hidden" name="action" value="adduser">
 <input type="hidden" name="token" value="{{token}}">
+<script><!--
+document.addEventListener('DOMContentLoaded', function() {
+	var $login = $('#login');
+	var $pass1 = $('#pass1');
+	var $pass2 = $('#pass2');
+	var $fullname = $('#fullname');
+	var $msg = $('#add-msg');
+	var $btn = $('#add-btn');
+	var ev = function() {
+		var msg = '';
+		if ($login.val().length < 2) {
+			msg = '{{lang_loginTooShort}}';
+		} else if ($pass1.val() !== $pass2.val()) {
+			msg = '{{lang_passwordsDontMatch}}';
+		} else if ($pass1.val().length < 2) {
+			msg = '{{lang_passwordTooShort}}';
+		} else if ($fullname.val().length < 1) {
+			msg = '{{lang_fullnameMissing}}';
+		}
+		$msg.text(msg);
+		$btn.prop('disabled', !!msg);
+	};
+	$('.event-box').change(ev).keyup(ev);
+});
+//--></script>
\ No newline at end of file
-- 
cgit v1.2.3-55-g7522