diff options
author | Dan <danjm.com@gmail.com> | 2017-11-15 00:04:23 +0800 |
---|---|---|
committer | Dan <danjm.com@gmail.com> | 2017-12-05 10:36:26 +0800 |
commit | 6561e75aa2fb03c77544da3c090ad6ea2883d29a (patch) | |
tree | d2203d198a2c49049fa8eb3d566e2bb00ebcdb45 /old-ui/app/components/range-slider.js | |
parent | 2b1f2557c7dbd589724fd690ec72f789f9650e3c (diff) | |
download | tangerine-wallet-browser-6561e75aa2fb03c77544da3c090ad6ea2883d29a.tar.gz tangerine-wallet-browser-6561e75aa2fb03c77544da3c090ad6ea2883d29a.tar.zst tangerine-wallet-browser-6561e75aa2fb03c77544da3c090ad6ea2883d29a.zip |
Add old-ui directory
Diffstat (limited to 'old-ui/app/components/range-slider.js')
-rw-r--r-- | old-ui/app/components/range-slider.js | 58 |
1 files changed, 58 insertions, 0 deletions
diff --git a/old-ui/app/components/range-slider.js b/old-ui/app/components/range-slider.js new file mode 100644 index 000000000..823f5eb01 --- /dev/null +++ b/old-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}) +} |