Skip to content

Commit

Permalink
Move overlay handling to parent UI
Browse files Browse the repository at this point in the history
  • Loading branch information
@HenrikJannsen
HenrikJannsen committed Jan 31, 2025
1 parent 4e715ac commit 65245e2
Show file tree
Hide file tree
Showing 8 changed files with 100 additions and 74 deletions.
16 changes: 12 additions & 4 deletions .../content/bisq_easy/trade_wizard/amount_and_price/TradeWizardAmountAndPriceController.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,27 +51,35 @@ public TradeWizardAmountAndPriceController(ServiceProvider serviceProvider,
Consumer<Boolean> navigationButtonsVisibleHandler,
Consumer<NavigationTarget> closeAndNavigateToHandler) {
this.owner = owner;
tradeWizardAmountController = new TradeWizardAmountController(serviceProvider, owner,
navigationButtonsVisibleHandler, closeAndNavigateToHandler);
tradeWizardPriceController = new TradeWizardPriceController(serviceProvider, owner);
tradeWizardAmountController = new TradeWizardAmountController(serviceProvider,
owner,
navigationButtonsVisibleHandler,
closeAndNavigateToHandler);
tradeWizardPriceController = new TradeWizardPriceController(serviceProvider,
owner,
navigationButtonsVisibleHandler);

model = new TradeWizardAmountAndPriceModel();
view = new TradeWizardAmountAndPriceView(model,
this,
tradeWizardAmountController.getView().getRoot(),
tradeWizardAmountController.getView().getOverlay(),
tradeWizardPriceController.getView().getRoot());
tradeWizardPriceController.getView().getRoot(),
tradeWizardPriceController.getView().getOverlay());
}


@Override
public void onActivate() {
model.setHeadline(getHeadline());
model.getIsAmountOverlayVisible().bind(tradeWizardAmountController.getIsOverlayVisible());
model.getIsPriceOverlayVisible().bind(tradeWizardPriceController.getIsOverlayVisible());
}

@Override
public void onDeactivate() {
model.getIsAmountOverlayVisible().unbind();
model.getIsPriceOverlayVisible().unbind();
}

public void reset() {
Expand Down
2 changes: 2 additions & 0 deletions .../main/content/bisq_easy/trade_wizard/amount_and_price/TradeWizardAmountAndPriceModel.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ public class TradeWizardAmountAndPriceModel implements Model {
private Direction direction;
private Market market;
private final BooleanProperty isAmountOverlayVisible = new SimpleBooleanProperty();
private final BooleanProperty isPriceOverlayVisible = new SimpleBooleanProperty();

public void reset() {
isCreateOfferMode = false;
Expand All @@ -44,5 +45,6 @@ public void reset() {
direction = null;
market = null;
isAmountOverlayVisible.set(false);
isPriceOverlayVisible.set(false);
}
}
37 changes: 33 additions & 4 deletions ...p/main/content/bisq_easy/trade_wizard/amount_and_price/TradeWizardAmountAndPriceView.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,18 +32,23 @@
@Slf4j
public class TradeWizardAmountAndPriceView extends View<VBox, TradeWizardAmountAndPriceModel, TradeWizardAmountAndPriceController> {
private final Label headline, amountAtPriceSymbol;
private final VBox priceSelection, content, amountOverlay;
private Subscription isAmountOverlayVisiblePin;
private final VBox priceSelection;
private final VBox priceOverlay;
private final VBox content;
private final VBox amountOverlay;
private Subscription isAmountOverlayVisiblePin, isPriceOverlayVisiblePin;

public TradeWizardAmountAndPriceView(TradeWizardAmountAndPriceModel model,
TradeWizardAmountAndPriceController controller,
VBox amountSelection,
VBox amountOverlay,
VBox priceSelection) {
VBox priceSelection,
VBox priceOverlay) {
super(new VBox(), model, controller);

this.amountOverlay = amountOverlay;
this.priceSelection = priceSelection;
this.priceOverlay = priceOverlay;
headline = new Label();
headline.getStyleClass().add("bisq-text-headline-2");
amountAtPriceSymbol = new Label("@");
Expand All @@ -55,14 +60,22 @@ public TradeWizardAmountAndPriceView(TradeWizardAmountAndPriceModel model,
content = new VBox(20, headline, amountAndPriceHBox);
content.getStyleClass().add("content-box");

StackPane layeredContent = new StackPane(content, amountOverlay);
StackPane layeredContent = new StackPane(content, amountOverlay, priceOverlay);
StackPane.setMargin(amountOverlay, new Insets(-TradeWizardView.TOP_PANE_HEIGHT, 0, 0, 0));
// For unclear reasons the priceOverlay is not centered
StackPane.setMargin(priceOverlay, new Insets(-TradeWizardView.TOP_PANE_HEIGHT, 0, 0, 70));
root.getChildren().addAll(layeredContent);
root.getStyleClass().add("amount-and-price-step");
}

@Override
protected void onViewAttached() {
if (model.isCreateOfferMode()) {
VBox.setMargin(headline, new Insets(0, 0, 0, 0));
} else {
VBox.setMargin(headline, new Insets(30, 0, 10, 0));
}

headline.textProperty().set(model.getHeadline());
amountAtPriceSymbol.visibleProperty().set(model.isShowPriceSelection());
amountAtPriceSymbol.managedProperty().set(model.isShowPriceSelection());
Expand All @@ -83,10 +96,26 @@ protected void onViewAttached() {
}
}
});

isPriceOverlayVisiblePin = EasyBind.subscribe(model.getIsPriceOverlayVisible(), isPriceOverlayVisible -> {
if (isPriceOverlayVisible) {
priceOverlay.setVisible(true);
priceOverlay.setOpacity(1);
Transitions.blurStrong(content, 0);
Transitions.slideInTop(priceOverlay, 450);
} else {
Transitions.removeEffect(content);
if (priceOverlay.isVisible()) {
Transitions.fadeOut(priceOverlay, Transitions.DEFAULT_DURATION / 2,
() -> priceOverlay.setVisible(false));
}
}
});
}

@Override
protected void onViewDetached() {
isAmountOverlayVisiblePin.unsubscribe();
isPriceOverlayVisiblePin.unsubscribe();
}
}
17 changes: 8 additions & 9 deletions ...op/main/content/bisq_easy/trade_wizard/amount_and_price/amount/TradeWizardAmountView.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,8 +47,7 @@ public class TradeWizardAmountView extends View<VBox, TradeWizardAmountModel, Tr
@Getter
private final VBox overlay;
private final Button learnHowToBuildReputation, closeOverlayButton, fixedAmount, rangeAmount;
private final HBox amountModelsBox;
private final HBox amountLimitInfoHBox;
private final HBox amountModelsBox, amountLimitInfoHBox, amountBox;
private Subscription isRangeAmountEnabledPin;

public TradeWizardAmountView(TradeWizardAmountModel model,
Expand All @@ -60,7 +59,7 @@ public TradeWizardAmountView(TradeWizardAmountModel model,

VBox amountSelectionRoot = amountSelectionController.getView().getRoot();
amountSelectionRoot.getStyleClass().add("min-amount");
HBox amountBox = new HBox(0, amountSelectionRoot);
amountBox = new HBox(0, amountSelectionRoot);
amountBox.setAlignment(Pos.BASELINE_LEFT);
amountBox.getStyleClass().add("amount-box");

Expand Down Expand Up @@ -104,7 +103,7 @@ public TradeWizardAmountView(TradeWizardAmountModel model,
linkToWikiText = new Label();
linkToWiki = new Hyperlink("https://bisq.wiki/Reputation");
linkToWiki.getStyleClass().add("text-fill-green");
overlay = getOverlay(amountLimitInfoOverlayInfo, closeOverlayButton,
overlay = createOverlay(amountLimitInfoOverlayInfo, closeOverlayButton,
linkToWikiText, linkToWiki, learnHowToBuildReputation);

root.getChildren().addAll(amountModelsBox, amountBox, amountLimitInfoHBox);
Expand Down Expand Up @@ -170,11 +169,11 @@ protected void onViewDetached() {
rangeAmount.setOnAction(null);
}

private static VBox getOverlay(Label amountLimitInfo,
Button closeOverlayButton,
Label linkToWikiText,
Hyperlink linkToWiki,
Button learnHowToBuildReputation) {
private static VBox createOverlay(Label amountLimitInfo,
Button closeOverlayButton,
Label linkToWikiText,
Hyperlink linkToWiki,
Button learnHowToBuildReputation) {
Label headlineLabel = new Label(Res.get("bisqEasy.tradeWizard.amount.limitInfo.overlay.headline"));
headlineLabel.getStyleClass().add("bisq-text-headline-2");

Expand Down
16 changes: 15 additions & 1 deletion ...ain/content/bisq_easy/trade_wizard/amount_and_price/price/TradeWizardPriceController.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@
import bisq.presentation.formatters.PriceFormatter;
import bisq.settings.CookieKey;
import bisq.settings.SettingsService;
import javafx.beans.property.ReadOnlyBooleanProperty;
import javafx.beans.property.ReadOnlyObjectProperty;
import javafx.scene.layout.Region;
import lombok.Getter;
Expand All @@ -41,6 +42,7 @@
import org.fxmisc.easybind.Subscription;

import java.util.Optional;
import java.util.function.Consumer;

import static bisq.presentation.parser.PercentageParser.parse;

Expand All @@ -51,15 +53,19 @@ public class TradeWizardPriceController implements Controller {
private final TradeWizardPriceView view;
private final PriceInput priceInput;
private final Region owner;
private final Consumer<Boolean> navigationButtonsVisibleHandler;
private final MarketPriceService marketPriceService;
private final SettingsService settingsService;
private Subscription priceInputPin, isPriceInvalidPin, priceSpecPin, percentageInputPin, priceSliderValuePin, percentagePin;

public TradeWizardPriceController(ServiceProvider serviceProvider, Region owner) {
public TradeWizardPriceController(ServiceProvider serviceProvider,
Region owner,
Consumer<Boolean> navigationButtonsVisibleHandler) {
marketPriceService = serviceProvider.getBondedRolesService().getMarketPriceService();
settingsService = serviceProvider.getSettingsService();
priceInput = new PriceInput(serviceProvider.getBondedRolesService().getMarketPriceService());
this.owner = owner;
this.navigationButtonsVisibleHandler = navigationButtonsVisibleHandler;
model = new TradeWizardPriceModel();
view = new TradeWizardPriceView(model, this, priceInput);
}
Expand Down Expand Up @@ -98,6 +104,10 @@ public boolean validate() {
}
}

public ReadOnlyBooleanProperty getIsOverlayVisible() {
return model.getIsOverlayVisible();
}

@Override
public void onActivate() {
settingsService.getCookie().asBoolean(CookieKey.CREATE_OFFER_USE_FIX_PRICE, getCookieSubKey())
Expand Down Expand Up @@ -161,6 +171,8 @@ public void onDeactivate() {
percentagePin.unsubscribe();

view.getRoot().setOnKeyPressed(null);
navigationButtonsVisibleHandler.accept(true);
model.getIsOverlayVisible().set(false);
}

void onPercentageFocussed(boolean focussed) {
Expand Down Expand Up @@ -244,6 +256,7 @@ void usePercentagePrice() {
}

void onShowOverlay() {
navigationButtonsVisibleHandler.accept(false);
model.getIsOverlayVisible().set(true);
view.getRoot().setOnKeyPressed(keyEvent -> {
KeyHandlerUtil.handleEnterKeyEvent(keyEvent, () -> {
Expand All @@ -253,6 +266,7 @@ void onShowOverlay() {
}

void onCloseOverlay() {
navigationButtonsVisibleHandler.accept(true);
model.getIsOverlayVisible().set(false);
view.getRoot().setOnKeyPressed(null);
}
Expand Down
69 changes: 28 additions & 41 deletions ...ktop/main/content/bisq_easy/trade_wizard/amount_and_price/price/TradeWizardPriceView.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@
package bisq.desktop.main.content.bisq_easy.trade_wizard.amount_and_price.price;

import bisq.desktop.common.Icons;
import bisq.desktop.common.Transitions;
import bisq.desktop.common.threading.UIScheduler;
import bisq.desktop.common.view.View;
import bisq.desktop.components.containers.Spacer;
Expand All @@ -37,8 +36,8 @@
import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.layout.HBox;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import lombok.Getter;
import lombok.extern.slf4j.Slf4j;
import org.fxmisc.easybind.EasyBind;
import org.fxmisc.easybind.Subscription;
Expand All @@ -51,17 +50,20 @@ public class TradeWizardPriceView extends View<VBox, TradeWizardPriceModel, Trad
private static final DecimalFormat DECIMAL_FORMAT = new DecimalFormat("00");

private final PriceInputBox percentageInput;
private final VBox overlay, content;
@Getter
private final VBox overlay;
private final PriceInput priceInput;
private final Button percentagePrice, fixedPrice, closeLearnWhyButton;
private final Button percentagePrice, fixedPrice, closeOverlayButton;
private final Label warningIcon, feedbackSentence, minSliderValue, maxSliderValue;
private final HBox feedbackBox;
private final Slider slider;
private final Hyperlink showLearnWhyButton;
private Subscription percentageFocussedPin, useFixPricePin, shouldShowLearnWhyOverlayPin;
private Subscription percentageFocussedPin, useFixPricePin;

public TradeWizardPriceView(TradeWizardPriceModel model, TradeWizardPriceController controller, PriceInput priceInput) {
super(new VBox(), model, controller);
public TradeWizardPriceView(TradeWizardPriceModel model,
TradeWizardPriceController controller,
PriceInput priceInput) {
super(new VBox(10), model, controller);

this.priceInput = priceInput;

Expand Down Expand Up @@ -130,16 +132,12 @@ public TradeWizardPriceView(TradeWizardPriceModel model, TradeWizardPriceControl
feedbackBox.setAlignment(Pos.CENTER);

// Overlay
closeLearnWhyButton = new Button(Res.get("bisqEasy.price.feedback.learnWhySection.closeButton"));
overlay = createAndGetLearnWhyOverlay();
closeOverlayButton = new Button(Res.get("bisqEasy.price.feedback.learnWhySection.closeButton"));
overlay = createOverlay();

VBox.setMargin(sliderBox, new Insets(22.5, 0, 0, 0));
content = new VBox(10, pricingModels, fieldsBox, sliderBox, feedbackBox);
content.getStyleClass().add("price-content");
StackPane layeredContent = new StackPane(content, overlay);
layeredContent.getStyleClass().add("bisq-easy-trade-wizard-price-step");
root.getChildren().addAll(layeredContent);
root.getStyleClass().add("bisq-easy-trade-wizard-price-step-pane");
root.getChildren().addAll(pricingModels, fieldsBox, sliderBox, feedbackBox);
root.getStyleClass().add("bisq-easy-trade-wizard-price-step");
}

@Override
Expand All @@ -163,23 +161,10 @@ protected void onViewAttached() {
useFixPricePin = EasyBind.subscribe(model.getUseFixPrice(), useFixPrice ->
UIScheduler.run(this::updateFieldsBox).after(100));

shouldShowLearnWhyOverlayPin = EasyBind.subscribe(model.getIsOverlayVisible(), showOverlay -> UIScheduler.run(() -> {
if (showOverlay) {
overlay.setVisible(true);
overlay.setManaged(true);
Transitions.blurStrong(content, 0);
Transitions.slideInTop(overlay, 450);
} else {
overlay.setVisible(false);
overlay.setManaged(false);
Transitions.removeEffect(content);
}
}).after(100));

percentagePrice.setOnAction(e -> controller.usePercentagePrice());
fixedPrice.setOnAction(e -> controller.useFixedPrice());
showLearnWhyButton.setOnAction(e -> controller.onShowOverlay());
closeLearnWhyButton.setOnAction(e -> controller.onCloseOverlay());
closeOverlayButton.setOnAction(e -> controller.onCloseOverlay());

// Needed to trigger focusOut event on amount components
// We handle all parents mouse events.
Expand All @@ -205,12 +190,11 @@ protected void onViewDetached() {

percentageFocussedPin.unsubscribe();
useFixPricePin.unsubscribe();
shouldShowLearnWhyOverlayPin.unsubscribe();

percentagePrice.setOnAction(null);
fixedPrice.setOnAction(null);
showLearnWhyButton.setOnAction(null);
closeLearnWhyButton.setOnAction(null);
closeOverlayButton.setOnAction(null);

Parent node = root;
while (node.getParent() != null) {
Expand Down Expand Up @@ -247,18 +231,21 @@ private void updateFieldsBox() {
}
}

private VBox createAndGetLearnWhyOverlay() {
Label learnWhyTitle = new Label(Res.get("bisqEasy.price.feedback.learnWhySection.title"));
learnWhyTitle.getStyleClass().addAll("learn-why-title-label", "large-text");
private VBox createOverlay() {
Label headlineLabel = new Label(Res.get("bisqEasy.price.feedback.learnWhySection.title"));
headlineLabel.getStyleClass().addAll("learn-why-title-label", "large-text");
Label learnWhyIntroLabel = new Label(Res.get("bisqEasy.price.feedback.learnWhySection.description.intro"));
learnWhyIntroLabel.getStyleClass().addAll("learn-why-text", "learn-why-intro-label");
learnWhyIntroLabel.getStyleClass().addAll("learn-why-text", "learn-why-intro-label", "wrap-text");
UnorderedList learnWhyExpositionList = new UnorderedList(Res.get("bisqEasy.price.feedback.learnWhySection.description.exposition"),
"learn-why-text", 7, 10, "- ", "- ");

VBox overlay = new VBox(10, learnWhyTitle, learnWhyIntroLabel, learnWhyExpositionList, closeLearnWhyButton);
overlay.getStyleClass().addAll("trade-wizard-feedback-bg", "learn-why-overlay");
StackPane.setAlignment(overlay, Pos.TOP_CENTER);
StackPane.setMargin(overlay, new Insets(-63, 0, 0, 0));
return overlay;
VBox.setMargin(closeOverlayButton, new Insets(10, 0, 0, 0));
VBox content = new VBox(40, headlineLabel, learnWhyIntroLabel, learnWhyExpositionList, closeOverlayButton);
content.setAlignment(Pos.TOP_CENTER);
content.getStyleClass().setAll("trade-wizard-feedback-bg");
content.setPadding(new Insets(30));

VBox vBox = new VBox(content, Spacer.fillVBox());
content.setMaxWidth(700);
return vBox;
}
}
Loading

0 comments on commit 65245e2

Please sign in to comment.