From 25195fffe229eef84b4623a4a1a918a93d8085af Mon Sep 17 00:00:00 2001
From: Tobias Hagemann <tobias@hagemann.org>
Date: Fri, 7 Aug 2020 17:47:49 +0200
Subject: [PATCH] added icon to password strength label in new password
 controller

---
 .../ui/common/NewPasswordController.java      | 21 ++++++++++++++++---
 main/ui/src/main/resources/css/dark_theme.css |  4 ++++
 .../ui/src/main/resources/css/light_theme.css |  4 ++++
 .../src/main/resources/fxml/new_password.fxml |  7 ++++---
 4 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/main/ui/src/main/java/org/cryptomator/ui/common/NewPasswordController.java b/main/ui/src/main/java/org/cryptomator/ui/common/NewPasswordController.java
index 2d0c424eb..24f3ac8db 100644
--- a/main/ui/src/main/java/org/cryptomator/ui/common/NewPasswordController.java
+++ b/main/ui/src/main/java/org/cryptomator/ui/common/NewPasswordController.java
@@ -26,6 +26,7 @@ public class NewPasswordController implements FxController {
 	public Label passwordStrengthLabel;
 	public Label passwordMatchLabel;
 	public FontAwesome5IconView checkmark;
+	public FontAwesome5IconView warning;
 	public FontAwesome5IconView cross;
 
 	public NewPasswordController(ResourceBundle resourceBundle, PasswordStrengthUtil strengthRater, ObjectProperty<CharSequence> password) {
@@ -36,11 +37,13 @@ public class NewPasswordController implements FxController {
 
 	@FXML
 	public void initialize() {
+		passwordStrength.bind(Bindings.createIntegerBinding(() -> strengthRater.computeRate(passwordField.getCharacters()), passwordField.textProperty()));
+
+		passwordStrengthLabel.graphicProperty().bind(Bindings.createObjectBinding(this::getIconViewForPasswordStrengthLabel, passwordField.textProperty(), passwordStrength));
+		passwordStrengthLabel.textProperty().bind(EasyBind.map(passwordStrength, strengthRater::getStrengthDescription));
+
 		BooleanBinding passwordsMatch = Bindings.createBooleanBinding(this::hasSamePasswordInBothFields, passwordField.textProperty(), reenterField.textProperty());
 		BooleanBinding reenterFieldNotEmpty = reenterField.textProperty().isNotEmpty();
-		passwordStrength.bind(Bindings.createIntegerBinding(() -> strengthRater.computeRate(passwordField.getCharacters()), passwordField.textProperty()));
-		passwordStrengthLabel.textProperty().bind(EasyBind.map(passwordStrength, strengthRater::getStrengthDescription));
-		
 		passwordMatchLabel.visibleProperty().bind(reenterFieldNotEmpty);
 		passwordMatchLabel.graphicProperty().bind(Bindings.when(passwordsMatch.and(reenterFieldNotEmpty)).then(checkmark).otherwise(cross));
 		passwordMatchLabel.textProperty().bind(Bindings.when(passwordsMatch.and(reenterFieldNotEmpty)).then(resourceBundle.getString("newPassword.passwordsMatch")).otherwise(resourceBundle.getString("newPassword.passwordsDoNotMatch")));
@@ -49,6 +52,18 @@ public class NewPasswordController implements FxController {
 		reenterField.textProperty().addListener(this::passwordsDidChange);
 	}
 
+	private FontAwesome5IconView getIconViewForPasswordStrengthLabel() {
+		if (passwordField.getCharacters().length() == 0) {
+			return null;
+		} else if (passwordStrength.intValue() <= -1) {
+			return cross;
+		} else if (passwordStrength.intValue() < 3) {
+			return warning;
+		} else {
+			return checkmark;
+		}
+	}
+
 	private void passwordsDidChange(@SuppressWarnings("unused") Observable observable) {
 		if (hasSamePasswordInBothFields() && strengthRater.fulfillsMinimumRequirements(passwordField.getCharacters())) {
 			password.set(passwordField.getCharacters());
diff --git a/main/ui/src/main/resources/css/dark_theme.css b/main/ui/src/main/resources/css/dark_theme.css
index 6f8022beb..b6ab94b9b 100644
--- a/main/ui/src/main/resources/css/dark_theme.css
+++ b/main/ui/src/main/resources/css/dark_theme.css
@@ -143,6 +143,10 @@
 	-fx-fill: RED_5;
 }
 
+.glyph-icon-orange {
+	-fx-fill: ORANGE_5;
+}
+
 /*******************************************************************************
  *                                                                             *
  * Main Window                                                                 *
diff --git a/main/ui/src/main/resources/css/light_theme.css b/main/ui/src/main/resources/css/light_theme.css
index 42f93bfbf..b650b6e17 100644
--- a/main/ui/src/main/resources/css/light_theme.css
+++ b/main/ui/src/main/resources/css/light_theme.css
@@ -143,6 +143,10 @@
 	-fx-fill: RED_5;
 }
 
+.glyph-icon-orange {
+	-fx-fill: ORANGE_5;
+}
+
 /*******************************************************************************
  *                                                                             *
  * Main Window                                                                 *
diff --git a/main/ui/src/main/resources/fxml/new_password.fxml b/main/ui/src/main/resources/fxml/new_password.fxml
index b13da1245..7593a1ccd 100644
--- a/main/ui/src/main/resources/fxml/new_password.fxml
+++ b/main/ui/src/main/resources/fxml/new_password.fxml
@@ -13,18 +13,19 @@
 	  alignment="CENTER_LEFT">
 	<fx:define>
 		<FontAwesome5IconView fx:id="checkmark" styleClass="glyph-icon-primary" glyph="CHECK"/>
+		<FontAwesome5IconView fx:id="warning" styleClass="glyph-icon-orange" glyph="EXCLAMATION_TRIANGLE"/>
 		<FontAwesome5IconView fx:id="cross" styleClass="glyph-icon-red" glyph="TIMES"/>
 	</fx:define>
 	<children>
 		<Label text="%newPassword.promptText" labelFor="$passwordField"/>
 		<NiceSecurePasswordField fx:id="passwordField"/>
 		<PasswordStrengthIndicator spacing="6" prefHeight="6" strength="${controller.passwordStrength}"/>
-		<Label fx:id="passwordStrengthLabel" styleClass="label-muted" alignment="CENTER_RIGHT" maxWidth="Infinity"/>
-	
+		<Label fx:id="passwordStrengthLabel" styleClass="label-muted" alignment="CENTER_RIGHT" maxWidth="Infinity" graphicTextGap="6"/>
+
 		<Region/>
 
 		<Label text="%newPassword.reenterPassword" labelFor="$reenterField"/>
 		<NiceSecurePasswordField fx:id="reenterField"/>
-		<Label fx:id="passwordMatchLabel" styleClass="label-muted" alignment="CENTER_RIGHT" maxWidth="Infinity" graphicTextGap="6" contentDisplay="LEFT" />
+		<Label fx:id="passwordMatchLabel" styleClass="label-muted" alignment="CENTER_RIGHT" maxWidth="Infinity" graphicTextGap="6"/>
 	</children>
 </VBox>