aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--CHANGELOG.md1
-rw-r--r--app/scripts/lib/config-manager.js12
-rw-r--r--app/scripts/lib/id-management.js7
-rw-r--r--app/scripts/lib/idStore.js4
-rw-r--r--app/scripts/metamask-controller.js10
-rw-r--r--ui/app/actions.js14
-rw-r--r--ui/app/components/pending-tx-details.js2
-rw-r--r--ui/app/components/range-slider.js58
-rw-r--r--ui/app/send.js143
9 files changed, 213 insertions, 38 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md
index a3577d46f..21c501edd 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,7 @@
## Current Master
- Fix bug where web3 was being injected into XML files.
+- Add a custom transaction fee field to send form.
## 2.13.3 2016-10-4
diff --git a/app/scripts/lib/config-manager.js b/app/scripts/lib/config-manager.js
index ecc9bc5f7..cced32670 100644
--- a/app/scripts/lib/config-manager.js
+++ b/app/scripts/lib/config-manager.js
@@ -384,3 +384,15 @@ ConfigManager.prototype.createShapeShiftTx = function (depositAddress, depositTy
}
this.setData(data)
}
+
+ConfigManager.prototype.getGasMultiplier = function () {
+ var data = this.getData()
+ return ('gasMultiplier' in data) && data.gasMultiplier
+}
+
+ConfigManager.prototype.setGasMultiplier = function (gasMultiplier) {
+ var data = this.getData()
+
+ data.gasMultiplier = gasMultiplier
+ this.setData(data)
+}
diff --git a/app/scripts/lib/id-management.js b/app/scripts/lib/id-management.js
index 2d42e1e30..421f2105f 100644
--- a/app/scripts/lib/id-management.js
+++ b/app/scripts/lib/id-management.js
@@ -7,6 +7,7 @@
*/
const ethUtil = require('ethereumjs-util')
+const BN = ethUtil.BN
const Transaction = require('ethereumjs-tx')
module.exports = IdManagement
@@ -24,7 +25,13 @@ function IdManagement (opts) {
}
this.signTx = function (txParams) {
+ // calculate gas with custom gas multiplier
+ var gasMultiplier = this.configManager.getGasMultiplier() || 1
+ var gasPrice = new BN(ethUtil.stripHexPrefix(txParams.gasPrice), 16)
+ gasPrice = gasPrice.mul(new BN(gasMultiplier * 100, 10)).div(new BN(100, 10))
+ txParams.gasPrice = ethUtil.intToHex(gasPrice.toNumber())
// normalize values
+
txParams.to = ethUtil.addHexPrefix(txParams.to)
txParams.from = ethUtil.addHexPrefix(txParams.from.toLowerCase())
txParams.value = ethUtil.addHexPrefix(txParams.value)
diff --git a/app/scripts/lib/idStore.js b/app/scripts/lib/idStore.js
index 6837a1e8d..aa77c3360 100644
--- a/app/scripts/lib/idStore.js
+++ b/app/scripts/lib/idStore.js
@@ -112,6 +112,8 @@ IdentityStore.prototype.getState = function () {
currentFiat: configManager.getCurrentFiat(),
conversionRate: configManager.getConversionRate(),
conversionDate: configManager.getConversionDate(),
+ gasMultiplier: configManager.getGasMultiplier(),
+
}))
}
@@ -211,6 +213,7 @@ IdentityStore.prototype.exportAccount = function (address, cb) {
// comes from dapp via zero-client hooked-wallet provider
IdentityStore.prototype.addUnconfirmedTransaction = function (txParams, onTxDoneCb, cb) {
const configManager = this.configManager
+
var self = this
// create txData obj with parameters and meta data
var time = (new Date()).getTime()
@@ -222,6 +225,7 @@ IdentityStore.prototype.addUnconfirmedTransaction = function (txParams, onTxDone
txParams: txParams,
time: time,
status: 'unconfirmed',
+ gasMultiplier: configManager.getGasMultiplier() || 1,
}
console.log('addUnconfirmedTransaction:', txData)
diff --git a/app/scripts/metamask-controller.js b/app/scripts/metamask-controller.js
index 65c5ba58b..8b593d820 100644
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@@ -55,6 +55,7 @@ module.exports = class MetamaskController {
agreeToEthWarning: this.agreeToEthWarning.bind(this),
setTOSHash: this.setTOSHash.bind(this),
checkTOSChange: this.checkTOSChange.bind(this),
+ setGasMultiplier: this.setGasMultiplier.bind(this),
// forward directly to idStore
createNewVault: idStore.createNewVault.bind(idStore),
@@ -377,4 +378,13 @@ module.exports = class MetamaskController {
createShapeShiftTx (depositAddress, depositType) {
this.configManager.createShapeShiftTx(depositAddress, depositType)
}
+
+ setGasMultiplier (gasMultiplier, cb) {
+ try {
+ this.configManager.setGasMultiplier(gasMultiplier)
+ cb()
+ } catch (e) {
+ cb(e)
+ }
+ }
}
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 0cce9065e..1f0d8fc78 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -278,14 +278,16 @@ function signMsg (msgData) {
function signTx (txData) {
return (dispatch) => {
- web3.eth.sendTransaction(txData, (err, data) => {
- dispatch(actions.hideLoadingIndication())
-
+ _accountManager.setGasMultiplier(txData.gasMultiplier, (err) => {
if (err) return dispatch(actions.displayWarning(err.message))
- dispatch(actions.hideWarning())
- dispatch(actions.goHome())
+ web3.eth.sendTransaction(txData, (err, data) => {
+ dispatch(actions.hideLoadingIndication())
+ if (err) return dispatch(actions.displayWarning(err.message))
+ dispatch(actions.hideWarning())
+ dispatch(actions.goHome())
+ })
+ dispatch(this.showConfTxPage())
})
- dispatch(this.showConfTxPage())
}
}
diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js
index d8e8524bf..545302098 100644
--- a/ui/app/components/pending-tx-details.js
+++ b/ui/app/components/pending-tx-details.js
@@ -29,8 +29,10 @@ PTXP.render = function () {
var account = props.accounts[address]
var balance = account ? account.balance : '0x0'
+ var gasMultiplier = txData.gasMultiplier
var gasCost = new BN(ethUtil.stripHexPrefix(txParams.gas || txData.estimatedGas), 16)
var gasPrice = new BN(ethUtil.stripHexPrefix(txParams.gasPrice || '0x4a817c800'), 16)
+ gasPrice = gasPrice.mul(new BN(gasMultiplier * 100), 10).div(new BN(100, 10))
var txFee = gasCost.mul(gasPrice)
var txValue = new BN(ethUtil.stripHexPrefix(txParams.value || '0x0'), 16)
var maxCost = txValue.add(txFee)
diff --git a/ui/app/components/range-slider.js b/ui/app/components/range-slider.js
new file mode 100644
index 000000000..823f5eb01
--- /dev/null
+++ b/ui/app/components/range-slider.js
@@ -0,0 +1,58 @@
+const Component = require('react').Component
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+
+module.exports = RangeSlider
+
+inherits(RangeSlider, Component)
+function RangeSlider () {
+ Component.call(this)
+}
+
+RangeSlider.prototype.render = function () {
+ const state = this.state || {}
+ const props = this.props
+ const onInput = props.onInput || function () {}
+ const name = props.name
+ const {
+ min = 0,
+ max = 100,
+ increment = 1,
+ defaultValue = 50,
+ mirrorInput = false,
+ } = this.props.options
+ const {container, input, range} = props.style
+
+ return (
+ h('.flex-row', {
+ style: container,
+ }, [
+ h('input', {
+ type: 'range',
+ name: name,
+ min: min,
+ max: max,
+ step: increment,
+ style: range,
+ value: state.value || defaultValue,
+ onChange: mirrorInput ? this.mirrorInputs.bind(this, event) : onInput,
+ }),
+
+ // Mirrored input for range
+ mirrorInput ? h('input.large-input', {
+ type: 'number',
+ name: `${name}Mirror`,
+ min: min,
+ max: max,
+ value: state.value || defaultValue,
+ step: increment,
+ style: input,
+ onChange: this.mirrorInputs.bind(this, event),
+ }) : null,
+ ])
+ )
+}
+
+RangeSlider.prototype.mirrorInputs = function (event) {
+ this.setState({value: event.target.value})
+}
diff --git a/ui/app/send.js b/ui/app/send.js
index 009866cf7..97ed29e4a 100644
--- a/ui/app/send.js
+++ b/ui/app/send.js
@@ -9,7 +9,8 @@ const numericBalance = require('./util').numericBalance
const addressSummary = require('./util').addressSummary
const EthBalance = require('./components/eth-balance')
const ethUtil = require('ethereumjs-util')
-
+const RangeSlider = require('./components/range-slider')
+const Tooltip = require('./components/tooltip')
module.exports = connect(mapStateToProps)(SendTransactionScreen)
function mapStateToProps (state) {
@@ -50,7 +51,7 @@ SendTransactionScreen.prototype.render = function () {
// Sender Profile
//
- h('.account-data-subsection.flex-column.flex-grow', {
+ h('.account-data-subsection.flex-row.flex-grow', {
style: {
margin: '0 20px',
},
@@ -59,10 +60,9 @@ SendTransactionScreen.prototype.render = function () {
// header - identicon + nav
h('.flex-row.flex-space-between', {
style: {
- marginTop: 28,
+ marginTop: '15px',
},
}, [
-
// back button
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer.color-orange', {
onClick: this.back.bind(this),
@@ -77,42 +77,53 @@ SendTransactionScreen.prototype.render = function () {
]),
// invisible place holder
- h('i.fa.fa-users.fa-lg.invisible'),
+ h('i.fa.fa-users.fa-lg.invisible', {
+ style: {
+ marginTop: '28px',
+ },
+ }),
]),
// account label
- h('h2.font-medium.color-forest.flex-center', {
- style: {
- paddingTop: 8,
- marginBottom: 8,
- },
- }, identity && identity.name),
- // address and getter actions
- h('.flex-row.flex-center', {
+ h('.flex-column', {
style: {
- marginBottom: 8,
+ marginTop: '10px',
+ alignItems: 'flex-start',
},
}, [
+ h('h2.font-medium.color-forest.flex-center', {
+ style: {
+ paddingTop: '8px',
+ marginBottom: '8px',
+ },
+ }, identity && identity.name),
- h('div', {
+ // address and getter actions
+ h('.flex-row.flex-center', {
style: {
- lineHeight: '16px',
+ marginBottom: '8px',
},
- }, addressSummary(address)),
+ }, [
- ]),
+ h('div', {
+ style: {
+ lineHeight: '16px',
+ },
+ }, addressSummary(address)),
- // balance
- h('.flex-row.flex-center', [
+ ]),
- h(EthBalance, {
- value: account && account.balance,
- }),
+ // balance
+ h('.flex-row.flex-center', [
- ]),
+ h(EthBalance, {
+ value: account && account.balance,
+ }),
+ ]),
+ ]),
]),
//
@@ -123,8 +134,8 @@ SendTransactionScreen.prototype.render = function () {
style: {
background: '#EBEBEB',
color: '#AEAEAE',
- marginTop: 32,
- marginBottom: 16,
+ marginTop: '15px',
+ marginBottom: '16px',
},
}, [
'Send Transaction',
@@ -152,7 +163,7 @@ SendTransactionScreen.prototype.render = function () {
placeholder: 'Amount',
type: 'number',
style: {
- marginRight: 6,
+ marginRight: '6px',
},
dataset: {
persistentFormId: 'tx-amount',
@@ -171,20 +182,19 @@ SendTransactionScreen.prototype.render = function () {
//
// Optional Fields
//
-
h('h3.flex-center.text-transform-uppercase', {
style: {
background: '#EBEBEB',
color: '#AEAEAE',
- marginTop: 16,
- marginBottom: 16,
+ marginTop: '16px',
+ marginBottom: '16px',
},
}, [
'Transactional Data (optional)',
]),
// 'data' field
- h('section.flex-row.flex-center', [
+ h('section.flex-column.flex-center', [
h('input.large-input', {
name: 'txData',
placeholder: '0x01234',
@@ -197,6 +207,73 @@ SendTransactionScreen.prototype.render = function () {
},
}),
]),
+ // custom gasPrice field
+ h('h3.flex-center.text-transform-uppercase', {
+ style: {
+ background: '#EBEBEB',
+ color: '#AEAEAE',
+ marginBottom: '5px',
+ },
+ }, [
+ 'Transaction Fee (optional)',
+ h(Tooltip, {
+ title: `
+ This is used to set the transaction's gas price.
+ Setting it to 100% will use the full recommended value. `,
+ }, [
+ h('i.fa.fa-question-circle', {
+ style: {
+ marginLeft: '5px',
+ },
+ }),
+ ]),
+ ]),
+
+ h('section.flex-column.flex-center', [
+ h('.flex-row', [
+ h(RangeSlider, {
+ name: 'gasInput',
+ options: {
+ mirrorInput: true,
+ defaultValue: 100,
+ min: 80,
+ max: 220,
+ },
+ style: {
+ container: {
+ marginBottom: '16px',
+ },
+ range: {
+ width: '68vw',
+ },
+ input: {
+ width: '5em',
+ marginLeft: '5px',
+ },
+ },
+ }),
+
+ h('div', {
+ style: {
+ fontSize: '12px',
+ paddingTop: '8px',
+ paddingLeft: '5px',
+ },
+ }, '%'),
+ ]),
+ h('.flex-row', {
+ style: {
+ justifyContent: 'space-between',
+ width: '243px',
+ position: 'relative',
+ fontSize: '12px',
+ right: '42px',
+ bottom: '30px',
+ },
+ }, [
+ h('span', 'Cheaper'), h('span', 'Faster'),
+ ]),
+ ]),
])
)
}
@@ -211,11 +288,12 @@ SendTransactionScreen.prototype.back = function () {
this.props.dispatch(actions.backToAccountDetail(address))
}
-SendTransactionScreen.prototype.onSubmit = function () {
+SendTransactionScreen.prototype.onSubmit = function (gasPrice) {
const recipient = document.querySelector('input[name="address"]').value
const input = document.querySelector('input[name="amount"]').value
const value = util.normalizeEthStringToWei(input)
const txData = document.querySelector('input[name="txData"]').value
+ const gasMultiplier = document.querySelector('input[name="gasInput"]').value
const balance = this.props.balance
let message
@@ -239,6 +317,7 @@ SendTransactionScreen.prototype.onSubmit = function () {
var txParams = {
from: this.props.address,
value: '0x' + value.toString(16),
+ gasMultiplier: gasMultiplier * 0.01,
}
if (recipient) txParams.to = ethUtil.addHexPrefix(recipient)
generated by cgit v1.2.3 (git 2.25.1) at 2024-08-24 03:08:19 +0800