LeftPanel: new balance card

This commit is contained in:
selsta 2019-09-06 15:52:45 +02:00
parent ca8138bb46
commit 2ca76ff13c
No known key found for this signature in database
GPG key ID: 2EA0A99A8B07AE5E
12 changed files with 180 additions and 239 deletions

View file

@ -40,17 +40,17 @@ import "components/effects/" as MoneroEffects
Rectangle {
id: panel
property alias unlockedBalanceText: unlockedBalanceText.text
property alias unlockedBalanceVisible: unlockedBalanceText.visible
property alias unlockedBalanceLabelVisible: unlockedBalanceLabel.visible
property alias balanceLabelText: balanceLabel.text
property alias balanceText: balanceText.text
property alias balanceTextFiat: balanceTextFiat.text
property alias unlockedBalanceTextFiat: unlockedBalanceTextFiat.text
property int currentAccountIndex: 0
property string currentAccountLabel: "Primary account"
property string balanceString: "?.??"
property string balanceUnlockedString: "?.??"
property string balanceFiatString: "?.??"
property string minutesToUnlock: ""
property bool isSyncing: false
property alias networkStatus : networkStatus
property alias progressBar : progressBar
property alias daemonProgressBar : daemonProgressBar
property alias minutesToUnlockTxt: unlockedBalanceLabel.text
property int titleBarHeight: 50
property string copyValue: ""
Clipboard { id: clipboard }
@ -108,7 +108,7 @@ Rectangle {
visible: true
z: 2
id: column1
height: 210
height: 175
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
@ -127,9 +127,9 @@ Rectangle {
id: card
visible: !isOpenGL || MoneroComponents.Style.blackTheme
width: 260
height: 170
height: 135
fillMode: Image.PreserveAspectFit
source: "qrc:///images/card-background.png"
source: MoneroComponents.Style.blackTheme ? "qrc:///images/card-background-black.png" : "qrc:///images/card-background-white.png"
}
DropShadow {
@ -179,7 +179,7 @@ Rectangle {
anchors.right: parent.right
anchors.rightMargin: 8
anchors.top: parent.top
anchors.topMargin: 25
anchors.topMargin: 30
Image {
id: logoutImage
@ -190,6 +190,13 @@ Rectangle {
source: "qrc:///images/logout.png"
}
ColorOverlay {
anchors.fill: logoutImage
source: logoutImage
visible: !MoneroComponents.Style.blackTheme
color: "#000000"
}
MouseArea{
anchors.fill: parent
hoverEnabled: true
@ -202,26 +209,6 @@ Rectangle {
}
}
}
MoneroComponents.Label {
fontSize: 20
text: persistentSettings.fiatPriceCurrency == "xmrusd" ? "$" : "€"
color: "white"
visible: persistentSettings.fiatPriceEnabled
anchors.right: parent.right
anchors.rightMargin: 45
anchors.top: parent.top
anchors.topMargin: 28
themeTransition: false
MouseArea{
anchors.fill: parent
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
onClicked: {
persistentSettings.fiatPriceToggle = !persistentSettings.fiatPriceToggle
}
}
}
}
Item {
@ -232,176 +219,152 @@ Rectangle {
height: 490
width: 50
MoneroComponents.TextPlain {
visible: !(persistentSettings.fiatPriceToggle && persistentSettings.fiatPriceEnabled)
id: balanceText
themeTransition: false
MoneroComponents.Label {
fontSize: 12
id: accountIndex
text: qsTr("Account") + " #" + currentAccountIndex
color: MoneroComponents.Style.blackTheme ? "white" : "black"
anchors.left: parent.left
anchors.leftMargin: 20
anchors.leftMargin: 60
anchors.top: parent.top
anchors.topMargin: 76
font.family: "Arial"
color: "#FFFFFF"
text: "N/A"
// dynamically adjust text size
font.pixelSize: {
if (persistentSettings.hideBalance) {
return 20;
}
var digits = text.split('.')[0].length
var defaultSize = 22;
if(digits > 2) {
return defaultSize - 1.1*digits
}
return defaultSize;
}
MouseArea {
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onEntered: {
parent.color = MoneroComponents.Style.orange
}
onExited: {
parent.color = MoneroComponents.Style.white
}
onClicked: {
console.log("Copied to clipboard");
clipboard.setText(parent.text);
appWindow.showStatusMessage(qsTr("Copied to clipboard"),3)
}
}
}
MoneroComponents.TextPlain {
visible: !balanceText.visible
id: balanceTextFiat
anchors.topMargin: 23
themeTransition: false
anchors.left: parent.left
anchors.leftMargin: 20
anchors.top: parent.top
anchors.topMargin: 76
font.family: "Arial"
color: "#FFFFFF"
text: "N/A"
font.pixelSize: balanceText.font.pixelSize
MouseArea {
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onEntered: {
parent.color = MoneroComponents.Style.orange
}
onExited: {
parent.color = MoneroComponents.Style.white
}
onClicked: {
console.log("Copied to clipboard");
clipboard.setText(parent.text);
appWindow.showStatusMessage(qsTr("Copied to clipboard"),3)
}
}
}
MoneroComponents.TextPlain {
id: unlockedBalanceText
visible: !(persistentSettings.fiatPriceToggle && persistentSettings.fiatPriceEnabled)
themeTransition: false
anchors.left: parent.left
anchors.leftMargin: 20
anchors.top: parent.top
anchors.topMargin: 126
font.family: "Arial"
color: "#FFFFFF"
text: "N/A"
// dynamically adjust text size
font.pixelSize: {
if (persistentSettings.hideBalance) {
return 20;
}
var digits = text.split('.')[0].length
var defaultSize = 20;
if(digits > 3) {
return defaultSize - 0.6*digits
}
return defaultSize;
}
MouseArea {
hoverEnabled: true
MouseArea{
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onEntered: {
parent.color = MoneroComponents.Style.orange
}
onExited: {
parent.color = MoneroComponents.Style.white
}
onClicked: {
console.log("Copied to clipboard");
clipboard.setText(parent.text);
appWindow.showStatusMessage(qsTr("Copied to clipboard"),3)
}
}
}
MoneroComponents.TextPlain {
id: unlockedBalanceTextFiat
themeTransition: false
visible: !unlockedBalanceText.visible
anchors.left: parent.left
anchors.leftMargin: 20
anchors.top: parent.top
anchors.topMargin: 126
font.family: "Arial"
color: "#FFFFFF"
text: "N/A"
font.pixelSize: unlockedBalanceText.font.pixelSize
MouseArea {
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onEntered: {
parent.color = MoneroComponents.Style.orange
}
onExited: {
parent.color = MoneroComponents.Style.white
}
onClicked: {
console.log("Copied to clipboard");
clipboard.setText(parent.text);
appWindow.showStatusMessage(qsTr("Copied to clipboard"),3)
}
onClicked: appWindow.showPageRequest("Account")
}
}
MoneroComponents.Label {
id: unlockedBalanceLabel
visible: true
text: qsTr("Unlocked balance") + translationManager.emptyString
color: "white"
fontSize: 14
fontSize: 16
id: accountLabel
textWidth: 170
text: currentAccountLabel
color: MoneroComponents.Style.blackTheme ? "white" : "black"
anchors.left: parent.left
anchors.leftMargin: 20
anchors.leftMargin: 60
anchors.top: parent.top
anchors.topMargin: 110
anchors.topMargin: 36
themeTransition: false
}
MoneroComponents.Label {
id: balanceLabel
text: qsTr("Balance") + translationManager.emptyString
color: "white"
fontSize: 14
anchors.left: parent.left
anchors.leftMargin: 20
anchors.top: parent.top
anchors.topMargin: 60
elide: Text.ElideRight
textWidth: 238
MouseArea {
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onClicked: appWindow.showPageRequest("Account")
}
}
MoneroComponents.Label {
fontSize: 16
visible: isSyncing
text: qsTr("Syncing...")
color: MoneroComponents.Style.blackTheme ? "white" : "black"
anchors.left: parent.left
anchors.leftMargin: 20
anchors.bottom: currencyLabel.top
anchors.bottomMargin: 15
themeTransition: false
}
MoneroComponents.TextPlain {
id: currencyLabel
font.pixelSize: 16
text: {
if (persistentSettings.fiatPriceEnabled && persistentSettings.fiatPriceToggle) {
return persistentSettings.fiatPriceCurrency == "xmrusd" ? "USD" : "EUR"
} else {
return "XMR"
}
}
color: MoneroComponents.Style.blackTheme ? "white" : "black"
anchors.left: parent.left
anchors.leftMargin: 20
anchors.top: parent.top
anchors.topMargin: 100
themeTransition: false
MouseArea {
hoverEnabled: true
anchors.fill: parent
visible: persistentSettings.fiatPriceEnabled
cursorShape: Qt.PointingHandCursor
onClicked: persistentSettings.fiatPriceToggle = !persistentSettings.fiatPriceToggle
}
}
MoneroComponents.TextPlain {
id: balancePart1
themeTransition: false
anchors.left: parent.left
anchors.leftMargin: 58
anchors.baseline: currencyLabel.baseline
color: MoneroComponents.Style.blackTheme ? "white" : "black"
text: {
if (persistentSettings.fiatPriceEnabled && persistentSettings.fiatPriceToggle) {
return balanceFiatString.split('.')[0] + "."
} else {
return balanceString.split('.')[0] + "."
}
}
font.pixelSize: {
var defaultSize = 29;
var digits = (balancePart1.text.length - 1)
if (digits > 2 && !(persistentSettings.fiatPriceEnabled && persistentSettings.fiatPriceToggle)) {
return defaultSize - 1.1 * digits
} else {
return defaultSize
}
}
MouseArea {
id: balancePart1MouseArea
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onEntered: {
balancePart1.color = MoneroComponents.Style.orange
balancePart2.color = MoneroComponents.Style.orange
}
onExited: {
balancePart1.color = Qt.binding(function() { return MoneroComponents.Style.blackTheme ? "white" : "black" })
balancePart2.color = Qt.binding(function() { return MoneroComponents.Style.blackTheme ? "white" : "black" })
}
onClicked: {
console.log("Copied to clipboard");
clipboard.setText(balancePart1.text + balancePart2.text);
appWindow.showStatusMessage(qsTr("Copied to clipboard"),3)
}
}
}
MoneroComponents.TextPlain {
id: balancePart2
themeTransition: false
anchors.left: balancePart1.right
anchors.leftMargin: 2
anchors.baseline: currencyLabel.baseline
color: MoneroComponents.Style.blackTheme ? "white" : "black"
text: {
if (persistentSettings.fiatPriceEnabled && persistentSettings.fiatPriceToggle) {
return balanceFiatString.split('.')[1]
} else {
return balanceString.split('.')[1]
}
}
font.pixelSize: 16
MouseArea {
hoverEnabled: true
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
onEntered: balancePart1MouseArea.entered()
onExited: balancePart1MouseArea.exited()
onClicked: balancePart1MouseArea.clicked(mouse)
}
}
Item { //separator
anchors.left: parent.left
anchors.right: parent.right

View file

@ -46,10 +46,6 @@ Rectangle {
property Item currentView
property Item previousView
property string balanceLabelText: qsTr("Balance") + translationManager.emptyString
property string balanceText
property string unlockedBalanceLabelText: qsTr("Unlocked Balance") + translationManager.emptyString
property string unlockedBalanceText
property int minHeight: (appWindow.height > 800) ? appWindow.height : 800
property alias contentHeight: mainFlickable.contentHeight
property alias flickable: mainFlickable

BIN
images/card-background-black.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

BIN
images/card-background-white.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 87 KiB

View file

@ -133,15 +133,3 @@ function capitalize(s){
if (typeof s !== 'string') return ''
return s.charAt(0).toUpperCase() + s.slice(1)
}
function formatMoney(n, c, d, t) {
// https://stackoverflow.com/a/149099
var c = isNaN(c = Math.abs(c)) ? 2 : c,
d = d == undefined ? "." : d,
t = t == undefined ? "," : t,
s = n < 0 ? "-" : "",
i = String(parseInt(n = Math.abs(Number(n) || 0).toFixed(c))),
j = (j = i.length) > 3 ? j % 3 : 0;
return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
};

View file

@ -335,7 +335,6 @@ ApplicationWindow {
}
walletName = usefulName(wallet.path)
updateSyncing(false)
viewOnly = currentWallet.viewOnly;
@ -407,24 +406,22 @@ ApplicationWindow {
if (!currentWallet)
return;
var balance_unlocked = qsTr("HIDDEN");
var balance = qsTr("HIDDEN");
var balance = "?.??";
var balanceU = "?.??";
if(!hideBalanceForced && !persistentSettings.hideBalance){
balance_unlocked = walletManager.displayAmount(currentWallet.unlockedBalance(currentWallet.currentSubaddressAccount));
balance = walletManager.displayAmount(currentWallet.balance(currentWallet.currentSubaddressAccount));
balanceU = walletManager.displayAmount(currentWallet.unlockedBalance(currentWallet.currentSubaddressAccount));
}
middlePanel.unlockedBalanceText = balance_unlocked;
leftPanel.unlockedBalanceText = balance_unlocked;
middlePanel.balanceText = balance;
leftPanel.balanceText = balance;
if (persistentSettings.fiatPriceEnabled) {
appWindow.fiatApiUpdateBalance(balance, balance_unlocked);
appWindow.fiatApiUpdateBalance(balance);
}
var accountLabel = currentWallet.getSubaddressLabel(currentWallet.currentSubaddressAccount, 0);
leftPanel.balanceLabelText = qsTr("Balance (#%1%2)").arg(currentWallet.currentSubaddressAccount).arg(accountLabel === "" ? "" : (" " + accountLabel));
leftPanel.minutesToUnlock = (balance !== balanceU) ? currentWallet.history.minutesToUnlock : "";
leftPanel.currentAccountIndex = currentWallet.currentSubaddressAccount;
leftPanel.currentAccountLabel = currentWallet.getSubaddressLabel(currentWallet.currentSubaddressAccount, 0);
leftPanel.balanceString = balance
leftPanel.balanceUnlockedString = balanceU
}
function onUriHandler(uri){
@ -597,8 +594,6 @@ ApplicationWindow {
foundNewBlock = false;
console.log("New block found - updating history")
currentWallet.history.refresh(currentWallet.currentSubaddressAccount)
var timeToUnlock = currentWallet.history.minutesToUnlock
leftPanel.minutesToUnlockTxt = (timeToUnlock > 0)? (timeToUnlock == 20)? qsTr("Unlocked balance (waiting for block)") : qsTr("Unlocked balance (~%1 min)").arg(timeToUnlock) : qsTr("Unlocked balance");
if(middlePanel.state == "History")
middlePanel.historyView.update();
@ -642,7 +637,7 @@ ApplicationWindow {
}
// Update wallet sync progress
updateSyncing((currentWallet.connected() !== Wallet.ConnectionStatus_Disconnected) && !daemonSynced)
leftPanel.isSyncing = (currentWallet.connected() !== Wallet.ConnectionStatus_Disconnected) && !daemonSynced
// Update transfer page status
middlePanel.updateStatus();
@ -1087,12 +1082,6 @@ ApplicationWindow {
informationPopup.open()
}
function updateSyncing(syncing) {
var text = (syncing ? qsTr("Balance (syncing)") : qsTr("Balance")) + translationManager.emptyString
leftPanel.balanceLabelText = text
middlePanel.balanceLabelText = text
}
// blocks UI if wallet can't be opened or no connection to the daemon
function enableUI(enable) {
middlePanel.enabled = enable;
@ -1127,15 +1116,13 @@ ApplicationWindow {
// close wallet and show wizard
function showWizard(){
clearMoneroCardLabelText();
walletInitialized = false;
closeWallet(function() {
wizard.restart();
wizard.wizardState = "wizardHome";
rootItem.state = "wizard"
// reset balance
leftPanel.balanceText = leftPanel.unlockedBalanceText = walletManager.displayAmount(0);
fiatApiUpdateBalance(0, 0);
clearMoneroCardLabelText();
// disable timers
userInActivityTimer.running = false;
simpleModeConnectionTimer.running = false;
@ -1258,22 +1245,19 @@ ApplicationWindow {
Prices.getJSON(url);
}
function fiatApiUpdateBalance(balance, unlocked_balance){
function fiatApiUpdateBalance(balance){
// update balance card
var ticker = persistentSettings.fiatPriceCurrency === "xmrusd" ? appWindow.fiatPriceXMRUSD : appWindow.fiatPriceXMREUR;
var symbol = persistentSettings.fiatPriceCurrency === "xmrusd" ? "$" : "€"
if(ticker <= 0){
console.log(fiatApiError("Could not update balance card; invalid ticker value"));
leftPanel.unlockedBalanceTextFiat = "N/A";
leftPanel.balanceTextFiat = "N/A";
leftPanel.balanceFiatString = "?.??";
return;
}
var uFiat = Utils.formatMoney(unlocked_balance * ticker);
var bFiat = Utils.formatMoney(balance * ticker);
leftPanel.unlockedBalanceTextFiat = symbol + uFiat;
leftPanel.balanceTextFiat = symbol + bFiat;
var bFiat = "?.??"
if (!hideBalanceForced && !persistentSettings.hideBalance) {
bFiat = (balance * ticker).toFixed(2);
}
leftPanel.balanceFiatString = bFiat;
}
function fiatTimerStart(){
@ -2026,8 +2010,8 @@ ApplicationWindow {
// reset label text. othewise potential privacy leak showing unlock time when switching wallets
function clearMoneroCardLabelText(){
leftPanel.minutesToUnlockTxt = qsTr("Unlocked balance")
leftPanel.balanceLabelText = qsTr("Balance")
leftPanel.balanceString = "?.??"
leftPanel.balanceFiatString = "?.??"
}
// some fields need an extra nudge when changing languages

View file

@ -143,6 +143,14 @@ Rectangle {
}
}
RowLayout {
visible: leftPanel.minutesToUnlock !== ""
MoneroComponents.WarningBox {
text: qsTr("Spendable funds: %1 XMR. Please wait ~%2 minutes for your whole balance to become spendable.").arg(leftPanel.balanceUnlockedString).arg(leftPanel.minutesToUnlock)
}
}
GridLayout {
columns: appWindow.walletMode < 2 ? 1 : 2
Layout.fillWidth: true

View file

@ -111,8 +111,10 @@
<file>components/RemoteNodeEdit.qml</file>
<file>pages/Keys.qml</file>
<file>images/appicon.ico</file>
<file>images/card-background.png</file>
<file>images/card-background@2x.png</file>
<file>images/card-background-black.png</file>
<file>images/card-background-black@2x.png</file>
<file>images/card-background-white.png</file>
<file>images/card-background-white@2x.png</file>
<file>images/moneroLogo_white.png</file>
<file>images/question.png</file>
<file>images/question@2x.png</file>