From e1b78da3e6b45037f8b9dacc4385c02c6c892f7c Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 6 Oct 2016 13:03:01 -0700 Subject: Add custom gas field to send page --- ui/app/components/pending-tx-details.js | 2 ++ ui/app/components/range-slider.js | 63 +++++++++++++++++++++++++++++++++ 2 files changed, 65 insertions(+) create mode 100644 ui/app/components/range-slider.js (limited to 'ui/app/components') diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index d8e8524bf..7fa3d6ddd 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 = txParams.gasMultiplier var gasCost = new BN(ethUtil.stripHexPrefix(txParams.gas || txData.estimatedGas), 16) var gasPrice = new BN(ethUtil.stripHexPrefix(txParams.gasPrice || '0x4a817c800'), 16) + gasPrice = new BN(parseFloat(gasPrice.toString()) * gasMultiplier) 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..6ca6e434e --- /dev/null +++ b/ui/app/components/range-slider.js @@ -0,0 +1,63 @@ +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 props = this.props + const onChange = props.onChange || 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, + defaultValue: defaultValue, + onChange: mirrorInput ? this.mirrorInputs.bind(this, name) : onChange, + }), + + // Mirrored input for range + mirrorInput ? h('input.large-input', { + type: 'number', + name: `${name}Mirror`, + min: min, + max: max, + defaultValue: defaultValue, + step: increment, + style: input, + onChange: this.mirrorInputs.bind(this, `${name}Mirror`), + }) : null, + ]) + ) +} + +RangeSlider.prototype.mirrorInputs = function (active) { + var range = document.querySelector(`input[name="${this.props.name}"]`) + var inputMirror = document.querySelector(`input[name="${this.props.name}Mirror"]`) + if (active === this.props.name) { + inputMirror.value = range.value + } else { + range.value = inputMirror.value + } +} -- cgit v1.2.3 From c400f7c0f6bff13400eedcd80fdc83e572eb42a8 Mon Sep 17 00:00:00 2001 From: Frankie Date: Wed, 12 Oct 2016 19:35:09 -0700 Subject: Fix gasPrice range --- ui/app/components/pending-tx-details.js | 4 ++-- ui/app/components/range-slider.js | 19 +++++++------------ 2 files changed, 9 insertions(+), 14 deletions(-) (limited to 'ui/app/components') diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index 7fa3d6ddd..0f7e20613 100644 --- a/ui/app/components/pending-tx-details.js +++ b/ui/app/components/pending-tx-details.js @@ -29,10 +29,10 @@ PTXP.render = function () { var account = props.accounts[address] var balance = account ? account.balance : '0x0' - var gasMultiplier = txParams.gasMultiplier + 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 = new BN(parseFloat(gasPrice.toString()) * gasMultiplier) + gasPrice = gasPrice.mul(new BN(gasMultiplier * 100)).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 index 6ca6e434e..cc1de1ce5 100644 --- a/ui/app/components/range-slider.js +++ b/ui/app/components/range-slider.js @@ -10,8 +10,9 @@ function RangeSlider () { } RangeSlider.prototype.render = function () { + const state = this.state || {} const props = this.props - const onChange = props.onChange || function () {} + const onInput = props.onInput || function () {} const name = props.name const { min = 0, @@ -33,8 +34,8 @@ RangeSlider.prototype.render = function () { max: max, step: increment, style: range, - defaultValue: defaultValue, - onChange: mirrorInput ? this.mirrorInputs.bind(this, name) : onChange, + value: state.value || defaultValue, + onChange: mirrorInput ? this.mirrorInputs.bind(this, name) : onInput, }), // Mirrored input for range @@ -43,7 +44,7 @@ RangeSlider.prototype.render = function () { name: `${name}Mirror`, min: min, max: max, - defaultValue: defaultValue, + value: state.value || defaultValue, step: increment, style: input, onChange: this.mirrorInputs.bind(this, `${name}Mirror`), @@ -52,12 +53,6 @@ RangeSlider.prototype.render = function () { ) } -RangeSlider.prototype.mirrorInputs = function (active) { - var range = document.querySelector(`input[name="${this.props.name}"]`) - var inputMirror = document.querySelector(`input[name="${this.props.name}Mirror"]`) - if (active === this.props.name) { - inputMirror.value = range.value - } else { - range.value = inputMirror.value - } +RangeSlider.prototype.mirrorInputs = function (active, event) { + this.setState({value: event.target.value}) } -- cgit v1.2.3 From 67eba9f542588f13d37aa5e10c659c93d6e58dc1 Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 13 Oct 2016 16:04:23 -0700 Subject: Specify base 10 in bignumber --- ui/app/components/pending-tx-details.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/app/components') diff --git a/ui/app/components/pending-tx-details.js b/ui/app/components/pending-tx-details.js index 0f7e20613..545302098 100644 --- a/ui/app/components/pending-tx-details.js +++ b/ui/app/components/pending-tx-details.js @@ -32,7 +32,7 @@ PTXP.render = function () { 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)).div(new BN(100, 10)) + 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) -- cgit v1.2.3 From aace26c4bda151c71f9f8c73669e789ac258e9ee Mon Sep 17 00:00:00 2001 From: Frankie Date: Thu, 13 Oct 2016 16:53:32 -0700 Subject: Create callback and Clean-up details --- ui/app/components/range-slider.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'ui/app/components') diff --git a/ui/app/components/range-slider.js b/ui/app/components/range-slider.js index cc1de1ce5..823f5eb01 100644 --- a/ui/app/components/range-slider.js +++ b/ui/app/components/range-slider.js @@ -35,7 +35,7 @@ RangeSlider.prototype.render = function () { step: increment, style: range, value: state.value || defaultValue, - onChange: mirrorInput ? this.mirrorInputs.bind(this, name) : onInput, + onChange: mirrorInput ? this.mirrorInputs.bind(this, event) : onInput, }), // Mirrored input for range @@ -47,12 +47,12 @@ RangeSlider.prototype.render = function () { value: state.value || defaultValue, step: increment, style: input, - onChange: this.mirrorInputs.bind(this, `${name}Mirror`), + onChange: this.mirrorInputs.bind(this, event), }) : null, ]) ) } -RangeSlider.prototype.mirrorInputs = function (active, event) { +RangeSlider.prototype.mirrorInputs = function (event) { this.setState({value: event.target.value}) } -- cgit v1.2.3