You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
141 lines
3.8 KiB
141 lines
3.8 KiB
const inherits = require('util').inherits
|
|
const Component = require('react').Component
|
|
const h = require('react-hyperscript')
|
|
const connect = require('react-redux').connect
|
|
const actions = require('./actions')
|
|
const util = require('./util')
|
|
const numericBalance = require('./util').numericBalance
|
|
const AccountPanel = require('./components/account-panel')
|
|
const ethUtil = require('ethereumjs-util')
|
|
|
|
module.exports = connect(mapStateToProps)(SendTransactionScreen)
|
|
|
|
function mapStateToProps(state) {
|
|
var result = {
|
|
address: state.appState.currentView.context,
|
|
accounts: state.metamask.accounts,
|
|
identities: state.metamask.identities,
|
|
warning: state.appState.warning,
|
|
}
|
|
|
|
result.account = result.accounts[result.address]
|
|
result.identity = result.identities[result.address]
|
|
result.balance = result.account ? numericBalance(result.account.balance) : null
|
|
|
|
return result
|
|
}
|
|
|
|
inherits(SendTransactionScreen, Component)
|
|
function SendTransactionScreen() {
|
|
Component.call(this)
|
|
}
|
|
|
|
SendTransactionScreen.prototype.render = function() {
|
|
var state = this.props
|
|
var account = state.account
|
|
var identity = state.identity
|
|
|
|
return (
|
|
h('.send-screen.flex-column.flex-grow', [
|
|
|
|
// subtitle and nav
|
|
h('.section-title.flex-row.flex-center', [
|
|
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
|
|
onClick: this.back.bind(this),
|
|
}),
|
|
h('h2.page-subtitle', 'Send Transaction'),
|
|
]),
|
|
|
|
h(AccountPanel, {
|
|
showFullAddress: true,
|
|
identity: identity,
|
|
account: account,
|
|
}),
|
|
|
|
h('section.recipient', [
|
|
h('input.address', {
|
|
placeholder: 'Recipient Address',
|
|
})
|
|
]),
|
|
|
|
h('section.ammount', [
|
|
h('input.ether', {
|
|
placeholder: 'Amount',
|
|
type: 'number',
|
|
style: { marginRight: '6px' }
|
|
}),
|
|
h('select.currency', {
|
|
name: 'currency',
|
|
}, [
|
|
h('option', { value: 'ether' }, 'Ether (1e18 wei)'),
|
|
h('option', { value: 'wei' }, 'Wei'),
|
|
]),
|
|
]),
|
|
|
|
h('section.data', [
|
|
h('details', [
|
|
h('summary', {
|
|
style: {cursor: 'pointer'},
|
|
}, 'Advanced'),
|
|
h('textarea.txData', {
|
|
type: 'textarea',
|
|
placeholder: 'Transaction data (optional)',
|
|
style: {
|
|
height: '100px',
|
|
width: '100%',
|
|
resize: 'none',
|
|
}
|
|
})
|
|
])
|
|
]),
|
|
|
|
h('section', {
|
|
}, [
|
|
h('button', {
|
|
onClick: this.onSubmit.bind(this),
|
|
}, 'Send')
|
|
]),
|
|
|
|
state.warning ? h('span.error', state.warning.split('.')[0]) : null,
|
|
])
|
|
)
|
|
}
|
|
|
|
SendTransactionScreen.prototype.back = function() {
|
|
var address = this.props.address
|
|
this.props.dispatch(actions.backToAccountDetail(address))
|
|
}
|
|
|
|
SendTransactionScreen.prototype.onSubmit = function(event) {
|
|
var recipient = document.querySelector('input.address').value
|
|
|
|
var inputAmount = parseFloat(document.querySelector('input.ether').value)
|
|
var currency = document.querySelector('select.currency').value
|
|
var value = util.normalizeNumberToWei(inputAmount, currency)
|
|
|
|
var balance = this.props.balance
|
|
|
|
if (value.gt(balance)) {
|
|
var message = 'Insufficient funds.'
|
|
return this.props.dispatch(actions.displayWarning(message))
|
|
}
|
|
if (recipient.length !== 42) {
|
|
var message = 'Recipient address is the incorrect length.'
|
|
return this.props.dispatch(actions.displayWarning(message))
|
|
}
|
|
|
|
this.props.dispatch(actions.hideWarning())
|
|
this.props.dispatch(actions.showLoadingIndication())
|
|
|
|
var txParams = {
|
|
to: recipient,
|
|
from: this.props.address,
|
|
value: '0x' + value.toString(16),
|
|
}
|
|
|
|
var txData = document.querySelector('textarea.txData').value
|
|
if (txData) txParams.data = txData
|
|
|
|
this.props.dispatch(actions.signTx(txParams))
|
|
}
|
|
|
|
|