Issue #51

Added: visual password weakness meter
Bugfix: PasswordWeaknessCheck

plugins/change-password/index.php

@@ -194,7 +194,7 @@ class ChangePasswordPlugin extends \RainLoop\Plugins\AbstractPlugin
 
 	private static function PasswordWeaknessCheck(string $sPassword) : bool
 	{
-		return !!preg_match('/111|1234|password|abc|qwerty|monkey|letmein|dragon|baseball|iloveyou|trustno1|sunshine|master|welcome|shadow|ashley|football|jesus|michael|ninja|mustang|vkontakte/i', $sPassword);
+		return !\preg_match('/111|1234|password|abc|qwerty|monkey|letmein|dragon|baseball|iloveyou|trustno1|sunshine|master|welcome|shadow|ashley|football|jesus|michael|ninja|mustang|vkontakte/i', $sPassword);
 	}
 
 }

plugins/change-password/js/ChangePasswordUserSettings.js

@@ -6,6 +6,35 @@
 		return;
 	}
 
+	let pw_re = [/[^0-9A-Za-z]+/g, /[0-9]+/g, /[A-Z]+/g, /[a-z]+/g],
+		getPassStrength = v => {
+			var m,
+				i = v.length,
+				s = i?1:0,
+				c = 0,
+				ii = 0;
+			while (i--) {
+				if (v[i] != v[i+1]) {
+					++s;
+				} else {
+					s -= 0.5;
+				}
+			}
+			for (i = 0; i < 4; ++i) {
+				m = v.match(pw_re[i]);
+				if (m) {
+					++c;
+					for (; ii < m.length; ++ii) {
+						if (5 > m[ii].length) {
+							++s;
+						}
+					}
+				}
+			}
+			s = (s / 3 * c);
+			return Math.max(0, Math.min(100, s * 5));
+		};
+
 	class ChangePasswordUserSettings
 	{
 		constructor() {
@@ -68,6 +97,12 @@
 			current ? this.currentPasswordError(false) : this.passwordMismatch(false);
 		}
 
+		onBuild(dom) {
+			let input = dom.querySelector('.new-password'),
+				meter = dom.querySelector('.new-password-meter');
+			input && meter && input.addEventListener('input',() => meter.value = getPassStrength(input.value));
+		}
+
 		onHide() {
 			this.reset(false);
 			this.currentPassword('');

plugins/change-password/templates/SettingsChangePassword.html

@@ -13,9 +13,11 @@
 				<div class="control-group" data-bind="css: {'error': passwordMismatch}">
 					<label class="control-label" data-i18n="SETTINGS_CHANGE_PASSWORD/LABEL_NEW_PASSWORD"></label>
 					<div class="controls">
-						<input type="password" autocomplete="new-password" autocorrect="off" autocapitalize="off" spellcheck="false"
+						<input style="margin:0" class="new-password" type="password" autocomplete="new-password" autocorrect="off" autocapitalize="off" spellcheck="false"
 							minlength="10"
 							data-bind="textInput: newPassword" />
+						<br/>
+						<meter style="width:210px" class="new-password-meter" min="0" low="35" optimum="85" high="70" max="100" value="0"></meter>
 					</div>
 				</div>
 				<div class="control-group" data-bind="css: {'error': passwordMismatch}">