mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2025-02-17 08:31:23 -05:00
Actually provide every state in world choice
This commit is contained in:
parent
0512b614be
commit
56e16bc0dc
2 changed files with 38 additions and 13 deletions
|
@ -1,8 +1,23 @@
|
|||
module.exports = {};
|
||||
var countries = module.exports.data = require('iso-3166-2').data;
|
||||
|
||||
var asOptions = module.exports.asOptions = Object.keys(countries).map(function (code) {
|
||||
var countryOptions = module.exports.countryOptions = Object.keys(countries).map(function (code) {
|
||||
return {value: code.toLowerCase(), label: countries[code].name};
|
||||
}).sort(function (a, b) {
|
||||
return a.label < b.label ? -1 : 1;
|
||||
});
|
||||
|
||||
var subdivisionOptions =
|
||||
module.exports.subdivisionOptions =
|
||||
Object.keys(countries).reduce(function (subByCountry, code) {
|
||||
subByCountry[code.toLowerCase()] = Object.keys(countries[code].sub).map(function (subCode) {
|
||||
return {
|
||||
value: subCode.toLowerCase(),
|
||||
label: countries[code].sub[subCode].name,
|
||||
type: countries[code].sub[subCode].type
|
||||
};
|
||||
}).sort(function (a, b) {
|
||||
return a.label < b.label ? -1 : 1;
|
||||
});
|
||||
return subByCountry;
|
||||
}, {});
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
var React = require('react');
|
||||
|
||||
var countryOptions = require('../../lib/country-data').asOptions;
|
||||
var countryData = require('../../lib/country-data');
|
||||
|
||||
var Button = require('../../components/forms/button.jsx');
|
||||
var Checkbox = require('../../components/forms/checkbox.jsx');
|
||||
|
@ -110,7 +110,7 @@ module.exports = {
|
|||
<Input disabled={this.state.otherDisabled} name="user.genderOther" type="text" />
|
||||
<Select label="Country"
|
||||
name="user.country"
|
||||
options={countryOptions}
|
||||
options={countryData.countryOptions}
|
||||
value={this.props.defaultCountry}
|
||||
required />
|
||||
<Button type="submit">Next Step</Button>
|
||||
|
@ -217,11 +217,20 @@ module.exports = {
|
|||
getDefaultProps: function () {
|
||||
return {defaultCountry: DEFAULT_COUNTRY};
|
||||
},
|
||||
getInitialState: function () {
|
||||
return {
|
||||
countryChoice: (
|
||||
(this.props.formData.user && this.props.formData.user.country) ||
|
||||
this.props.defaultCountry
|
||||
)
|
||||
};
|
||||
},
|
||||
onChangeCountry: function (field, choice) {
|
||||
this.setState({countryChoice: choice});
|
||||
},
|
||||
render: function () {
|
||||
var stateOptions = ['every','state','in','the','world'].map(function (name) {
|
||||
return {value: name, label: name};
|
||||
});
|
||||
var stateDefault = 'Please select one of...';
|
||||
var stateOptions = countryData.subdivisionOptions[this.state.countryChoice];
|
||||
var stateDefault = 'Please select...';
|
||||
stateOptions = [{label: stateDefault}].concat(stateOptions);
|
||||
return (
|
||||
<FormStep title="Address"
|
||||
|
@ -233,17 +242,18 @@ module.exports = {
|
|||
<Form onValidSubmit={this.props.onNextStep}>
|
||||
<Select label="Country"
|
||||
name="address.country"
|
||||
options={countryOptions}
|
||||
value={
|
||||
(this.props.formData.user && this.props.formData.user.country) ||
|
||||
this.props.defaultCountry
|
||||
}
|
||||
options={countryData.countryOptions}
|
||||
onChange={this.onChangeCountry}
|
||||
value={this.state.countryChoice}
|
||||
required />
|
||||
<Input label="Address Line 1" type="text" name="address.line1" required />
|
||||
<Input label="Address Line 2" type="text" name="address.line2" />
|
||||
<Input label="City" type="text" name="address.city" required />
|
||||
<Input label="ZIP Code" type="text" name="address.zip" required />
|
||||
<Select label="State / Province" name="address.state" options={stateOptions} required />
|
||||
{stateOptions.length > 2 ?
|
||||
<Select label="State / Province" name="address.state" options={stateOptions} required /> :
|
||||
[]
|
||||
}
|
||||
<Button type="submit">Next Step</Button>
|
||||
</Form>
|
||||
</FormStep>
|
||||
|
|
Loading…
Reference in a new issue