beautify pwchange

templates/clientarea.tpl

@@ -456,10 +456,14 @@
                 <span class="form-control-feedback glyphicon"></span>
                 {include file="$template/includes/thurpwcheck.tpl"}
               </div>
-              <div class="form-group">
-                <button type="button" class="btn btn-default generate-password" data-targetfields="inputNewPassword1,inputNewPassword2">
-                  {$LANG.generatePassword.btnLabel}
-                </button>
+              <div class="alert alert-info">
+                  <div id='hints2'>
+                      <strong id='hint2Head'></strong>
+                      <div id='hintLength'></div>
+                      <div id='hintNumeric'></div>
+                      <div id='hintSymbols'></div>
+                      <div id='hintUpperLower'></div>
+                  </div>
               </div>
               <div id="newPassword2" class="form-group has-feedback">
                 <label for="inputNewPassword2" class="control-label">{$LANG.confirmnewpassword}</label>

templates/thurpwcheck.tpl

@@ -1,34 +1,82 @@
 {literal}
 <script>
 jQuery(document).ready(function(){
-    jQuery("#password").keyup(function () {
-        var pw = jQuery("#password").val();
-        var pwlength=(pw.length);
-        if(pwlength>5)pwlength=5;
-        var numnumeric=pw.replace(/[0-9]/g,"");
-        var numeric=(pw.length-numnumeric.length);
-        if(numeric>3)numeric=3;
-        var symbols=pw.replace(/\W/g,"");
-        var numsymbols=(pw.length-symbols.length);
-        if(numsymbols>3)numsymbols=3;
-        var numupper=pw.replace(/[A-Z]/g,"");
-        var upper=(pw.length-numupper.length);
-        if(upper>3)upper=3;
-        var pwstrength=((pwlength*10)-20)+(numeric*10)+(numsymbols*15)+(upper*10);
-        if(pwstrength<0){pwstrength=0}
-        if(pwstrength>100){pwstrength=100}
-        jQuery("#pwstrengthbox").removeClass("weak moderate strong");
-        jQuery("#pwstrengthbox").html("{/literal}{$LANG.pwstrengthstrong}{literal}");
-        jQuery("#pwstrengthbox").addClass("strong");
-        if (pwstrength<75) {
-            jQuery("#pwstrengthbox").html("{/literal}{$LANG.pwstrengthmoderate}{literal}");
-            jQuery("#pwstrengthbox").addClass("moderate");
-        }
-        if (pwstrength<30) {
-            jQuery("#pwstrengthbox").html("{/literal}{$LANG.pwstrengthweak}{literal}");
-            jQuery("#pwstrengthbox").addClass("weak");
-        }
-    });
+        $(inputNewPassword1).focus (function () {
+            $("#hintHead").text('Tipps für ein gutes Passwort');
+            $("#hintLength").text('Benutzen Sie mindestens 8 Zeichen');
+            $("#hintNumeric").text('Benutzen Sie mindestens eine Zahl');
+            $("#hintSymbols").text('Benutzen Sie auch mindestens eines der folgenden Symbole (# $ ! % + - etc...)');
+            $("#hintUpperLower").text('Benutzen Sie Groß- und Kleinschreibung');
+        });
+        $(inputNewPassword1.keyup(function () {
+            var pwlengthOK = false;
+            var numericOK = false;
+            var symbolsOK = false;
+            var upperOK = false;
+            var pw = $(inputNewPassword1.val();
+            var pwlength = (pw.length);
+            if (pwlength > 7) {
+                pwlengthOK = true;
+                $("#hintLength").text('');
+            } else {
+                pwlengthOK = false;
+                $("#hintLength").text('Benutzen Sie mindestens 8 Zeichen');
+            }
+            var numeric = pw.replace(/[0-9]/g, "");
+            var numnumeric = (pw.length - numeric.length);
+            if (numnumeric > 0) {
+                numericOK = true;
+                $("#hintNumeric").text('');
+            } else {
+                numericOK = false;
+                $("#hintNumeric").text('Benutzen Sie mindestens eine Zahl');
+            }
+            var symbols = pw.replace(/\W/g, "");
+            var numsymbols = (pw.length - symbols.length);
+            if (numsymbols > 0) {
+                symbolsOK = true;
+                $("#hintSymbols").text('');
+            } else {
+                symbolsOK = false;
+                $("#hintSymbols").text('Benutzen Sie auch mindestens ein Symbol oder Sonderzeichen (# $ ! % & + - etc...)');
+            }
+            var upper = pw.replace(/[A-Z]/g, "");
+            var numupper = (pw.length - upper.length);
+            var lower = pw.replace(/[a-z]/g, "");
+            var numlower = (pw.length - lower.length);
+            if ((numupper > 0) && (numlower > 0)) {
+                upperlowerOK = true;
+                $("#hintUpperLower").text('');
+            } else {
+                upperlowerOK = false;
+                $("#hintUpperLower").text('Benutzen Sie Groß- und Kleinschreibung');
+            }
+            $(inputNewPassword1).removeClass('has-error has-warning has-success');
+            if (pwlengthOK && numericOK && symbolsOK && upperlowerOK) {
+                $(newPassword2).prop("disabled",false);
+                $(inputNewPassword1).addClass('has-success');
+                $(inputNewPassword1).css('background-color', '#0f03');;
+                $("#hintHead").text('');
+            } else {
+                $(newPassword2).prop("disabled",true);
+                $(inputNewPassword1).addClass('has-error');
+                $(inputNewPassword1).css('background-color', '#f003');;
+                $("#hintHead").text('Tipps für ein gutes Passwort');
+            }
+        });
+        $(newPassword2).keyup(function () {
+            if ($(newPassword2).val() == $(newPassword1).val()) {
+                $("#btnCompleteProductConfig").prop("disabled",false);
+                $(newPassword2).addClass('has-success');
+                $(newPassword2).css('background-color', '#0f03');;
+                $("#hintHead").text('');
+            } else {
+                $("#btnCompleteProductConfig").prop("disabled",true);
+                $(newPassword2).addClass('has-error');
+                $(newPassword2).css('background-color', '#f003');;
+                $("#hintHead").text('Passworte stimmen nicht überein!');
+            }
+        });
 });
 </script>
 {/literal}