Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #23560 from code-dot-org/dtl_candidate_7bc5e393
- Loading branch information
Showing
80 changed files
with
2,235 additions
and
493 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
268 changes: 268 additions & 0 deletions
268
apps/src/code-studio/pd/international_opt_in/InternationalOptIn.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,268 @@ | ||
| import React, {PropTypes} from 'react'; | ||
| import FormController from '../form_components/FormController'; | ||
| import FormComponent from '../form_components/FormComponent'; | ||
| import DatePicker from '../workshop_dashboard/components/date_picker'; | ||
| import moment from 'moment'; | ||
| import {DATE_FORMAT} from '../workshop_dashboard/workshopConstants'; | ||
| import { | ||
| Row, | ||
| Col, | ||
| ControlLabel, | ||
| FormGroup | ||
| } from 'react-bootstrap'; | ||
| import i18n from '@cdo/locale'; | ||
|
|
||
| export default class InternationalOptIn extends FormController { | ||
| static propTypes = { | ||
| accountEmail: PropTypes.string.isRequired, | ||
| labels: PropTypes.object.isRequired | ||
| }; | ||
|
|
||
| /** | ||
| * @override | ||
| */ | ||
| onSuccessfulSubmit(data) { | ||
| window.location = `/pd/international_workshop/${data.id}/thanks`; | ||
| } | ||
|
|
||
| /** | ||
| * @override | ||
| */ | ||
| serializeFormData() { | ||
| const formData = super.serializeFormData(); | ||
| formData.form_data.email = this.props.accountEmail; | ||
| return formData; | ||
| } | ||
|
|
||
| /** | ||
| * @override | ||
| */ | ||
| getPageComponents() { | ||
| return [ | ||
| InternationalOptInComponent | ||
| ]; | ||
| } | ||
|
|
||
| /** | ||
| * @override | ||
| */ | ||
| getPageProps() { | ||
| return { | ||
| ...super.getPageProps(), | ||
| accountEmail: this.props.accountEmail, | ||
| labels: this.props.labels | ||
| }; | ||
| } | ||
| } | ||
|
|
||
|
|
||
| class InternationalOptInComponent extends FormComponent { | ||
| static propTypes = { | ||
| accountEmail: PropTypes.string.isRequired | ||
| }; | ||
|
|
||
| handleDateChange = (date) => { | ||
| // Don't allow null. If the date is cleared, default again to today. | ||
| date = date || moment(); | ||
| super.handleChange({date: date.format(DATE_FORMAT)}); | ||
| }; | ||
|
|
||
| render() { | ||
| const labels = this.props.labels; | ||
| const date = (this.props.data && this.props.data.date) ? | ||
| moment(this.props.data.date, DATE_FORMAT) : moment(); | ||
|
|
||
| const lastSubjectsKey = this.props.options.subjects.slice(-1)[0]; | ||
| const textFieldMapSubjects = {[lastSubjectsKey]: "other"}; | ||
|
|
||
| const lastResourcesKey = this.props.options.resources.slice(-1)[0]; | ||
| const textFieldMapResources = {[lastResourcesKey]: "other"}; | ||
|
|
||
| const lastRoboticsKey = this.props.options.robotics.slice(-1)[0]; | ||
| const textFieldMapRobotics = {[lastRoboticsKey]: "other"}; | ||
|
|
||
| return ( | ||
| <FormGroup> | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'firstName', | ||
| label: labels.firstName, | ||
| type: 'text', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'firstNamePreferred', | ||
| label: labels.firstNamePreferred, | ||
| type: 'text', | ||
| required: false | ||
| }) | ||
| } | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'lastName', | ||
| label: labels.lastName, | ||
| type: 'text', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'email', | ||
| label: labels.email, | ||
| type: 'text', | ||
| value: this.props.accountEmail, | ||
| readOnly: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'emailAlternate', | ||
| label: labels.emailAlternate, | ||
| type: 'text' | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsFromOptions({ | ||
| name: 'gender', | ||
| label: labels.gender, | ||
| type: 'radio', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'schoolName', | ||
| label: labels.schoolName, | ||
| type: 'text', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildFieldGroup({ | ||
| name: 'schoolCity', | ||
| label: labels.schoolCity, | ||
| type: 'text', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsFromOptions({ | ||
| name: 'schoolCountry', | ||
| label: labels.schoolCountry, | ||
| type: 'radio', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsFromOptions({ | ||
| name: 'ages', | ||
| label: labels.ages, | ||
| type: 'check', | ||
| required: true | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsWithAdditionalTextFieldsFromOptions({ | ||
| name: 'subjects', | ||
| label: labels.subjects, | ||
| type: 'check', | ||
| required: true, | ||
| textFieldMap: textFieldMapSubjects | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsWithAdditionalTextFieldsFromOptions({ | ||
| name: 'resources', | ||
| label: labels.resources, | ||
| type: 'check', | ||
| required: false, | ||
| textFieldMap: textFieldMapResources | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsWithAdditionalTextFieldsFromOptions({ | ||
| name: 'robotics', | ||
| label: labels.robotics, | ||
| type: 'check', | ||
| required: false, | ||
| textFieldMap: textFieldMapRobotics | ||
| }) | ||
| } | ||
|
|
||
| <FormGroup | ||
| id="date" | ||
| controlId="date" | ||
| validationState={this.getValidationState("date")} | ||
| > | ||
| <Row> | ||
| <Col md={6}> | ||
| <ControlLabel> | ||
| Date | ||
| <span style={{color: 'red'}}> *</span> | ||
| </ControlLabel> | ||
| </Col> | ||
| </Row> | ||
| <Row> | ||
| <Col md={6}> | ||
| <DatePicker | ||
| date={date} | ||
| minDate={moment()} | ||
| onChange={this.handleDateChange} | ||
| readOnly={false} | ||
| /> | ||
| </Col> | ||
| </Row> | ||
| </FormGroup> | ||
| { | ||
| this.buildSelectFieldGroupFromOptions({ | ||
| name: 'workshopOrganizer', | ||
| label: labels.workshopOrganizer, | ||
| required: true, | ||
| placeholder: i18n.selectAnOption() | ||
| }) | ||
| } | ||
| { | ||
| this.buildSelectFieldGroupFromOptions({ | ||
| name: 'workshopFacilitator', | ||
| label: labels.workshopFacilitator, | ||
| required: true, | ||
| placeholder: i18n.selectAnOption() | ||
| }) | ||
| } | ||
| { | ||
| this.buildSelectFieldGroupFromOptions({ | ||
| name: 'workshopCourse', | ||
| label: labels.workshopCourse, | ||
| required: true, | ||
| placeholder: i18n.selectAnOption() | ||
| }) | ||
| } | ||
| { | ||
| this.buildButtonsFromOptions({ | ||
| name: 'emailOptIn', | ||
| label: labels.emailOptIn, | ||
| type: 'radio', | ||
| required: true, | ||
| placeholder: i18n.selectAnOption() | ||
| }) | ||
| } | ||
| { | ||
| this.buildSingleCheckbox({ | ||
| name: 'legalOptIn', | ||
| label: labels.legalOptIn, | ||
| required: true | ||
| }) | ||
| } | ||
| </FormGroup> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| InternationalOptInComponent.associatedFields = [ | ||
| 'firstName', 'firstNamePreferred', 'lastName', 'email', 'emailAlternate', 'gender', | ||
| 'schoolName', 'schoolCity', 'schoolCountry', 'ages', 'subjects', 'resources', | ||
| 'robotics', 'workshopOrganizer', 'workshopFacilitator', 'workshopCourse', | ||
| 'emailOptIn', 'legalOptIn' | ||
| ]; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.