Improve UI

This commit is contained in:
Manfred Karrer 2016-04-17 17:43:37 +02:00
parent be05a52e40
commit 822f64b13b
7 changed files with 49 additions and 32 deletions

View file

@ -52,8 +52,8 @@ public class BlockChainForm extends PaymentMethodForm {
private ComboBox<TradeCurrency> currencyComboBox;
private Label addressLabel;
public static int addFormForBuyer(GridPane gridPane, int gridRow, PaymentAccountContractData paymentAccountContractData) {
addLabelTextFieldWithCopyIcon(gridPane, ++gridRow, "Cryptocurrency address:", ((CryptoCurrencyAccountContractData) paymentAccountContractData).getAddress());
public static int addFormForBuyer(GridPane gridPane, int gridRow, PaymentAccountContractData paymentAccountContractData, String labelTitle) {
addLabelTextFieldWithCopyIcon(gridPane, ++gridRow, labelTitle, ((CryptoCurrencyAccountContractData) paymentAccountContractData).getAddress());
if (((CryptoCurrencyAccountContractData) paymentAccountContractData).getPaymentId() != null)
addLabelTextFieldWithCopyIcon(gridPane, ++gridRow, "Payment ID:", ((CryptoCurrencyAccountContractData) paymentAccountContractData).getPaymentId());

View file

@ -70,7 +70,7 @@ class CreateOfferDataModel extends ActivatableDataModel {
private final KeyRing keyRing;
private final P2PService p2PService;
private final PriceFeed priceFeed;
private final String shortOfferId;
final String shortOfferId;
private Navigation navigation;
private final BlockchainService blockchainService;
private final BSFormatter formatter;

View file

@ -138,7 +138,7 @@ class CreateOfferViewModel extends ActivatableWithDataModel<CreateOfferDataModel
this.navigation = navigation;
this.formatter = formatter;
paymentLabel = BSResources.get("createOffer.fundsBox.paymentLabel", dataModel.getOfferId());
paymentLabel = BSResources.get("createOffer.fundsBox.paymentLabel", dataModel.shortOfferId);
if (dataModel.getAddressEntry() != null) {
addressAsString = dataModel.getAddressEntry().getAddressString();
@ -441,6 +441,8 @@ class CreateOfferViewModel extends ActivatableWithDataModel<CreateOfferDataModel
public void onPaymentAccountSelected(PaymentAccount paymentAccount) {
btcValidator.setMaxTradeLimitInBitcoin(paymentAccount.getPaymentMethod().getMaxTradeLimit());
dataModel.onPaymentAccountSelected(paymentAccount);
if (amount.get() != null)
amountValidationResult.set(isBtcInputValid(amount.get()));
}
public void onCurrencySelected(TradeCurrency tradeCurrency) {
@ -491,15 +493,13 @@ class CreateOfferViewModel extends ActivatableWithDataModel<CreateOfferDataModel
calculateVolume();
// handle minAmount/amount relationship
if (!dataModel.isMinAmountLessOrEqualAmount()) {
if (!dataModel.isMinAmountLessOrEqualAmount())
minAmount.set(amount.get());
/*amountValidationResult.set(new InputValidator.ValidationResult(false,
BSResources.get("createOffer.validation.amountSmallerThanMinAmount")));*/
} else {
else
amountValidationResult.set(result);
if (minAmount.get() != null)
minAmountValidationResult.set(isBtcInputValid(minAmount.get()));
}
if (minAmount.get() != null)
minAmountValidationResult.set(isBtcInputValid(minAmount.get()));
}
}
}

View file

@ -88,7 +88,7 @@ public class OfferDetailsWindow extends Overlay<OfferDetailsWindow> {
this.tradePrice = tradePrice;
rowIndex = -1;
width = 900;
width = 950;
createGridPane();
addContent();
display();
@ -97,7 +97,7 @@ public class OfferDetailsWindow extends Overlay<OfferDetailsWindow> {
public void show(Offer offer) {
this.offer = offer;
rowIndex = -1;
width = 900;
width = 950;
createGridPane();
addContent();
display();
@ -172,7 +172,11 @@ public class OfferDetailsWindow extends Overlay<OfferDetailsWindow> {
} else {
addLabelTextField(gridPane, ++rowIndex, "Bitcoin amount" + btcDirectionInfo, formatter.formatCoinWithCode(offer.getAmount()));
addLabelTextField(gridPane, ++rowIndex, "Min. bitcoin amount:", formatter.formatCoinWithCode(offer.getMinAmount()));
addLabelTextField(gridPane, ++rowIndex, CurrencyUtil.getNameByCode(offer.getCurrencyCode()) + " amount" + fiatDirectionInfo, formatter.formatFiatWithCode(offer.getVolumeByAmount(offer.getAmount())));
String amount = formatter.formatFiatWithCode(offer.getOfferVolume());
String minVolume = "";
if (!offer.getAmount().equals(offer.getMinAmount()))
minVolume = " (min. " + formatter.formatFiatWithCode(offer.getMinOfferVolume()) + ")";
addLabelTextField(gridPane, ++rowIndex, CurrencyUtil.getNameByCode(offer.getCurrencyCode()) + " amount" + fiatDirectionInfo, amount + minVolume);
}
if (takeOfferHandlerOptional.isPresent()) {
@ -181,7 +185,7 @@ public class OfferDetailsWindow extends Overlay<OfferDetailsWindow> {
Fiat price = offer.getPrice();
if (offer.getUseMarketBasedPrice()) {
addLabelTextField(gridPane, ++rowIndex, "Price:", formatter.formatPriceWithCode(price) +
" (" + formatter.formatToPercentWithSymbol(offer.getMarketPriceMargin()) + ")");
" (distance from market price: " + formatter.formatToPercentWithSymbol(offer.getMarketPriceMargin()) + ")");
} else {
addLabelTextField(gridPane, ++rowIndex, "Price:", formatter.formatPriceWithCode(price));
}

View file

@ -49,7 +49,7 @@ public class QRCodeWindow extends Overlay<QRCodeWindow> {
GridPane.setHalignment(qrCodeImageView, HPos.CENTER);
gridPane.getChildren().add(qrCodeImageView);
Label infoLabel = new Label("Payment request:\n" + bitcoinURI);
Label infoLabel = new Label("Payment request:\n" + bitcoinURI.replace("%20", " ").replace("?", "\n?").replace("&", "\n&"));
infoLabel.setMouseTransparent(true);
infoLabel.setWrapText(true);
infoLabel.setId("popup-qr-code-info");

View file

@ -162,7 +162,8 @@ public class BuyerStep2View extends TradeStepView {
gridRow = AliPayForm.addFormForBuyer(gridPane, gridRow, paymentAccountContractData);
break;
case PaymentMethod.BLOCK_CHAINS_ID:
gridRow = BlockChainForm.addFormForBuyer(gridPane, gridRow, paymentAccountContractData);
String labelTitle = "Sellers " + CurrencyUtil.getNameByCode(trade.getOffer().getCurrencyCode()) + " address:";
gridRow = BlockChainForm.addFormForBuyer(gridPane, gridRow, paymentAccountContractData, labelTitle);
break;
default:
log.error("Not supported PaymentMethod: " + paymentMethodName);
@ -224,7 +225,7 @@ public class BuyerStep2View extends TradeStepView {
if (!BitsquareApp.DEV_MODE && preferences.showAgain(key)) {
Popup popup = new Popup();
popup.headLine("Confirm that you have started the payment")
.confirmation("Have you initiated the " + model.dataModel.getCurrencyCode() +
.confirmation("Did you initiate the " + CurrencyUtil.getNameByCode(trade.getOffer().getCurrencyCode()) +
" payment to your trading partner?")
.width(700)
.actionButtonText("Yes, I have started the payment")

View file

@ -122,37 +122,49 @@ public class SellerStep3View extends TradeStepView {
protected void addContent() {
addTradeInfoBlock();
TitledGroupBg titledGroupBg = addTitledGroupBg(gridPane, ++gridRow, 2, "Confirm payment receipt", Layout.GROUP_DISTANCE);
TitledGroupBg titledGroupBg = addTitledGroupBg(gridPane, ++gridRow, 3, "Confirm payment receipt", Layout.GROUP_DISTANCE);
TextFieldWithCopyIcon field = addLabelTextFieldWithCopyIcon(gridPane, gridRow, "Amount to receive:",
model.getFiatAmount(), Layout.FIRST_ROW_AND_GROUP_DISTANCE).second;
field.setCopyWithoutCurrencyPostFix(true);
String paymentDetails = "";
String title = "";
String myPaymentDetails = "";
String peersPaymentDetails = "";
String myTitle = "";
String peersTitle = "";
boolean isBlockChain = false;
String nameByCode = CurrencyUtil.getNameByCode(trade.getOffer().getCurrencyCode());
Contract contract = trade.getContract();
if (contract != null) {
PaymentAccountContractData paymentAccountContractData = contract.getSellerPaymentAccountContractData();
if (paymentAccountContractData instanceof CryptoCurrencyAccountContractData) {
paymentDetails = ((CryptoCurrencyAccountContractData) paymentAccountContractData).getAddress();
title = "Your " + nameByCode + " address:";
PaymentAccountContractData myPaymentAccountContractData = contract.getSellerPaymentAccountContractData();
PaymentAccountContractData peersPaymentAccountContractData = contract.getBuyerPaymentAccountContractData();
if (myPaymentAccountContractData instanceof CryptoCurrencyAccountContractData) {
myPaymentDetails = ((CryptoCurrencyAccountContractData) myPaymentAccountContractData).getAddress();
peersPaymentDetails = ((CryptoCurrencyAccountContractData) peersPaymentAccountContractData).getAddress();
myTitle = "Your " + nameByCode + " address:";
peersTitle = "Buyers " + nameByCode + " address:";
isBlockChain = true;
} else {
paymentDetails = paymentAccountContractData.getPaymentDetails();
title = "Your payment account:";
myPaymentDetails = myPaymentAccountContractData.getPaymentDetails();
peersPaymentDetails = peersPaymentAccountContractData.getPaymentDetails();
myTitle = "Your payment account:";
peersTitle = "Buyers payment account:";
}
}
TextFieldWithCopyIcon paymentDetailsTextField = addLabelTextFieldWithCopyIcon(gridPane, ++gridRow,
title, StringUtils.abbreviate(paymentDetails, 56)).second;
paymentDetailsTextField.setMouseTransparent(false);
paymentDetailsTextField.setTooltip(new Tooltip(paymentDetails));
TextFieldWithCopyIcon myPaymentDetailsTextField = addLabelTextFieldWithCopyIcon(gridPane, ++gridRow,
myTitle, StringUtils.abbreviate(myPaymentDetails, 56)).second;
myPaymentDetailsTextField.setMouseTransparent(false);
myPaymentDetailsTextField.setTooltip(new Tooltip(myPaymentDetails));
TextFieldWithCopyIcon peersPaymentDetailsTextField = addLabelTextFieldWithCopyIcon(gridPane, ++gridRow,
peersTitle, StringUtils.abbreviate(peersPaymentDetails, 56)).second;
peersPaymentDetailsTextField.setMouseTransparent(false);
peersPaymentDetailsTextField.setTooltip(new Tooltip(peersPaymentDetails));
if (!isBlockChain) {
addLabelTextFieldWithCopyIcon(gridPane, ++gridRow, "Reason for payment:", model.dataModel.getReference());
GridPane.setRowSpan(titledGroupBg, 3);
GridPane.setRowSpan(titledGroupBg, 4);
}
Tuple3<Button, ProgressIndicator, Label> tuple = addButtonWithStatusAfterGroup(gridPane, ++gridRow, "Confirm payment receipt");