From 860e41844a7db04cf0e328144ee6ec3893264e56 Mon Sep 17 00:00:00 2001 From: Christoph Atteneder Date: Fri, 2 Feb 2018 08:48:59 +0100 Subject: [PATCH 1/6] Remove unecessary style --- gui/src/main/java/io/bisq/gui/bisq.css | 4 ---- 1 file changed, 4 deletions(-) diff --git a/gui/src/main/java/io/bisq/gui/bisq.css b/gui/src/main/java/io/bisq/gui/bisq.css index fdf6b1dbe25..de4edc8ef12 100644 --- a/gui/src/main/java/io/bisq/gui/bisq.css +++ b/gui/src/main/java/io/bisq/gui/bisq.css @@ -362,10 +362,6 @@ textfield */ -fx-padding: 4 4 4 4; } -#address-text-field:hover { - -fx-text-fill: -bs-black; -} - #funds-confidence { -fx-progress-color: -bs-dim-grey; } From 509b7d2f5e04db66fac3f71025b88ccbace81bcf Mon Sep 17 00:00:00 2001 From: Christoph Atteneder Date: Fri, 2 Feb 2018 09:22:30 +0100 Subject: [PATCH 2/6] Remove unnecessary style --- gui/src/main/java/io/bisq/gui/bisq.css | 4 ---- 1 file changed, 4 deletions(-) diff --git a/gui/src/main/java/io/bisq/gui/bisq.css b/gui/src/main/java/io/bisq/gui/bisq.css index de4edc8ef12..9aa384c2351 100644 --- a/gui/src/main/java/io/bisq/gui/bisq.css +++ b/gui/src/main/java/io/bisq/gui/bisq.css @@ -498,10 +498,6 @@ textfield */ -fx-text-fill: -bs-medium-grey; } -#clickable-icon:hover { - -fx-text-fill: -bs-grey; -} - /******************************************************************************* * * * Images * From 50fde309ac41003b6510bc5916b63e63ca3c9058 Mon Sep 17 00:00:00 2001 From: Christoph Atteneder Date: Fri, 2 Feb 2018 09:24:03 +0100 Subject: [PATCH 3/6] Reposition and colorize existing icons and add security deposit with currency code --- gui/src/main/java/io/bisq/gui/bisq.css | 8 ++++++++ .../io/bisq/gui/components/AddressTextField.java | 6 +++--- .../io/bisq/gui/components/FundsTextField.java | 16 ++++++++-------- .../main/offer/createoffer/CreateOfferView.java | 2 +- .../offer/createoffer/CreateOfferViewModel.java | 5 ++--- .../gui/main/offer/takeoffer/TakeOfferView.java | 2 +- .../main/offer/takeoffer/TakeOfferViewModel.java | 5 ++--- 7 files changed, 25 insertions(+), 19 deletions(-) diff --git a/gui/src/main/java/io/bisq/gui/bisq.css b/gui/src/main/java/io/bisq/gui/bisq.css index 9aa384c2351..a1021f97356 100644 --- a/gui/src/main/java/io/bisq/gui/bisq.css +++ b/gui/src/main/java/io/bisq/gui/bisq.css @@ -126,6 +126,14 @@ bg color of non edit textFields: fafafa -fx-text-fill: -bs-black; } +.info { + -fx-text-fill: -bs-bg-green2; +} + +.info:hover { + -fx-text-fill: -bs-grey; +} + .headline-label { -fx-font-weight: bold; -fx-font-size: 22; diff --git a/gui/src/main/java/io/bisq/gui/components/AddressTextField.java b/gui/src/main/java/io/bisq/gui/components/AddressTextField.java index 09b0c6988fb..6228154d61b 100644 --- a/gui/src/main/java/io/bisq/gui/components/AddressTextField.java +++ b/gui/src/main/java/io/bisq/gui/components/AddressTextField.java @@ -87,12 +87,12 @@ public AddressTextField() { Utilities.copyToClipboard(address.get()); })); - AnchorPane.setRightAnchor(copyIcon, 5.0); - AnchorPane.setRightAnchor(extWalletIcon, 30.0); + AnchorPane.setRightAnchor(copyIcon, 30.0); + AnchorPane.setRightAnchor(extWalletIcon, 5.0); AnchorPane.setRightAnchor(textField, 55.0); AnchorPane.setLeftAnchor(textField, 0.0); - getChildren().addAll(textField, extWalletIcon, copyIcon); + getChildren().addAll(textField, copyIcon, extWalletIcon); } private void openWallet() { diff --git a/gui/src/main/java/io/bisq/gui/components/FundsTextField.java b/gui/src/main/java/io/bisq/gui/components/FundsTextField.java index 6d0fd820d01..adf960120ab 100644 --- a/gui/src/main/java/io/bisq/gui/components/FundsTextField.java +++ b/gui/src/main/java/io/bisq/gui/components/FundsTextField.java @@ -58,8 +58,7 @@ public FundsTextField() { infoIcon = new Label(); infoIcon.setLayoutY(3); - infoIcon.setId("clickable-icon"); - infoIcon.getStyleClass().addAll("highlight", "show-hand"); + infoIcon.getStyleClass().addAll("icon", "info"); AwesomeDude.setIcon(infoIcon, AwesomeIcon.INFO_SIGN); Label copyIcon = new Label(); @@ -81,9 +80,9 @@ public FundsTextField() { } }); - AnchorPane.setRightAnchor(copyIcon, 5.0); - AnchorPane.setRightAnchor(infoIcon, 37.0); - AnchorPane.setRightAnchor(textField, 30.0); + AnchorPane.setRightAnchor(copyIcon, 30.0); + AnchorPane.setRightAnchor(infoIcon, 62.0); + AnchorPane.setRightAnchor(textField, 55.0); AnchorPane.setLeftAnchor(textField, 0.0); getChildren().addAll(textField, infoIcon, copyIcon); @@ -95,7 +94,7 @@ public FundsTextField() { public void setContentForInfoPopOver(Node node) { // As we don't use binding here we need to recreate it on mouse over to reflect the current state - infoIcon.setOnMouseEntered(e -> createInfoPopOver(node)); + infoIcon.setOnMouseEntered(e -> showInfoPopOver(node)); infoIcon.setOnMouseExited(e -> { if (infoPopover != null) infoPopover.hide(); @@ -106,10 +105,11 @@ public void setContentForInfoPopOver(Node node) { // Private /////////////////////////////////////////////////////////////////////////////////////////// - private void createInfoPopOver(Node node) { + private void showInfoPopOver(Node node) { node.getStyleClass().add("default-text"); - infoPopover = new PopOver(node); + if (infoPopover == null) infoPopover = new PopOver(node); + if (infoIcon.getScene() != null) { infoPopover.setDetachable(false); infoPopover.setArrowLocation(PopOver.ArrowLocation.RIGHT_TOP); diff --git a/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferView.java b/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferView.java index 16ba5a77390..c2d5d37300f 100644 --- a/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferView.java +++ b/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferView.java @@ -408,7 +408,7 @@ private void onShowPayFundsScreen() { cancelButton2.setVisible(true); totalToPayTextField.setFundsStructure(Res.get("createOffer.fundsBox.fundsStructure", - model.getSecurityDepositPercentage(), model.getMakerFeePercentage(), model.getTxFeePercentage())); + model.getSecurityDepositWithCode(), model.getMakerFeePercentage(), model.getTxFeePercentage())); totalToPayTextField.setContentForInfoPopOver(createInfoPopover()); final byte[] imageBytes = QRCode diff --git a/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferViewModel.java b/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferViewModel.java index 273aca314e9..288eb6f77f1 100644 --- a/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferViewModel.java +++ b/gui/src/main/java/io/bisq/gui/main/offer/createoffer/CreateOfferViewModel.java @@ -831,9 +831,8 @@ public String getSecurityDepositInfo() { GUIUtil.getPercentageOfTradeAmount(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), btcFormatter); } - public String getSecurityDepositPercentage() { - return GUIUtil.getPercentage(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), - btcFormatter); + public String getSecurityDepositWithCode() { + return btcFormatter.formatCoinWithCode(dataModel.getSecurityDeposit()); } public String getMakerFee() { diff --git a/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java b/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java index 7ee6758d8d9..66b51de44fb 100644 --- a/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java +++ b/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java @@ -419,7 +419,7 @@ private void onShowPayFundsScreen() { balanceTextField.setVisible(true); totalToPayTextField.setFundsStructure(Res.get("createOffer.fundsBox.fundsStructure", - model.getSecurityDepositPercentage(), model.getMakerFeePercentage(), model.getTxFeePercentage())); + model.getSecurityDepositWithCode(), model.getMakerFeePercentage(), model.getTxFeePercentage())); totalToPayTextField.setContentForInfoPopOver(createInfoPopover()); if (model.dataModel.isWalletFunded.get()) { diff --git a/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferViewModel.java b/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferViewModel.java index 66fd32c93a4..5286f0ea308 100644 --- a/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferViewModel.java +++ b/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferViewModel.java @@ -584,9 +584,8 @@ public String getSecurityDepositInfo() { GUIUtil.getPercentageOfTradeAmount(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), btcFormatter); } - public String getSecurityDepositPercentage() { - return GUIUtil.getPercentage(dataModel.getSecurityDeposit(), dataModel.getAmount().get(), - btcFormatter); + public String getSecurityDepositWithCode() { + return btcFormatter.formatCoinWithCode(dataModel.getSecurityDeposit()); } public String getTakerFee() { From a4359e955754575d6491a2527b990266ba1f6339 Mon Sep 17 00:00:00 2001 From: Christoph Atteneder Date: Mon, 5 Feb 2018 11:07:53 +0100 Subject: [PATCH 4/6] Improve English translation and add German ones --- common/src/main/resources/i18n/displayStrings.properties | 4 ++-- common/src/main/resources/i18n/displayStrings_de.properties | 2 ++ .../java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java | 2 +- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/common/src/main/resources/i18n/displayStrings.properties b/common/src/main/resources/i18n/displayStrings.properties index 99ce4e5a7f1..d915b243dba 100644 --- a/common/src/main/resources/i18n/displayStrings.properties +++ b/common/src/main/resources/i18n/displayStrings.properties @@ -353,7 +353,7 @@ createOffer.fundsBox.offerFee=Trade fee: createOffer.fundsBox.networkFee=Mining fee: createOffer.fundsBox.placeOfferSpinnerInfo=Offer publishing is in progress ... createOffer.fundsBox.paymentLabel=Bisq trade with ID {0} -createOffer.fundsBox.fundsStructure=({0} deposit, {1} trade fee, {2} mining fee) +createOffer.fundsBox.fundsStructure=({0} security deposit, {1} trade fee, {2} mining fee) createOffer.success.headline=Your offer has been published createOffer.success.info=You can manage your open offers at \"Portfolio/My open offers\". @@ -411,7 +411,7 @@ takeOffer.fundsBox.offerFee=Trade fee: takeOffer.fundsBox.networkFee=Total mining fees: takeOffer.fundsBox.takeOfferSpinnerInfo=Take offer in progress ... takeOffer.fundsBox.paymentLabel=Bisq trade with ID {0} -takeOffer.fundsBox.fundsStructure=({0} deposit, {1} trade fee, {2} mining fee) +takeOffer.fundsBox.fundsStructure=({0} security deposit, {1} trade fee, {2} mining fee) takeOffer.success.headline=You have successfully taken an offer. takeOffer.success.info=You can see the status of your trade at \"Portfolio/Open trades\". takeOffer.error.message=An error occurred when taking the offer.\n\n{0} diff --git a/common/src/main/resources/i18n/displayStrings_de.properties b/common/src/main/resources/i18n/displayStrings_de.properties index 270fcdeea71..d96eacf3e0c 100644 --- a/common/src/main/resources/i18n/displayStrings_de.properties +++ b/common/src/main/resources/i18n/displayStrings_de.properties @@ -341,6 +341,7 @@ createOffer.fundsBox.offerFee=Erstellergebühr: createOffer.fundsBox.networkFee=Mining-Gebühr: createOffer.fundsBox.placeOfferSpinnerInfo=Das Angebot wird veröffentlicht ... createOffer.fundsBox.paymentLabel=Bisq-Handel mit der ID {0} +createOffer.fundsBox.fundsStructure=({0} Kaution, {1} Erstellergebühr, {2} Mining-Gebühr) createOffer.success.headline=Ihr Angebot wurde veröffentlicht createOffer.success.info=Sie können Ihre offenen Angebote unter \"Portfolio/Meine offenen Angebote\" verwalten. @@ -393,6 +394,7 @@ takeOffer.fundsBox.offerFee=Abnehmergebühr: takeOffer.fundsBox.networkFee=Mining-Gebühren (3x): takeOffer.fundsBox.takeOfferSpinnerInfo=Angebot wird angenommen ... takeOffer.fundsBox.paymentLabel=Bisq-Handel mit der ID {0} +takeOffer.fundsBox.fundsStructure=({0} Kaution, {1} Abnehmergebühr, {2} Mining-Gebühr) takeOffer.success.headline=Sie haben erfolgreich ein Angebot angenommen. takeOffer.success.info=Sie können den Status Ihres Angebots unter \"Portfolio/Offene Angebote\" einsehen. takeOffer.error.message=Bei der Angebotsannahme trat ein Fehler auf.\n\n{0} diff --git a/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java b/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java index f34ca2904d6..66fcc9c08f1 100644 --- a/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java +++ b/gui/src/main/java/io/bisq/gui/main/offer/takeoffer/TakeOfferView.java @@ -420,7 +420,7 @@ private void onShowPayFundsScreen() { balanceLabel.setVisible(true); balanceTextField.setVisible(true); - totalToPayTextField.setFundsStructure(Res.get("createOffer.fundsBox.fundsStructure", + totalToPayTextField.setFundsStructure(Res.get("takeOffer.fundsBox.fundsStructure", model.getSecurityDepositWithCode(), model.getMakerFeePercentage(), model.getTxFeePercentage())); totalToPayTextField.setContentForInfoPopOver(createInfoPopover()); From 17b33931efa46ad5fe3ac7b0af6a1992fd49c818 Mon Sep 17 00:00:00 2001 From: Christoph Atteneder Date: Mon, 5 Feb 2018 11:08:38 +0100 Subject: [PATCH 5/6] Prevent flickering on roll over --- .../io/bisq/gui/components/FundsTextField.java | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/gui/src/main/java/io/bisq/gui/components/FundsTextField.java b/gui/src/main/java/io/bisq/gui/components/FundsTextField.java index adf960120ab..ae81f782b42 100644 --- a/gui/src/main/java/io/bisq/gui/components/FundsTextField.java +++ b/gui/src/main/java/io/bisq/gui/components/FundsTextField.java @@ -19,6 +19,7 @@ import de.jensd.fx.fontawesome.AwesomeDude; import de.jensd.fx.fontawesome.AwesomeIcon; +import io.bisq.common.UserThread; import io.bisq.common.locale.Res; import io.bisq.common.util.Utilities; import javafx.beans.binding.Bindings; @@ -33,12 +34,15 @@ import org.slf4j.Logger; import org.slf4j.LoggerFactory; +import java.util.concurrent.TimeUnit; + public class FundsTextField extends AnchorPane { public static final Logger log = LoggerFactory.getLogger(FundsTextField.class); private final StringProperty amount = new SimpleStringProperty(); private final StringProperty fundsStructure = new SimpleStringProperty(); private final Label infoIcon; + private Boolean hidePopover; private PopOver infoPopover; /////////////////////////////////////////////////////////////////////////////////////////// @@ -94,10 +98,19 @@ public FundsTextField() { public void setContentForInfoPopOver(Node node) { // As we don't use binding here we need to recreate it on mouse over to reflect the current state - infoIcon.setOnMouseEntered(e -> showInfoPopOver(node)); + infoIcon.setOnMouseEntered(e -> { + hidePopover = false; + showInfoPopOver(node); + }); infoIcon.setOnMouseExited(e -> { if (infoPopover != null) - infoPopover.hide(); + hidePopover = true; + UserThread.runAfter(() -> { + if (hidePopover) { + infoPopover.hide(); + hidePopover = false; + } + },250, TimeUnit.MILLISECONDS); }); } From 41fd919b59702de30c516951103c58f0ec4a2c98 Mon Sep 17 00:00:00 2001 From: Christoph Atteneder Date: Mon, 5 Feb 2018 11:10:48 +0100 Subject: [PATCH 6/6] Use brighter green to improve usability --- gui/src/main/java/io/bisq/gui/bisq.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/gui/src/main/java/io/bisq/gui/bisq.css b/gui/src/main/java/io/bisq/gui/bisq.css index a1021f97356..b7a77e231d0 100644 --- a/gui/src/main/java/io/bisq/gui/bisq.css +++ b/gui/src/main/java/io/bisq/gui/bisq.css @@ -127,7 +127,7 @@ bg color of non edit textFields: fafafa } .info { - -fx-text-fill: -bs-bg-green2; + -fx-text-fill: -bs-green; } .info:hover {