mirrors/cryptomator
1
0
Fork 0
mirror of https://github.com/cryptomator/cryptomator.git synced 2026-05-17 10:11:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added styleable PasswordStrengthIndicator

Browse Source
This commit is contained in:
Sebastian Stenzel
2019-08-26 14:47:25 +02:00
parent 4dc8693216
commit 3d7b504504
9 changed files with 168 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
main/ui/pom.xml
View File

@@ -73,7 +73,7 @@
<dependency>
<groupId>com.nulab-inc</groupId>
<artifactId>zxcvbn</artifactId>
<version>1.2.2</version>
<version>1.2.7</version>
</dependency>
<!-- Logging -->

17
main/ui/src/main/java/org/cryptomator/ui/addvaultwizard/CreateNewVaultPasswordController.java
View File

@@ -54,11 +54,6 @@ public class CreateNewVaultPasswordController implements FxController {
public Button finishButton;
public SecPasswordField passwordField;
public SecPasswordField reenterField;
public Region passwordStrengthLevel0;
public Region passwordStrengthLevel1;
public Region passwordStrengthLevel2;
public Region passwordStrengthLevel3;
public Region passwordStrengthLevel4;
public Label passwordStrengthLabel;
public HBox passwordMatchBox;
public FontAwesome5IconView checkmark;
@@ -97,11 +92,6 @@ public class CreateNewVaultPasswordController implements FxController {
passwordMatchLabel.textProperty().bind(Bindings.when(passwordsMatch.and(reenterFieldNotEmpty)).then(resourceBundle.getString("addvaultwizard.new.passwordsMatch")).otherwise(resourceBundle.getString("addvaultwizard.new.passwordsDoNotMatch")));
//bindsings for the password strength indicator
passwordStrengthLevel0.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(0), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel1.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(1), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel2.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(2), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel3.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(3), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel4.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(4), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLabel.textProperty().bind(EasyBind.map(passwordStrength, strengthRater::getStrengthDescription));
}
@@ -144,4 +134,11 @@ public class CreateNewVaultPasswordController implements FxController {
return vaultName;
}
public IntegerProperty passwordStrengthProperty() {
return passwordStrength;
}
public int getPasswordStrength() {
return passwordStrength.get();
}
}

22
main/ui/src/main/java/org/cryptomator/ui/changepassword/ChangePasswordController.java
View File

@@ -9,8 +9,6 @@ import javafx.scene.control.Button;
import javafx.scene.control.CheckBox;
import javafx.scene.control.Label;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Region;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import org.cryptomator.common.vaults.Vault;
import org.cryptomator.cryptolib.api.InvalidPassphraseException;
@@ -40,11 +38,6 @@ public class ChangePasswordController implements FxController {
public SecPasswordField oldPasswordField;
public SecPasswordField newPasswordField;
public SecPasswordField reenterPasswordField;
public Region passwordStrengthLevel0;
public Region passwordStrengthLevel1;
public Region passwordStrengthLevel2;
public Region passwordStrengthLevel3;
public Region passwordStrengthLevel4;
public Label passwordStrengthLabel;
public HBox passwordMatchBox;
public FontAwesome5IconView checkmark;
@@ -79,14 +72,7 @@ public class ChangePasswordController implements FxController {
cross.managedProperty().bind(cross.visibleProperty());
passwordMatchLabel.textProperty().bind(Bindings.when(passwordsMatch.and(reenterFieldNotEmpty)).then(resourceBundle.getString("changepassword.passwordsMatch")).otherwise(resourceBundle.getString("changepassword.passwordsDoNotMatch")));
//bindsings for the password strength indicator
passwordStrengthLevel0.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(0), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel1.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(1), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel2.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(2), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel3.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(3), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLevel4.backgroundProperty().bind(EasyBind.combine(passwordStrength, new SimpleIntegerProperty(4), strengthRater::getBackgroundWithStrengthColor));
passwordStrengthLabel.textProperty().bind(EasyBind.map(passwordStrength, strengthRater::getStrengthDescription));
}
@FXML
@@ -109,10 +95,18 @@ public class ChangePasswordController implements FxController {
LOG.info("Wrong old password.");
}
}
/* Getter/Setter */
public Vault getVault() {
return vault;
}
public IntegerProperty passwordStrengthProperty() {
return passwordStrength;
}
public int getPasswordStrength() {
return passwordStrength.get();
}
}

85
main/ui/src/main/java/org/cryptomator/ui/controls/PasswordStrengthIndicator.java Normal file
View File

@@ -0,0 +1,85 @@
package org.cryptomator.ui.controls;
import javafx.beans.binding.BooleanBinding;
import javafx.beans.property.IntegerProperty;
import javafx.beans.property.SimpleIntegerProperty;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import org.fxmisc.easybind.EasyBind;
public class PasswordStrengthIndicator extends HBox {
private static final String STYLECLASS = "password-strength-indicator";
private static final String SEGMENT_CLASS = "segment";
private static final String ACTIVE_SEGMENT_CLASS = "active";
private static final String STRENGTH_0_CLASS = "strength-0";
private static final String STRENGTH_1_CLASS = "strength-1";
private static final String STRENGTH_2_CLASS = "strength-2";
private static final String STRENGTH_3_CLASS = "strength-3";
private static final String STRENGTH_4_CLASS = "strength-4";
private final Region s0;
private final Region s1;
private final Region s2;
private final Region s3;
private final Region s4;
private final IntegerProperty strength = new SimpleIntegerProperty();
private final BooleanBinding isStrength0 = strength.isEqualTo(0);
private final BooleanBinding isStrength1 = strength.isEqualTo(1);
private final BooleanBinding isStrength2 = strength.isEqualTo(2);
private final BooleanBinding isStrength3 = strength.isEqualTo(3);
private final BooleanBinding isStrength4 = strength.isEqualTo(4);
private final BooleanBinding isMinimumStrength0 = strength.greaterThanOrEqualTo(0);
private final BooleanBinding isMinimumStrength1 = strength.greaterThanOrEqualTo(1);
private final BooleanBinding isMinimumStrength2 = strength.greaterThanOrEqualTo(2);
private final BooleanBinding isMinimumStrength3 = strength.greaterThanOrEqualTo(3);
private final BooleanBinding isMinimumStrength4 = strength.greaterThanOrEqualTo(4);
public PasswordStrengthIndicator() {
this.s0 = new Region();
this.s1 = new Region();
this.s2 = new Region();
this.s3 = new Region();
this.s4 = new Region();
getChildren().addAll(s0, s1, s2, s3, s4);
setHgrow(s0, Priority.ALWAYS);
setHgrow(s1, Priority.ALWAYS);
setHgrow(s2, Priority.ALWAYS);
setHgrow(s3, Priority.ALWAYS);
setHgrow(s4, Priority.ALWAYS);
getStyleClass().add(STYLECLASS);
s0.getStyleClass().add(SEGMENT_CLASS);
s1.getStyleClass().add(SEGMENT_CLASS);
s2.getStyleClass().add(SEGMENT_CLASS);
s3.getStyleClass().add(SEGMENT_CLASS);
s4.getStyleClass().add(SEGMENT_CLASS);
EasyBind.includeWhen(s0.getStyleClass(), ACTIVE_SEGMENT_CLASS, isMinimumStrength0);
EasyBind.includeWhen(s1.getStyleClass(), ACTIVE_SEGMENT_CLASS, isMinimumStrength1);
EasyBind.includeWhen(s2.getStyleClass(), ACTIVE_SEGMENT_CLASS, isMinimumStrength2);
EasyBind.includeWhen(s3.getStyleClass(), ACTIVE_SEGMENT_CLASS, isMinimumStrength3);
EasyBind.includeWhen(s4.getStyleClass(), ACTIVE_SEGMENT_CLASS, isMinimumStrength4);
EasyBind.includeWhen(getStyleClass(), STRENGTH_0_CLASS, isStrength0);
EasyBind.includeWhen(getStyleClass(), STRENGTH_1_CLASS, isStrength1);
EasyBind.includeWhen(getStyleClass(), STRENGTH_2_CLASS, isStrength2);
EasyBind.includeWhen(getStyleClass(), STRENGTH_3_CLASS, isStrength3);
EasyBind.includeWhen(getStyleClass(), STRENGTH_4_CLASS, isStrength4);
}
/* Observables */
public IntegerProperty strengthProperty() {
return strength;
}
public void setStrength(int strength) {
this.strength.set(strength);
}
public int getStrength() {
return strength.get();
}
}

3
main/ui/src/main/java/org/cryptomator/ui/util/PasswordStrengthUtil.java
View File

@@ -49,6 +49,7 @@ public class PasswordStrengthUtil {
}
}
@Deprecated
public Color getStrengthColor(Number score) {
switch (score.intValue()) {
case 0:
@@ -66,12 +67,14 @@ public class PasswordStrengthUtil {
}
}
@Deprecated
public Background getBackgroundWithStrengthColor(Number score) {
Color c = this.getStrengthColor(score);
BackgroundFill fill = new BackgroundFill(c, CornerRadii.EMPTY, Insets.EMPTY);
return new Background(fill);
}
@Deprecated
public Background getBackgroundWithStrengthColor(Number score, Number threshold) {
return score.intValue() >= threshold.intValue() ? getBackgroundWithStrengthColor(score) : getBackgroundWithStrengthColor(-1);
}

30
main/ui/src/main/resources/css/dark_theme.css
View File

@@ -347,6 +347,36 @@
-fx-background-color: SECONDARY;
}
/*******************************************************************************
* *
* Password Strength Indicator *
* *
******************************************************************************/
.password-strength-indicator .segment {
-fx-background-color: #ffffff;
}
.password-strength-indicator.strength-0 .segment.active {
-fx-background-color: #e74c3c;
}
.password-strength-indicator.strength-1 .segment.active {
-fx-background-color: #e67e22;
}
.password-strength-indicator.strength-2 .segment.active {
-fx-background-color: #f1c40f;
}
.password-strength-indicator.strength-3 .segment.active {
-fx-background-color: #40d47e;
}
.password-strength-indicator.strength-4 .segment.active {
-fx-background-color: #27ae60;
}
/*******************************************************************************
* *
* ButtonGroup *

30
main/ui/src/main/resources/css/light_theme.css
View File

@@ -347,6 +347,36 @@
-fx-background-color: SECONDARY;
}
/*******************************************************************************
* *
* Password Strength Indicator *
* *
******************************************************************************/
.password-strength-indicator .segment {
-fx-background-color: #ffffff;
}
.password-strength-indicator.strength-0 .segment.active {
-fx-background-color: #e74c3c;
}
.password-strength-indicator.strength-1 .segment.active {
-fx-background-color: #e67e22;
}
.password-strength-indicator.strength-2 .segment.active {
-fx-background-color: #f1c40f;
}
.password-strength-indicator.strength-3 .segment.active {
-fx-background-color: #40d47e;
}
.password-strength-indicator.strength-4 .segment.active {
-fx-background-color: #27ae60;
}
/*******************************************************************************
* *
* ButtonGroup *

9
main/ui/src/main/resources/fxml/addvault_new_password.fxml
View File

@@ -10,6 +10,7 @@
<?import javafx.scene.layout.VBox?>
<?import org.cryptomator.ui.controls.FontAwesome5IconView?>
<?import org.cryptomator.ui.controls.SecPasswordField?>
<?import org.cryptomator.ui.controls.PasswordStrengthIndicator?>
<VBox xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml"
fx:controller="org.cryptomator.ui.addvaultwizard.CreateNewVaultPasswordController"
@@ -25,13 +26,7 @@
<Label text="%addvaultwizard.new.enterPassword" labelFor="$passwordField"/>
<SecPasswordField fx:id="passwordField"/>
<HBox spacing="6" prefHeight="6" cacheShape="true" cache="true">
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel0" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel1" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel2" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel3" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel4" cacheShape="true" cache="true"/>
</HBox>
<PasswordStrengthIndicator spacing="6" prefHeight="6" strength="${controller.passwordStrength}"/>
<HBox alignment="BASELINE_RIGHT">
<Label fx:id="passwordStrengthLabel" styleClass="label-secondary" labelFor="$passwordField"/>
</HBox>

9
main/ui/src/main/resources/fxml/changepassword.fxml
View File

@@ -12,6 +12,7 @@
<?import javafx.scene.text.TextFlow?>
<?import org.cryptomator.ui.controls.FontAwesome5IconView?>
<?import org.cryptomator.ui.controls.SecPasswordField?>
<?import org.cryptomator.ui.controls.PasswordStrengthIndicator?>
<VBox xmlns="http://javafx.com/javafx"
xmlns:fx="http://javafx.com/fxml"
fx:controller="org.cryptomator.ui.changepassword.ChangePasswordController"
@@ -34,13 +35,7 @@
<Label labelFor="$newPasswordField" text="%changepassword.enterNewPassword"/>
<SecPasswordField fx:id="newPasswordField"/>
<HBox spacing="6.0" prefHeight="6.0" cacheShape="true" cache="true">
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel0" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel1" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel2" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel3" cacheShape="true" cache="true"/>
<Region HBox.hgrow="ALWAYS" fx:id="passwordStrengthLevel4" cacheShape="true" cache="true"/>
</HBox>
<PasswordStrengthIndicator prefHeight="6" spacing="6" strength="${controller.passwordStrength}"/>
<HBox alignment="BASELINE_RIGHT">
<Label fx:id="passwordStrengthLabel" styleClass="label-secondary"/>
</HBox>