1
0
mirror of https://github.com/ascribe/onion.git synced 2024-06-30 21:52:08 +02:00

inputcheckbox and terms checking

This commit is contained in:
diminator 2015-07-27 14:39:19 +02:00
parent 494ab209ca
commit 1504a5b20d
5 changed files with 67 additions and 21 deletions

View File

@ -63,6 +63,7 @@ let Form = React.createClass({
if ('getFormData' in this.props){ if ('getFormData' in this.props){
data = mergeOptionsWithDuplicates(data, this.props.getFormData()); data = mergeOptionsWithDuplicates(data, this.props.getFormData());
} }
console.log(data)
return data; return data;
}, },

View File

@ -173,7 +173,8 @@ let FileUploader = React.createClass({
'X-CSRFToken': getCookie(AppConstants.csrftoken) 'X-CSRFToken': getCookie(AppConstants.csrftoken)
} }
}} }}
localHashing={true} /> multiple={false}
localHashing={false} />
); );
} }
}); });

View File

@ -5,42 +5,42 @@ import React from 'react';
let InputCheckbox = React.createClass({ let InputCheckbox = React.createClass({
propTypes: { propTypes: {
required: React.PropTypes.string.isRequired, required: React.PropTypes.string.isRequired,
defaultValue: React.PropTypes.bool,
children: React.PropTypes.oneOfType([ children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element), React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element React.PropTypes.element
]).isRequired ]).isRequired
}, },
getDefaultProps() {
getInitialState() {
return { return {
show: false required: 'required'
}; };
}, },
handleFocus(event) { getInitialState() {
this.refs.checkbox.getDOMNode().checked = !this.refs.checkbox.getDOMNode().checked; return {
//show: false
// This is calling property.js's method handleChange which value: this.props.defaultValue
// expects an event object };
// Since we don't have a valid one, we'll just manipulate the one we get and send },
// it to handleChange
event.target.value = this.refs.checkbox.getDOMNode().checked; onChange: function(event) {
let newValue = !this.state.value;
event.target.value = newValue;
this.props.onChange(event); this.props.onChange(event);
event.stopPropagation(); event.stopPropagation();
this.setState({value: newValue});
this.setState({
show: this.refs.checkbox.getDOMNode().checked,
value: this.refs.checkbox.getDOMNode().checked
});
}, },
render() { render() {
return ( return (
<span <span
onClick={this.handleFocus} onClick={this.onChange}>
onFocus={this.handleFocus}> <input
<input type="checkbox" ref="checkbox" required="required"/> type="checkbox"
ref="checkbox"
onChange={this.onChange}
checked={this.state.value}/>
<span className="checkbox"> <span className="checkbox">
{this.props.children} {this.props.children}
</span> </span>

View File

@ -20,6 +20,7 @@ import ReactS3FineUploader from './ascribe_uploader/react_s3_fine_uploader';
import CollapsibleParagraph from './ascribe_collapsible/collapsible_paragraph'; import CollapsibleParagraph from './ascribe_collapsible/collapsible_paragraph';
import Form from './ascribe_forms/form'; import Form from './ascribe_forms/form';
import Property from './ascribe_forms/property'; import Property from './ascribe_forms/property';
import InputCheckbox from './ascribe_forms/input_checkbox';
import apiUrls from '../constants/api_urls'; import apiUrls from '../constants/api_urls';
import AppConstants from '../constants/application_constants'; import AppConstants from '../constants/application_constants';
@ -68,8 +69,14 @@ let AccountSettings = React.createClass({
let notification = new GlobalNotificationModel(getLangText('username succesfully updated'), 'success', 5000); let notification = new GlobalNotificationModel(getLangText('username succesfully updated'), 'success', 5000);
GlobalNotificationActions.appendGlobalNotification(notification); GlobalNotificationActions.appendGlobalNotification(notification);
}, },
getFormDataProfile(){
return {'email': this.state.currentUser.email};
},
render() { render() {
let content = <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />; let content = <img src={AppConstants.baseUrl + 'static/img/ascribe_animated_medium.gif'} />;
let profile = null;
if (this.state.currentUser.username) { if (this.state.currentUser.username) {
content = ( content = (
<Form <Form
@ -97,6 +104,41 @@ let AccountSettings = React.createClass({
<hr /> <hr />
</Form> </Form>
); );
profile = (
<Form
url={apiUrls.users_profile}
handleSuccess={this.handleSuccess}
getFormData={this.getFormDataProfile}>
<Property
name="hash_locally"
className="ascribe-settings-property-collapsible-toggle"
style={{paddingBottom: 0}}>
<InputCheckbox
defaultValue={true}
required={false}>
<span>
{' ' + getLangText('Enable hash option for slow connections. ' +
'Computes and uploads a hash of the work instead.')}
</span>
</InputCheckbox>
</Property>
{/*<Property
name='language'
label={getLangText('Choose your Language')}
editable={true}>
<select id="select-lang" name="language">
<option value="fr">
Fran&ccedil;ais
</option>
<option value="en"
selected="selected">
English
</option>
</select>
</Property>*/}
<hr />
</Form>
);
} }
return ( return (
<CollapsibleParagraph <CollapsibleParagraph
@ -104,6 +146,7 @@ let AccountSettings = React.createClass({
show={true} show={true}
defaultExpanded={true}> defaultExpanded={true}>
{content} {content}
{profile}
{/*<Form {/*<Form
url={AppConstants.serverUrl + 'api/users/set_language/'}> url={AppConstants.serverUrl + 'api/users/set_language/'}>
<Property <Property

View File

@ -49,6 +49,7 @@ let apiUrls = {
'users_password_reset_request': AppConstants.apiEndpoint + 'users/request_reset_password/', 'users_password_reset_request': AppConstants.apiEndpoint + 'users/request_reset_password/',
'users_signup': AppConstants.apiEndpoint + 'users/', 'users_signup': AppConstants.apiEndpoint + 'users/',
'users_username': AppConstants.apiEndpoint + 'users/username/', 'users_username': AppConstants.apiEndpoint + 'users/username/',
'users_profile': AppConstants.apiEndpoint + 'users/profile/',
'wallet_settings': AppConstants.apiEndpoint + 'users/wallet_settings/', 'wallet_settings': AppConstants.apiEndpoint + 'users/wallet_settings/',
'whitelabel_settings': AppConstants.apiEndpoint + 'whitelabel/settings/${subdomain}/', 'whitelabel_settings': AppConstants.apiEndpoint + 'whitelabel/settings/${subdomain}/',
'delete_s3_file': AppConstants.serverUrl + 's3/delete/' 'delete_s3_file': AppConstants.serverUrl + 's3/delete/'