Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add display hint for applied market filers #1751

Merged
merged 4 commits into from
Mar 11, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -113,8 +113,8 @@ public void onActivate() {
});

Filters.Markets persistedMarketsFilter = settingsService.getCookie().asString(CookieKey.MARKETS_FILTER).map(name ->
ProtobufUtils.enumFromProto(Filters.Markets.class, name, Filters.Markets.WITH_OFFERS))
.orElse(Filters.Markets.WITH_OFFERS);
ProtobufUtils.enumFromProto(Filters.Markets.class, name, Filters.Markets.ALL))
.orElse(Filters.Markets.ALL);
model.getSelectedMarketsFilter().set(persistedMarketsFilter);

selectedMarketFilterPin = EasyBind.subscribe(model.getSelectedMarketsFilter(), filter -> {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,6 @@
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.util.Callback;
import org.fxmisc.easybind.EasyBind;
import org.fxmisc.easybind.Subscription;

import java.util.Comparator;
import java.util.List;
Expand Down Expand Up @@ -53,59 +51,44 @@ public static Comparator<MarketChannelItem> sortByMarketActivity() {

public static Callback<TableColumn<MarketChannelItem, MarketChannelItem>,
TableCell<MarketChannelItem, MarketChannelItem>> getMarketLabelCellFactory() {
return column -> {
return new TableCell<>() {
private final Label marketName = new Label();
private final Label marketCode = new Label();
private final Label numOffers = new Label();
private final HBox hBox = new HBox(10, marketCode, numOffers);
private final VBox vBox = new VBox(0, marketName, hBox);
private final Tooltip tooltip = new BisqTooltip();
private Subscription selectedMarketPin;

{
setCursor(Cursor.HAND);
hBox.setAlignment(Pos.CENTER_LEFT);
vBox.setAlignment(Pos.CENTER_LEFT);
Tooltip.install(vBox, tooltip);
}
return column -> new TableCell<>() {
private final Label marketName = new Label();
private final Label marketCode = new Label();
private final Label numOffers = new Label();
private final HBox hBox = new HBox(10, marketCode, numOffers);
private final VBox vBox = new VBox(0, marketName, hBox);
private final Tooltip tooltip = new BisqTooltip();

@Override
protected void updateItem(MarketChannelItem item, boolean empty) {
super.updateItem(item, empty);
{
setCursor(Cursor.HAND);
marketName.getStyleClass().add("market-name");
hBox.setAlignment(Pos.CENTER_LEFT);
vBox.setAlignment(Pos.CENTER_LEFT);
Tooltip.install(vBox, tooltip);
}

if (selectedMarketPin != null) {
selectedMarketPin.unsubscribe();
selectedMarketPin = null;
}
@Override
protected void updateItem(MarketChannelItem item, boolean empty) {
super.updateItem(item, empty);
if (item != null && !empty) {
marketName.setText(item.getMarket().getQuoteCurrencyName());
marketCode.setText(item.getMarket().getQuoteCurrencyCode());
StringExpression formattedNumOffers = Bindings.createStringBinding(() ->
BisqEasyOfferbookUtil.getFormattedOfferNumber(item.getNumOffers().get()), item.getNumOffers());
numOffers.textProperty().bind(formattedNumOffers);
StringExpression formattedTooltip = Bindings.createStringBinding(() ->
BisqEasyOfferbookUtil.getFormattedTooltip(item.getNumOffers().get(), item.getMarket().getQuoteCurrencyName()), item.getNumOffers());
tooltip.textProperty().bind(formattedTooltip);
tooltip.setStyle("-fx-text-fill: -fx-dark-text-color;");

setGraphic(vBox);
} else {
numOffers.textProperty().unbind();
tooltip.textProperty().unbind();
updateStyleClass(false);

if (item != null && !empty) {
selectedMarketPin = EasyBind.subscribe(item.getSelected(), this::updateStyleClass);
marketName.setText(item.getMarket().getQuoteCurrencyName());
marketCode.setText(item.getMarket().getQuoteCurrencyCode());
StringExpression formattedNumOffers = Bindings.createStringBinding(() ->
BisqEasyOfferbookUtil.getFormattedOfferNumber(item.getNumOffers().get()), item.getNumOffers());
numOffers.textProperty().bind(formattedNumOffers);
StringExpression formattedTooltip = Bindings.createStringBinding(() ->
BisqEasyOfferbookUtil.getFormattedTooltip(item.getNumOffers().get(),
item.getMarket().getQuoteCurrencyName()), item.getNumOffers());
tooltip.textProperty().bind(formattedTooltip);
tooltip.setStyle("-fx-text-fill: -fx-dark-text-color;");

setGraphic(vBox);
} else {
setGraphic(null);
}
}

private void updateStyleClass(boolean isSelected) {
marketName.getStyleClass().removeAll("market-name", "market-name-selected");
marketName.getStyleClass().add(isSelected ? "market-name-selected" : "market-name");
setGraphic(null);
}
};
}
};
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@
import bisq.chat.ChatChannel;
import bisq.chat.ChatMessage;
import bisq.desktop.common.Layout;
import bisq.desktop.common.utils.ImageUtil;
import bisq.desktop.components.containers.Spacer;
import bisq.desktop.components.controls.DropdownMenu;
import bisq.desktop.components.controls.DropdownMenuItem;
Expand All @@ -33,11 +34,13 @@
import javafx.css.PseudoClass;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Cursor;
import javafx.scene.Node;
import javafx.scene.control.Button;
import javafx.scene.control.CheckBox;
import javafx.scene.control.Label;
import javafx.scene.control.SeparatorMenuItem;
import javafx.scene.image.ImageView;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.layout.Priority;
Expand All @@ -63,7 +66,9 @@ public final class BisqEasyOfferbookView extends ChatView<BisqEasyOfferbookView,
atLeastTwoStars, atLeastOneStar;
private DropdownTitleMenuItem atLeastTitle;
private CheckBox hideUserMessagesCheckbox;
private Label channelHeaderIcon, marketPrice;
private Label channelHeaderIcon, marketPrice, removeWithOffersFilter;
private HBox withOffersDisplayHint;
private ImageView defaultCloseIcon, activeCloseIcon;

public BisqEasyOfferbookView(BisqEasyOfferbookModel model,
BisqEasyOfferbookController controller,
Expand Down Expand Up @@ -113,6 +118,8 @@ protected void onViewAttached() {
hideUserMessagesCheckbox.selectedProperty().bindBidirectional(getModel().getOfferOnly());
marketSelectorSearchBox.textProperty().bindBidirectional(getModel().getMarketSelectorSearchText());
marketPrice.textProperty().bind(getModel().getMarketPrice());
withOffersDisplayHint.visibleProperty().bind(getModel().getSelectedMarketsFilter().isEqualTo(Filters.Markets.WITH_OFFERS));
withOffersDisplayHint.managedProperty().bind(getModel().getSelectedMarketsFilter().isEqualTo(Filters.Markets.WITH_OFFERS));

selectedModelItemPin = EasyBind.subscribe(getModel().getSelectedMarketChannelItem(), selected -> {
tableView.getSelectionModel().select(selected);
Expand Down Expand Up @@ -150,6 +157,10 @@ protected void onViewAttached() {
atLeastOneStar.setOnAction(e -> setPeerReputationFilter(atLeastOneStar));

createOfferButton.setOnAction(e -> getController().onCreateOffer());

removeWithOffersFilter.setOnMouseClicked(e -> getModel().getSelectedMarketsFilter().set(Filters.Markets.ALL));
withOffersDisplayHint.setOnMouseEntered(e -> removeWithOffersFilter.setGraphic(activeCloseIcon));
withOffersDisplayHint.setOnMouseExited(e -> removeWithOffersFilter.setGraphic(defaultCloseIcon));
}

private void setOfferDirectionOrOwnerFilter(DropdownFilterMenuItem<?> filterMenuItem) {
Expand All @@ -167,6 +178,8 @@ protected void onViewDetached() {
hideUserMessagesCheckbox.selectedProperty().unbindBidirectional(getModel().getOfferOnly());
marketSelectorSearchBox.textProperty().unbindBidirectional(getModel().getMarketSelectorSearchText());
marketPrice.textProperty().unbind();
withOffersDisplayHint.visibleProperty().unbind();
withOffersDisplayHint.managedProperty().unbind();

selectedModelItemPin.unsubscribe();
tableViewSelectionPin.unsubscribe();
Expand All @@ -192,6 +205,10 @@ protected void onViewDetached() {
atLeastTwoStars.setOnAction(null);
atLeastOneStar.setOnAction(null);
createOfferButton.setOnAction(null);

removeWithOffersFilter.setOnMouseClicked(null);
withOffersDisplayHint.setOnMouseEntered(null);
withOffersDisplayHint.setOnMouseExited(null);
}

private BisqEasyOfferbookModel getModel() {
Expand All @@ -218,6 +235,12 @@ private void addMarketSelectionList() {
subheader.setAlignment(Pos.CENTER);
subheader.getStyleClass().add("market-selection-subheader");

setUpWithOffersFiltersDisplayHint();
HBox appliedFiltersSection = new HBox(withOffersDisplayHint);
appliedFiltersSection.setAlignment(Pos.CENTER_RIGHT);
appliedFiltersSection.getStyleClass().add("market-selection-applied-filters");
HBox.setHgrow(appliedFiltersSection, Priority.ALWAYS);

tableView = new BisqTableView<>(getModel().getSortedMarketChannelItems());
tableView.getStyleClass().add("market-selection-list");
tableView.allowVerticalScrollbar();
Expand All @@ -226,13 +249,30 @@ private void addMarketSelectionList() {
configTableView();
VBox.setVgrow(tableView, Priority.ALWAYS);

marketSelectionList = new VBox(header, Layout.hLine(), subheader, tableView);
marketSelectionList = new VBox(header, Layout.hLine(), subheader, appliedFiltersSection, tableView);
marketSelectionList.setPrefWidth(210);
marketSelectionList.setMinWidth(210);
marketSelectionList.setFillWidth(true);
marketSelectionList.getStyleClass().add("chat-container");
}

private void setUpWithOffersFiltersDisplayHint() {
Label withOffersLabel = new Label(Res.get("bisqEasy.offerbook.dropdownMenu.sortAndFilterMarkets.withOffers"));
withOffersLabel.getStyleClass().add("small-text");
removeWithOffersFilter = new Label();
defaultCloseIcon = ImageUtil.getImageViewById("close");
defaultCloseIcon.setScaleX(0.4);
defaultCloseIcon.setScaleY(0.4);
activeCloseIcon = ImageUtil.getImageViewById("close-white");
activeCloseIcon.setScaleX(0.4);
activeCloseIcon.setScaleY(0.4);
removeWithOffersFilter.setGraphic(defaultCloseIcon);
removeWithOffersFilter.setCursor(Cursor.HAND);
withOffersDisplayHint = new HBox(withOffersLabel, removeWithOffersFilter);
withOffersDisplayHint.setAlignment(Pos.CENTER);
withOffersDisplayHint.getStyleClass().add("filter-display-hint");
}

private DropdownMenu createAndGetSortAndFilterMarketsMenu() {
DropdownMenu dropdownMenu = new DropdownMenu("sort-grey", "sort-white", true);
dropdownMenu.setTooltip(Res.get("bisqEasy.offerbook.dropdownMenu.sortAndFilterMarkets.tooltip"));
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -65,8 +65,8 @@ public MarketChannelItem(BisqEasyOfferbookChannel channel) {
}

private void setUpColorAdjustments() {
defaultColorAdjust.setBrightness(-0.6);
defaultColorAdjust.setSaturation(-0.33);
defaultColorAdjust.setBrightness(-0.4);
defaultColorAdjust.setSaturation(-0.2);
defaultColorAdjust.setContrast(-0.1);

selectedColorAdjust.setBrightness(-0.1);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ public MyMessageBox(ChatMessageListItem<? extends ChatMessage, ? extends ChatCha
deliveryState = new Label();
deliveryState.setCursor(Cursor.HAND);
deliveryState.setTooltip(new BisqTooltip(true));
deliveryState.getStyleClass().add("medium-text");

VBox messageVBox = new VBox(quotedMessageVBox, message, editInputField);

Expand Down
33 changes: 28 additions & 5 deletions apps/desktop/desktop/src/main/resources/css/bisq_easy.css
Original file line number Diff line number Diff line change
Expand Up @@ -217,6 +217,34 @@
-fx-text-fill: -fx-light-text-color;
}

.market-selection-applied-filters {
-fx-pref-height: 35;
-fx-padding: 5;
}

.market-selection-applied-filters .filter-display-hint {
-fx-background-color: transparent;
-fx-border-color: -bisq-mid-grey-20;
-fx-border-width: 1;
-fx-border-radius: 4;
-fx-min-height: 20;
-fx-pref-height: 20;
-fx-max-height: 20;
-fx-padding: 0 0 0 5;
}

.market-selection-applied-filters .filter-display-hint:hover {
-fx-border-color: -bisq-white;
}

.market-selection-applied-filters .filter-display-hint:hover .label {
-fx-text-fill: -bisq-white;
}

.market-selection-applied-filters .filter-display-hint .label {
-fx-text-fill: -fx-mid-text-color;
}

.market-selection-list .column-header-background {
-fx-max-height: 0;
-fx-pref-height: 0;
Expand Down Expand Up @@ -244,11 +272,6 @@
}

.market-selection-list .market-name .text {
-fx-fill: -fx-mid-text-color !important;
-fx-text-fill: -fx-mid-text-color !important;
}

.market-selection-list .market-name-selected .text {
-fx-fill: -fx-light-text-color !important;
-fx-text-fill: -fx-light-text-color !important;
}
Expand Down
Loading