1
0
mirror of https://github.com/ascribe/onion.git synced 2025-01-09 05:06:59 +01:00

refactor input checkbox

This commit is contained in:
Tim Daubenschütz 2015-07-28 12:03:45 +02:00
parent b530018dda
commit 09ce4de29d
4 changed files with 28 additions and 18 deletions

View File

@ -123,7 +123,8 @@ let SignupForm = React.createClass({
name="terms"
className="ascribe-settings-property-collapsible-toggle"
style={{paddingBottom: 0}}>
<InputCheckbox>
<InputCheckbox
defaultChecked={true}>
<span>
{' ' + getLangText('I agree to the Terms of Service') + ' '}
(<a href="https://www.ascribe.io/terms" target="_blank" style={{fontSize: '0.9em', color: 'rgba(0,0,0,0.7)'}}>

View File

@ -4,35 +4,40 @@ import React from 'react';
let InputCheckbox = React.createClass({
propTypes: {
required: React.PropTypes.string.isRequired,
defaultValue: React.PropTypes.bool,
required: React.PropTypes.bool,
defaultChecked: React.PropTypes.bool,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element
]).isRequired
},
getDefaultProps() {
return {
required: 'required'
};
},
getInitialState() {
return {
//show: false
value: this.props.defaultValue
value: this.props.defaultChecked
};
},
onChange: function(event) {
let newValue = !this.state.value;
event.target.value = newValue;
this.props.onChange(event);
event.stopPropagation();
this.setState({value: newValue});
componentDidMount() {
this.props.onChange({
target: {
value: this.state.value
}
});
},
onChange() {
let value = !this.refs.checkbox.getDOMNode().checked;
this.setState({value: value});
this.props.onChange({
target: {
value: value
}
});
},
render() {
console.log(this.state.value);
return (
<span
onClick={this.onChange}>
@ -40,7 +45,8 @@ let InputCheckbox = React.createClass({
type="checkbox"
ref="checkbox"
onChange={this.onChange}
checked={this.state.value}/>
checked={this.state.value}
defaultChecked={this.props.defaultChecked}/>
<span className="checkbox">
{this.props.children}
</span>

View File

@ -39,6 +39,9 @@ let Property = React.createClass({
getInitialState() {
return {
// Please don't confuse initialValue with react's defaultValue.
// initialValue is set by us to ensure that a user can reset a specific
// property (after editing) to its initial value
initialValue: null,
value: null,
isFocused: false,

View File

@ -115,7 +115,7 @@ let AccountSettings = React.createClass({
className="ascribe-settings-property-collapsible-toggle"
style={{paddingBottom: 0}}>
<InputCheckbox
defaultValue={this.state.currentUser.profile.hash_locally}>
defaultChecked={this.state.currentUser.profile.hash_locally}>
<span>
{' ' + getLangText('Enable hash option for slow connections. ' +
'Computes and uploads a hash of the work instead.')}