aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--ui/app/account-detail.js7
-rw-r--r--ui/app/accounts.js7
-rw-r--r--ui/app/components/eth-balance.js40
-rw-r--r--ui/app/css/index.css9
-rw-r--r--ui/app/send.js32
-rw-r--r--ui/app/util.js25
6 files changed, 98 insertions, 22 deletions
diff --git a/ui/app/account-detail.js b/ui/app/account-detail.js
index 2b58fb239..263e48441 100644
--- a/ui/app/account-detail.js
+++ b/ui/app/account-detail.js
@@ -6,11 +6,11 @@ const connect = require('react-redux').connect
const copyToClipboard = require('copy-to-clipboard')
const actions = require('./actions')
const addressSummary = require('./util').addressSummary
-const formatBalance = require('./util').formatBalance
const ReactCSSTransitionGroup = require('react-addons-css-transition-group')
const AccountPanel = require('./components/account-panel')
const Identicon = require('./components/identicon')
+const EtherBalance = require('./components/eth-balance')
const transactionList = require('./components/transaction-list')
const ExportAccountView = require('./components/account-export')
@@ -118,11 +118,12 @@ AccountDetailScreen.prototype.render = function() {
// balance + send
h('.flex-row.flex-space-between', [
- h('div', {
+ h(EtherBalance, {
+ value: account && account.balance,
style: {
lineHeight: '50px',
},
- }, formatBalance(account && account.balance)),
+ }),
h('button', {
onClick: () => this.props.dispatch(actions.showSendPage()),
diff --git a/ui/app/accounts.js b/ui/app/accounts.js
index 18ba1e67d..e609e7424 100644
--- a/ui/app/accounts.js
+++ b/ui/app/accounts.js
@@ -5,7 +5,7 @@ const connect = require('react-redux').connect
const extend = require('xtend')
const Identicon = require('./components/identicon')
const actions = require('./actions')
-const AccountPanel = require('./components/account-panel')
+const EtherBalance = require('./components/eth-balance')
const valuesFor = require('./util').valuesFor
const addressSummary = require('./util').addressSummary
const formatBalance = require('./util').formatBalance
@@ -108,7 +108,10 @@ AccountsScreen.prototype.render = function() {
h('span', identity.name),
h('span.font-small', addressSummary(identity.address)),
- h('span.font-small', formatBalance(account.balance)),
+ // h('span.font-small', formatBalance(account.balance)),
+ h(EtherBalance, {
+ value: account.balance,
+ }),
]),
diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js
new file mode 100644
index 000000000..3f88ef2d4
--- /dev/null
+++ b/ui/app/components/eth-balance.js
@@ -0,0 +1,40 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const parseBalance = require('../util').parseBalance
+
+module.exports = EthBalanceComponent
+
+inherits(EthBalanceComponent, Component)
+function EthBalanceComponent() {
+ Component.call(this)
+}
+
+EthBalanceComponent.prototype.render = function() {
+ var state = this.props
+ var parsedAmount = parseBalance(state.value)
+ var beforeDecimal = parsedAmount[0]
+ var afterDecimal = parsedAmount[1]
+ var value = beforeDecimal+(afterDecimal ? '.'+afterDecimal : '')
+ var style = state.style
+
+ return (
+
+ h('.ether-balance', {
+ style: style,
+ }, [
+ h('.ether-balance-amount', {
+ style: {
+ display: 'inline',
+ },
+ }, value),
+ h('.ether-balance-label', {
+ style: {
+ display: 'inline',
+ marginLeft: 6,
+ },
+ }, 'ETH'),
+ ])
+
+ )
+}
diff --git a/ui/app/css/index.css b/ui/app/css/index.css
index 75f434da6..060ddce91 100644
--- a/ui/app/css/index.css
+++ b/ui/app/css/index.css
@@ -385,3 +385,12 @@ input.large-input {
letter-spacing: 0.1em;
}
+/* Ether Balance Widget */
+
+.ether-balance-amount {
+ color: #F7861C;
+}
+
+.ether-balance-label {
+ color: #ABA9AA;
+} \ No newline at end of file
diff --git a/ui/app/send.js b/ui/app/send.js
index 56b23ee24..52e56132c 100644
--- a/ui/app/send.js
+++ b/ui/app/send.js
@@ -8,7 +8,7 @@ const util = require('./util')
const numericBalance = require('./util').numericBalance
const formatBalance = require('./util').formatBalance
const addressSummary = require('./util').addressSummary
-const AccountPanel = require('./components/account-panel')
+const EtherBalance = require('./components/eth-balance')
const ethUtil = require('ethereumjs-util')
module.exports = connect(mapStateToProps)(SendTransactionScreen)
@@ -21,6 +21,8 @@ function mapStateToProps(state) {
warning: state.appState.warning,
}
+ result.error = result.warning && result.warning.split('.')[0]
+
result.account = result.accounts[result.address]
result.identity = result.identities[result.address]
result.balance = result.account ? numericBalance(result.account.balance) : null
@@ -106,7 +108,10 @@ SendTransactionScreen.prototype.render = function() {
// balance
h('.flex-row.flex-center', [
- h('div', formatBalance(account && account.balance)),
+ // h('div', formatBalance(account && account.balance)),
+ h(EtherBalance, {
+ value: account && account.balance,
+ })
]),
@@ -127,9 +132,13 @@ SendTransactionScreen.prototype.render = function() {
'Send Transaction',
]),
+ // error message
+ state.error && h('span.error.flex-center', state.error),
+
// 'to' field
h('section.flex-row.flex-center', [
- h('input.address.large-input', {
+ h('input.large-input', {
+ name: 'address',
placeholder: 'Recipient Address',
})
]),
@@ -137,7 +146,8 @@ SendTransactionScreen.prototype.render = function() {
// 'amount' and send button
h('section.flex-row.flex-center', [
- h('input.ether.large-input', {
+ h('input.large-input', {
+ name: 'amount',
placeholder: 'Amount',
type: 'number',
style: {
@@ -171,7 +181,8 @@ SendTransactionScreen.prototype.render = function() {
// 'data' field
h('section.flex-row.flex-center', [
- h('input.txData.large-input', {
+ h('input.large-input', {
+ name: 'txData',
placeholder: '0x01234',
style: {
width: '100%',
@@ -180,8 +191,6 @@ SendTransactionScreen.prototype.render = function() {
}),
]),
- // state.warning ? h('span.error', state.warning.split('.')[0]) : null,
-
])
)
@@ -198,11 +207,10 @@ SendTransactionScreen.prototype.back = function() {
}
SendTransactionScreen.prototype.onSubmit = function(event) {
- var recipient = document.querySelector('input.address').value
+ var recipient = document.querySelector('input[name="address"]').value
- var inputAmount = parseFloat(document.querySelector('input.ether').value)
- var currency = document.querySelector('select.currency').value
- var value = util.normalizeNumberToWei(inputAmount, currency)
+ var inputAmount = parseFloat(document.querySelector('input[name="amount"]').value)
+ var value = util.normalizeNumberToWei(inputAmount, 'ether')
var balance = this.props.balance
@@ -224,7 +232,7 @@ SendTransactionScreen.prototype.onSubmit = function(event) {
value: '0x' + value.toString(16),
}
- var txData = document.querySelector('textarea.txData').value
+ var txData = document.querySelector('input[name="txData"]').value
if (txData) txParams.data = txData
this.props.dispatch(actions.signTx(txParams))
diff --git a/ui/app/util.js b/ui/app/util.js
index 5dbcffa7e..0f3f191aa 100644
--- a/ui/app/util.js
+++ b/ui/app/util.js
@@ -22,6 +22,7 @@ module.exports = {
valuesFor: valuesFor,
addressSummary: addressSummary,
numericBalance: numericBalance,
+ parseBalance: parseBalance,
formatBalance: formatBalance,
dataSize: dataSize,
readableDate: readableDate,
@@ -65,16 +66,30 @@ function weiToEth(bn) {
return eth
}
-var decimalsToKeep = 4
-function formatBalance(balance) {
- if (!balance || balance === '0x0') return 'None'
+// Takes hex, returns [beforeDecimal, afterDecimal]
+function parseBalance(balance, decimalsToKeep) {
+ if (decimalsToKeep === undefined) decimalsToKeep = 4
+ if (!balance || balance === '0x0') return ['0', '']
var wei = numericBalance(balance)
var padded = wei.toString(10)
var len = padded.length
- var nonZeroIndex = padded.match(/[^0]/) && padded.match(/[^0]/).index
+ var match = padded.match(/[^0]/)
+ var nonZeroIndex = match && match.index
var beforeDecimal = padded.substr(nonZeroIndex ? nonZeroIndex : 0, len - 18) || '0'
var afterDecimal = padded.substr(len - 18, decimalsToKeep)
- return `${beforeDecimal}.${afterDecimal} ETH`
+ return [beforeDecimal, afterDecimal]
+}
+
+// Takes wei hex, returns "None" or "${formattedAmount} ETH"
+function formatBalance(balance) {
+ var parsed = parseBalance(balance)
+ var beforeDecimal = parsed[0]
+ var afterDecimal = parsed[1]
+ if (beforeDecimal === '0' && afterDecimal === '') return 'None'
+ var result = beforeDecimal
+ if (afterDecimal) result += '.'+afterDecimal
+ result += ' ETH'
+ return result
}
function dataSize(data) {
generated by cgit v1.2.3 (git 2.25.1) at 2025-01-27 22:45:55 +0800