openethereum/js/src/views/Dapps/UrlButton/urlButton.js
Jaco Greeff 659cf2bb37 [beta] beta backports (#4763)
* https://mkr-market -> https://oasisdex.com (4701 beta)

* Wallet s/delete/forget/ (beta 4741)
2017-03-04 18:54:11 +01:00

97 lines
2.4 KiB
JavaScript

// Copyright 2015, 2016 Parity Technologies (UK) Ltd.
// This file is part of Parity.
// Parity is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
// Parity is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
import React, { Component, PropTypes } from 'react';
import { FormattedMessage } from 'react-intl';
import { withRouter } from 'react-router';
import Button from '~/ui/Button';
import { LinkIcon } from '~/ui/Icons';
import Input from '~/ui/Form/Input';
import styles from './urlButton.css';
const INPUT_STYLE = { display: 'inline-block', width: '20em' };
class UrlButton extends Component {
static propTypes = {
router: PropTypes.object.isRequired // injected by withRouter
};
state = {
inputShown: false
};
render () {
const { inputShown } = this.state;
return (
<div>
{ inputShown ? this.renderInput() : null }
<Button
className={ styles.button }
icon={ <LinkIcon /> }
label={
<FormattedMessage
id='dapps.button.url.label'
defaultMessage='URL' />
}
onClick={ this.toggleInput }
/>
</div>
);
}
renderInput () {
return (
<Input
hint={
<FormattedMessage
id='dapps.button.url.input'
defaultMessage='https://oasisdex.com' />
}
onBlur={ this.hideInput }
onFocus={ this.showInput }
onSubmit={ this.inputOnSubmit }
style={ INPUT_STYLE }
/>
);
}
toggleInput = () => {
const { inputShown } = this.state;
this.setState({
inputShown: !inputShown
});
}
hideInput = () => {
this.setState({ inputShown: false });
}
showInput = () => {
this.setState({ inputShown: true });
}
inputOnSubmit = (url) => {
const { router } = this.props;
router.push(`/web/${encodeURIComponent(url)}`);
}
}
export default withRouter(UrlButton);