Commit 7efc6960dc2138f6f45d130c2773958d29f0f7f2

Authored by anuj_thakur
1 parent ca09f14938
Exists in master

navigation fixes

... ... @@ -14,13 +14,16 @@
14 14 type='text/css'
15 15 />
16 16  
  17 + <link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
  18 +
17 19 <link href="css/assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
18 20 <link href="css/assets/css/bootstrap.css" rel="stylesheet" type="text/css">
19 21 <link href="css/assets/css/core.css" rel="stylesheet" type="text/css">
20 22 <link href="css/assets/css/components.css" rel="stylesheet" type="text/css">
21 23 <link href="css/assets/css/colors.css" rel="stylesheet" type="text/css">
  24 + <link href="css/assets/css/custom.css" rel="stylesheet" type="text/css">
22 25 <link href="https://fonts.googleapis.com/css?family=Alef" rel='stylesheet'>
23   -
  26 +
24 27 <link
25 28 href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"
26 29 rel="stylesheet"
... ...
client/stylesheets/custom.css
... ... @@ -0,0 +1,6 @@
  1 +body
  2 +{
  3 + background: -webkit-linear-gradient(#00b395, #00cdaa);
  4 + background: -o-linear-gradient(#00b395, #00cdaa);
  5 + background: linear-gradient(#00b395, #00cdaa);
  6 +}
... ...
imports/client/layouts/NonOrgApp.css
... ... @@ -0,0 +1,14 @@
  1 +.brand-style
  2 +{
  3 + color:#00b395 !important;
  4 + font-size: x-large;
  5 + margin-left: -45px !important;
  6 + font-family: 'Ubuntu', sans-serif;
  7 +}
  8 +
  9 +.navbar-default .navbar-nav > li > a
  10 +{
  11 + color:#00b395 !important;
  12 + font-family: 'Ubuntu', sans-serif;
  13 + font-size: larger;
  14 +}
... ...
imports/client/layouts/NonOrgApp.js
1 1 import React, { Component } from 'react';
2 2 import { Grid } from 'react-bootstrap';
  3 +import { Link } from 'react-router';
  4 +import { Row, Col, FormGroup,
  5 + ControlLabel, FormControl,
  6 + InputGroup, Button,
  7 + Navbar,Modal, Nav, NavItem,
  8 + Glyphicon, Collapse,
  9 + NavbarToggler, NavbarBrand,
  10 + NavLink, DropdownItem, DropdownToggle, DropdownMenu,
  11 + NavDropdown, MenuItem } from 'react-bootstrap';
  12 +import { LinkContainer } from 'react-router-bootstrap';
  13 +import './NonOrgApp.css';
3 14 /**
4 15 * user based redirection will take place here
5 16 */
... ... @@ -13,6 +24,21 @@ import { Grid } from &#39;react-bootstrap&#39;;
13 24 render(){
14 25 return (
15 26 <div>
  27 + <Navbar>
  28 + <Navbar.Header>
  29 + <Navbar.Brand className='brand-style'>
  30 + <Link to="/">YOUNGDESK</Link>
  31 + </Navbar.Brand>
  32 + <Navbar.Toggle />
  33 + </Navbar.Header>
  34 + <Navbar.Collapse>
  35 + <Nav pullRight>
  36 + <LinkContainer to="login" >
  37 + <NavItem className='nav-item' eventKey={ 2 } href="/login">Log in</NavItem>
  38 + </LinkContainer>
  39 + </Nav>
  40 + </Navbar.Collapse>
  41 + </Navbar>
16 42 <Grid>
17 43 { this.props.children }
18 44 </Grid>
... ...
imports/client/views/core/DatePicker.js
... ... @@ -0,0 +1,34 @@
  1 +import React, { Component, PropTypes } from 'react'
  2 +import $ from 'jquery'
  3 +import 'jquery-ui/ui/widgets/datepicker'
  4 +
  5 +class DatePicker extends Component {
  6 + componentDidMount() {
  7 + $('.datepicker').datepicker({
  8 + changeMonth: true,
  9 + changeYear: true,
  10 + showButtonPanel: true,
  11 + yearRange: '-116:+34',
  12 + dateFormat: 'dd/mm/yy'
  13 + });
  14 + }
  15 +
  16 + render() {
  17 + return (
  18 + <input
  19 + type="text"
  20 + className="datepicker form-control"
  21 + placeholder="DD-MM-YYYY"
  22 + onChange={this.props.onChange}
  23 + value={this.props.value}
  24 + />
  25 + )
  26 + }
  27 +}
  28 +
  29 +DatePicker.propTypes = {
  30 + value: PropTypes.string.isRequired,
  31 + onChange: PropTypes.func.isRequired,
  32 +}
  33 +
  34 +export default DatePicker
... ...
imports/client/views/core/ErrorLabel.js
... ... @@ -0,0 +1,15 @@
  1 +import React, { PropTypes } from 'react'
  2 +
  3 +const ErrorLabel = props => (
  4 + <label
  5 + className="validation-error-label"
  6 + >
  7 + {props.children}
  8 + </label>
  9 +)
  10 +
  11 +ErrorLabel.propTypes = {
  12 + children: PropTypes.any.isRequired,
  13 +}
  14 +
  15 +export default ErrorLabel
... ...
imports/client/views/core/Form.js
... ... @@ -0,0 +1,151 @@
  1 +import React, { Component, PropTypes } from 'react'
  2 +import isEqual from 'lodash/isEqual'
  3 +import get from 'lodash/get'
  4 +import cloneDeep from 'lodash/cloneDeep'
  5 +import set from 'lodash/set'
  6 +
  7 +// github.com/smalldots
  8 +class Form extends Component {
  9 + constructor(props) {
  10 + super(props)
  11 + this.state = {
  12 + values: props.initialValues || {},
  13 + dirtyValues: [],
  14 + submitted: false
  15 + }
  16 + this.isPristine = this.isPristine.bind(this)
  17 + this.isDirty = this.isDirty.bind(this)
  18 + this.isSubmitted = this.isSubmitted.bind(this)
  19 + this.getValue = this.getValue.bind(this)
  20 + this.setValue = this.setValue.bind(this)
  21 + this.setPristine = this.setPristine.bind(this)
  22 + this.setDirty = this.setDirty.bind(this)
  23 + this.resetSubmitted = this.resetSubmitted.bind(this)
  24 + }
  25 +
  26 + componentWillReceiveProps(nextProps) {
  27 + if (!isEqual(this.props.initialValues, nextProps.initialValues)) {
  28 + this.setState(prevState => ({
  29 + values: { ...nextProps.initialValues, ...prevState.values }
  30 + }))
  31 + }
  32 + }
  33 +
  34 + isPristine(path) {
  35 + if (path) {
  36 + return !this.state.dirtyValues.find(dirtyValue => dirtyValue === path)
  37 + }
  38 + return !this.state.dirtyValues.length
  39 + }
  40 +
  41 + isDirty(path) {
  42 + return !this.isPristine(path)
  43 + }
  44 +
  45 + isSubmitted() {
  46 + return this.state.submitted
  47 + }
  48 +
  49 + resetSubmitted() {
  50 + this.setState({ submitted: false })
  51 + }
  52 +
  53 + getValue(path) {
  54 + if (!path) {
  55 + throw new Error(`getValue() requires a path`)
  56 + }
  57 + return get(this.state.values, path, '')
  58 + }
  59 +
  60 + setValue (path, value) {
  61 + if (!path) {
  62 + throw new Error(`setValue() requires a path`)
  63 + }
  64 + if (value === undefined) {
  65 + throw new Error(`setValue() requires a non-undefined value`)
  66 + }
  67 + this.setState(prevState => {
  68 + const prevValues = prevState.values
  69 + // Lo-Dash's set() mutates the original value, so we need to make a copy
  70 + const prevValuesCopy = cloneDeep(prevValues)
  71 + const nextValues = set(prevValuesCopy, path, value)
  72 + return { values: nextValues }
  73 + })
  74 + this.setDirty(path)
  75 + }
  76 +
  77 + setPristine(path) {
  78 + if (!path) {
  79 + throw new Error(`setPristine() requires a path`)
  80 + }
  81 + this.setState(prevState => ({
  82 + dirtyValues: (
  83 + this.isPristine(path)
  84 + ? prevState.dirtyValues
  85 + : prevState.dirtyValues.filter(dirtyValue => dirtyValue !== path)
  86 + )
  87 + }))
  88 + }
  89 +
  90 + setDirty(path) {
  91 + if (!path) {
  92 + throw new Error(`setDirty() requires a path`)
  93 + }
  94 + this.setState(prevState => ({
  95 + dirtyValues: (
  96 + this.isDirty(path)
  97 + ? prevState.dirtyValues
  98 + : [...prevState.dirtyValues, path]
  99 + )
  100 + }))
  101 + }
  102 +
  103 + reset() {
  104 + this.setState({
  105 + values: this.props.initialValues,
  106 + dirtyValues: [],
  107 + submitted: false
  108 + })
  109 + }
  110 +
  111 + handleSubmit(event) {
  112 + if (event) {
  113 + event.preventDefault()
  114 + }
  115 + this.setState({ submitted: true })
  116 + if (this.props.onSubmit) {
  117 + this.props.onSubmit(this.state.values)
  118 + }
  119 + }
  120 +
  121 + render() {
  122 + // eslint-disable-next-line
  123 + const { initialValues, children, ...rest } = this.props
  124 + return (
  125 + <form {...rest} onSubmit={this.handleSubmit}>
  126 + {children({
  127 + values: this.state.values,
  128 + isPristine: this.isPristine,
  129 + isDirty: this.isDirty,
  130 + isSubmitted: this.isSubmitted,
  131 + getValue: this.getValue,
  132 + setValue: this.setValue,
  133 + setPristine: this.setPristine,
  134 + setDirty: this.setDirty,
  135 + reset: this.reset,
  136 + resetSubmitted: this.resetSubmitted
  137 + })}
  138 + </form>
  139 + )
  140 + }
  141 +}
  142 +
  143 +Form.propTypes = {
  144 + initialValues: PropTypes.object,
  145 + onSubmit: PropTypes.func,
  146 + children: PropTypes.func.isRequired
  147 +}
  148 +
  149 +Form.defaultProps = { initialValues: {} }
  150 +
  151 +export default Form
... ...
imports/client/views/core/Label.js
... ... @@ -0,0 +1,17 @@
  1 +import React, { PropTypes } from 'react'
  2 +
  3 +const Label = props => (
  4 + <label>
  5 + {props.children} {' '}
  6 + {props.required && (
  7 + <span className="text-danger">*</span>
  8 + )}
  9 + </label>
  10 +)
  11 +
  12 +Label.propTypes = {
  13 + children: PropTypes.string.isRequired,
  14 + required: PropTypes.bool,
  15 +}
  16 +
  17 +export default Label
... ...
imports/client/views/core/Stepper.js
... ... @@ -0,0 +1,21 @@
  1 +import React, { PropTypes } from 'react'
  2 +
  3 +const Stepper = props => (
  4 + <ul className="stepy-header">
  5 + {props.steps.map((step, index) => (
  6 + <li key={step.label} className={step.active && 'stepy-active'}>
  7 + <div>{index + 1}</div>
  8 + {step.label}
  9 + </li>
  10 + ))}
  11 + </ul>
  12 +)
  13 +
  14 +Stepper.propTypes = {
  15 + steps: PropTypes.arrayOf(PropTypes.shape({
  16 + label: PropTypes.string.isRequired,
  17 + active: PropTypes.bool.isRequired,
  18 + }))
  19 +}
  20 +
  21 +export default Stepper
... ...
imports/client/views/core/Validator.js
... ... @@ -0,0 +1,48 @@
  1 +import { Component, PropTypes } from 'react'
  2 +import isArray from 'lodash/isArray'
  3 +import get from 'lodash/get'
  4 +
  5 +class Validator extends Component {
  6 + constructor(props) {
  7 + super(props)
  8 + this.getErrors = this.getErrors.bind(this)
  9 + }
  10 +
  11 + getErrors() {
  12 + if (!this.props.validations) {
  13 + return null
  14 + }
  15 + const errors = Object.keys(this.props.validations).reduce((result, path) => {
  16 + const validations = this.props.validations[path]
  17 + if (!isArray(validations)) {
  18 + throw new Error(`validations[${path}] should be an array`)
  19 + }
  20 + return {
  21 + ...result,
  22 + [path]: validations.map((validation, index) => {
  23 + if (typeof validation !== 'function') {
  24 + throw new Error(`validations[${path}][${index}] should be a function`)
  25 + }
  26 + const error = validation(get(this.props.values, path, ''), this.props.values, path)
  27 + if (error && typeof error !== 'string') {
  28 + throw new Error(`validations[${path}][${index}] should return a string`)
  29 + }
  30 + return error
  31 + }).find(error => error) || null
  32 + }
  33 + }, {})
  34 + return Object.keys(errors).find(path => errors[path]) ? errors : null
  35 + }
  36 +
  37 + render() {
  38 + return this.props.children({ errors: this.getErrors() })
  39 + }
  40 +}
  41 +
  42 +Validator.propTypes = {
  43 + validations: PropTypes.object,
  44 + values: PropTypes.object,
  45 + children: PropTypes.func.isRequired
  46 +}
  47 +
  48 +export default Validator
... ...
imports/client/views/core/validations.js
... ... @@ -0,0 +1,14 @@
  1 +export const isRequired = (fieldName, value) => {
  2 + if (!value) {
  3 + return fieldName ? `${fieldName} is required` : 'Required'
  4 + }
  5 +}
  6 +
  7 +export const minLength = minLength => {
  8 + return value => value && value.length < minLength && `Min. length: ${minLength}`
  9 +}
  10 +
  11 +export const isValidEmail = value => {
  12 + const exR = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
  13 + return !exR.test(value) && 'Please use a valid email'
  14 +}
... ...
imports/client/views/nonOrg/enter/SignupView.js
1   -import React from 'react';
2   -import { Link } from 'react-router';
3   -import { Row, Col, FormGroup,
4   - ControlLabel, FormControl,
5   - InputGroup, Button } from 'react-bootstrap';
6   -import handleSignup from './signup';
7   -import { Orgs } from '/imports/collections/orgs/index';
8   -import './signup.css';
9   -
10   -export default class Signup extends React.Component {
11   - constructor(props) {
12   - super(props);
13   - this.state = {
14   - orgSlug: ""
15   - };
16   - }
17   - componentWillMount(){
18   - Meteor.subscribe('allOrgsSlug');
19   - }
20   -
21   - componentDidMount() {
22   - handleSignup({ component: this });
23   - }
24   - handleChange(e) {
25   - this.setState({ orgSlug: e.target.value });
26   - }
27   - handleSubmit(event) {
28   - event.preventDefault();
29   - }
30   - checkExistingOrgSlug() {
31   - if(this.state.orgSlug==""){return null}
32   - searchOrg = Orgs.find({slug:this.state.orgSlug}).fetch();
33   - if(searchOrg.length>0){
34   - return "error"
35   - }else{
36   - return "success"
37   - }
38   - }
39   - render() {
40   - return (
41   - <div className="Signup">
42   - <Row>
43   - <Col md={ 12 }>
44   - <h4 className="page-header">Sign Up</h4>
45   - <form
46   - ref={ form => (this.signupForm = form) }
47   - onSubmit={ this.handleSubmit }
48   - >
49   - <Row>
50   - <Col xs={ 10 } sm={ 10 }>
51   - <FormGroup controlId="orgSlugField" validationState={this.checkExistingOrgSlug()}>
52   - <ControlLabel>Organisation URL</ControlLabel>
53   - <InputGroup>
54   - <FormControl
55   - type ="text"
56   - ref ="orgSlug"
57   - name ="orgSlug"
58   - placeholder ="Organisation URL"
59   - onChange = {(e) => this.handleChange(e)}
60   - />
61   - <InputGroup.Addon>@yd.com</InputGroup.Addon>
62   - </InputGroup>
63   - </FormGroup>
64   - </Col>
65   - </Row>
66   - <Row>
67   - <Col xs={ 6 } sm={ 6 }>
68   - <FormGroup>
69   - <ControlLabel>Organisation Name</ControlLabel>
70   - <FormControl
71   - type="text"
72   - ref="orgName"
73   - name="orgName"
74   - placeholder="Organisation Name"
75   - />
76   - </FormGroup>
77   - </Col>
78   - </Row>
79   - <Row>
80   - <Col xs={ 6 } sm={ 6 }>
81   - <FormGroup>
82   - <ControlLabel>First Name</ControlLabel>
83   - <FormControl
84   - type="text"
85   - ref="firstName"
86   - name="firstName"
87   - placeholder="First Name"
88   - />
89   - </FormGroup>
90   - </Col>
91   - <Col xs={ 6 } sm={ 6 }>
92   - <FormGroup>
93   - <ControlLabel>Last Name</ControlLabel>
94   - <FormControl
95   - type="text"
96   - ref="lastName"
97   - name="lastName"
98   - placeholder="Last Name"
99   - />
100   - </FormGroup>
101   - </Col>
102   - </Row>
103   - <FormGroup>
104   - <ControlLabel>Email Address</ControlLabel>
105   - <FormControl
106   - type="text"
107   - ref="emailAddress"
108   - name="emailAddress"
109   - placeholder="Email Address"
110   - />
111   - </FormGroup>
112   - <FormGroup>
113   - <ControlLabel>Password</ControlLabel>
114   - <FormControl
115   - type="password"
116   - ref="password"
117   - name="password"
118   - placeholder="Password"
119   - />
120   - </FormGroup>
121   - {/* <Col md={12} */}
122   - <Button type="submit" style={{float: 'right'}} bsStyle="success">Sign Up</Button>
123   -
124   - </form>
125   - </Col>
126   - </Row>
127   - </div>
128   - );
129   - }
130   -}
  1 +import React from 'react';
  2 +import { Link } from 'react-router';
  3 +import { Icon } from '/imports/client/components/Icon';
  4 +import { LinkContainer } from 'react-router-bootstrap';
  5 +import { Row, Col, FormGroup,
  6 + ControlLabel, FormControl,
  7 + InputGroup, Button,
  8 + Navbar,Modal, Nav, NavItem,
  9 + Glyphicon, Collapse,
  10 + NavbarToggler, NavbarBrand,
  11 + NavLink, DropdownItem, DropdownToggle, DropdownMenu,
  12 + NavDropdown, MenuItem } from 'react-bootstrap';
  13 +import handleSignup from './signup';
  14 +import { Orgs } from '/imports/collections/orgs/index';
  15 +import { Meteor } from 'meteor/meteor';
  16 +
  17 +import './signup.css';
  18 +
  19 +export default class Signup extends React.Component {
  20 + constructor(props) {
  21 + super(props);
  22 + this.state = {
  23 + orgSlug: ""
  24 + };
  25 + }
  26 + componentWillMount(){
  27 + Meteor.subscribe('allOrgsSlug');
  28 + }
  29 +
  30 + componentDidMount() {
  31 + handleSignup({ component: this });
  32 + }
  33 + handleChange(e) {
  34 + this.setState({ orgSlug: e.target.value });
  35 + }
  36 + handleSubmit(event) {
  37 + event.preventDeult();
  38 + }
  39 + checkExistingOrgSlug() {
  40 + if(this.state.orgSlug==""){return null}
  41 + searchOrg = Orgs.find({slug:this.state.orgSlug}).fetch();
  42 + if(searchOrg.length>0){
  43 + return "error"
  44 + }else{
  45 + return "success"
  46 + }
  47 + }
  48 +
  49 + render()
  50 + {
  51 + // const {user, org} = this.props.data;
  52 + return(
  53 + <div>
  54 + <div className="wrapper">
  55 + <div className="Content">
  56 + <Row>
  57 + <Col md={ 12 }>
  58 + <h1>Welcome to YoungDesk!!!</h1>
  59 +
  60 + <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
  61 + incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation
  62 + ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit
  63 + in voluptate velit esse cillum dolore eu fugiat nulla pariatur.Excepteur sint occaecat cupidatat non proident,
  64 + sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
  65 + </Col>
  66 + </Row>
  67 + <Row>
  68 + <Col>
  69 + <br></br>
  70 + <br></br>
  71 + </Col>
  72 + </Row>
  73 + <Row>
  74 + <Col md={ 3 }>
  75 + <div className="service-box">
  76 + <i className="fa fa-4x fa-diamond"></i>
  77 + <h6>Lorem Ipsum</h6>
  78 + </div>
  79 + </Col>
  80 + <Col md={ 3 }>
  81 + <div className="service-box">
  82 + <i className="fa fa-4x fa-paper-plane"></i>
  83 + <h6>Lorem Ipsum</h6>
  84 + </div>
  85 + </Col>
  86 + <Col md={ 3 }>
  87 + <div className="service-box">
  88 + <i className="fa fa-4x fa-newspaper-o"></i>
  89 + <h6>Lorem Ipsum</h6>
  90 + </div>
  91 + </Col>
  92 + <Col md={ 3 }>
  93 + <div className="service-box">
  94 + <i className="fa fa-4x fa-heart"></i>
  95 + <h6>Lorem Ipsum</h6>
  96 + </div>
  97 + </Col>
  98 + </Row>
  99 + <Row>
  100 + <Col>
  101 + <br></br>
  102 + <hr></hr>
  103 + </Col>
  104 + </Row>
  105 + <Row>
  106 + <Col md={ 12 }>
  107 + <div className="service-box">
  108 + <h2 className="section-heading">Lets Get In Touch!</h2>
  109 + </div>
  110 + </Col>
  111 + </Row>
  112 + <hr width="10%"></hr>
  113 + <Row>
  114 + <Col md={ 6 }>
  115 + <div className="service-box">
  116 + <i className="fa fa-phone fa-2x"></i>
  117 + <p className="contact">123-456-6789</p>
  118 + </div>
  119 + </Col>
  120 + <Col md={ 6 }>
  121 + <div className="service-box">
  122 + <i className="fa fa-envelope-o fa-2x"></i>
  123 + <p className="contact">feedback@youngdesk.com</p>
  124 + </div>
  125 + </Col>
  126 + </Row>
  127 + </div>
  128 +
  129 + <div className="Signup">
  130 + <Row>
  131 + <Col md={ 12 }>
  132 + <h4 className="page-header">Sign up with Us</h4>
  133 + <hr></hr>
  134 + <form
  135 + ref={ form => (this.signupForm = form) }
  136 + onSubmit={ this.handleSubmit }
  137 + >
  138 + <span className="side-heading"> Organisation Details </span>
  139 +
  140 + <Row>
  141 + <Col md={ 12 }>
  142 + <FormGroup controlId="orgSlugField" validationState={this.checkExistingOrgSlug()}>
  143 + {/* <ControlLabel>Organisation URL</ControlLabel> */}
  144 + <InputGroup>
  145 + <FormControl
  146 + type ="text"
  147 + ref ="orgSlug"
  148 + name ="orgSlug"
  149 + placeholder ="Organisation URL"
  150 + onChange = {(e) => this.handleChange(e)}
  151 + />
  152 + <InputGroup.Addon>@yd.com</InputGroup.Addon>
  153 + </InputGroup>
  154 + </FormGroup>
  155 + </Col>
  156 + </Row>
  157 +
  158 + <Row>
  159 + <Col md={12}>
  160 + <FormGroup>
  161 + {/* <ControlLabel>Organisation Name</ControlLabel> */}
  162 + <FormControl
  163 + type="text"
  164 + ref="orgName"
  165 + name="orgName"
  166 + placeholder="Organisation Name"
  167 + />
  168 + </FormGroup>
  169 + </Col>
  170 + </Row>
  171 + <hr width="25%"></hr>
  172 + <span className="side-heading"> Personal Details </span>
  173 + <Row>
  174 + <Col xs={ 6 } md={4} >
  175 + <FormGroup>
  176 + {/* <ControlLabel>First Name</ControlLabel> */}
  177 + <FormControl
  178 + type="text"
  179 + ref="firstName"
  180 + name="firstName"
  181 + placeholder="First Name"
  182 + />
  183 + </FormGroup>
  184 + </Col>
  185 + <Col xs={ 6 } md={4}>
  186 + <FormGroup>
  187 + {/* <ControlLabel>Middle Name</ControlLabel> */}
  188 + <FormControl
  189 + type="text"
  190 + ref="midName"
  191 + name="midName"
  192 + placeholder="Middle Name"
  193 + />
  194 + </FormGroup>
  195 + </Col>
  196 + <Col xs={ 6 } md={4}>
  197 + <FormGroup>
  198 + {/* <ControlLabel>Last Name</ControlLabel> */}
  199 + <FormControl
  200 + type="text"
  201 + ref="lastName"
  202 + name="lastName"
  203 + placeholder="Last Name"
  204 + />
  205 + </FormGroup>
  206 + </Col>
  207 + </Row>
  208 + <hr width="25%"></hr>
  209 + <span className="side-heading">User Credentials</span>
  210 + <FormGroup>
  211 + {/* <ControlLabel>Email Address</ControlLabel> */}
  212 + <FormControl
  213 + type="text"
  214 + ref="emailAddress"
  215 + name="emailAddress"
  216 + placeholder="Email Address"
  217 + />
  218 + </FormGroup>
  219 + <FormGroup>
  220 + {/* <ControlLabel>Password</ControlLabel> */}
  221 + <FormControl
  222 + type="password"
  223 + ref="password"
  224 + name="password"
  225 + placeholder="Password"
  226 + />
  227 + </FormGroup>
  228 + {/* <Col md={12} */}
  229 + <Button type="submit" style={{float:"right"}} className='blue'>Sign Up</Button>
  230 +
  231 + </form>
  232 + </Col>
  233 + </Row>
  234 + </div>
  235 + </div>
  236 + </div>
  237 +
  238 + );
  239 + }
  240 +}
... ...
imports/client/views/nonOrg/enter/signup.css
1 1 .Signup
2 2 {
  3 + float: right;
  4 + margin: 20px auto;
  5 + width: 400px;
  6 + height: auto;
  7 + padding: 20px;
  8 + -webkit-border-radius: 8px/7px;
  9 + -moz-border-radius: 8px/7px;
  10 + border-radius: 8px/7px;
3 11 background-color: white;
4   - margin: auto;
5   - width: 40%;
6   - border: 3px solid #73AD21;
7   - padding: 10px;
  12 + -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  13 + -moz-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  14 + box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  15 + border: solid 1px #cbc9c9;
  16 + font-family: 'Ubuntu', sans-serif;
  17 +}
  18 +
  19 +.Content
  20 +{
  21 + margin: 20px auto;
  22 + width: 750px;
  23 + height: auto;
  24 + padding: 20px;
  25 + font-family: 'Ubuntu', sans-serif;
  26 + color: white;
  27 + float:left;
  28 +}
  29 +
  30 +.section-heading
  31 +{
  32 + text-align: center;
  33 +}
  34 +
  35 +.contact
  36 +{
  37 + text-align: center;
  38 + text-indent: 0px !important;
  39 +}
  40 +
  41 +.container
  42 +{
  43 + /*width:1300px !important;*/
  44 +}
  45 +
  46 +h1
  47 +{
  48 + font-size: 45px !important;
  49 +}
  50 +
  51 +p
  52 +{
  53 + text-indent: 50px;
  54 + text-align: justify;
  55 + font-size:15px;
  56 +}
  57 +
  58 +h6
  59 +{
  60 + text-align: center;
  61 +}
  62 +
  63 +i
  64 +{
  65 + display: inline-block;
  66 + width: 100%;
  67 + text-align: center;
  68 +}
  69 +
  70 +
  71 +
  72 +.wrapper
  73 +{
  74 + overflow: hidden;
8 75 }
9 76  
10 77 .page-header
11 78 {
12 79 text-align: center;
  80 + color:#00b395;
  81 + font-weight: bolder;
  82 +}
  83 +
  84 +.side-heading
  85 +{
  86 + /*padding: 10px;*/
  87 + text-align: left;
  88 + font-weight: bold;
  89 + color:#00b395;
  90 + font-size: 14px;
  91 +}
  92 +
  93 +hr {
  94 + display: block;
  95 + height: 1px;
  96 + border: 0;
  97 + border-top: 1px solid #00b395;
  98 + padding: 0;
  99 +}
  100 +
  101 +.blue {
  102 + background-color: #00b395;
  103 + background-image: -webkit-linear-gradient(top,#00b395,#00cdaa);
  104 + background-image: -moz-linear-gradient(top,#00b395,#00cdaa);
  105 + background-image: -ms-linear-gradient(top,#00b395,#00cdaa);
  106 + background-image: -o-linear-gradient(top,#00b395,#00cdaa);
  107 + background-image: linear-gradient(top,#00b395,#00cdaa);
  108 +
  109 + border: 1px solid #00b395;
  110 + color: white;
  111 +
  112 + font-size: 13px;
  113 + font-weight: bold;
  114 + text-align: center;
  115 + height: 27px;
  116 + line-height: 27px;
  117 + min-width: 54px;
  118 + padding: 0 10px;
  119 + text-decoration: none;
  120 +}
  121 +
  122 +.blue:hover {
  123 + border: 1px solid #00b395;
  124 +
  125 + color: white;
  126 + background-color: #00b395;
  127 + background-image: -webkit-linear-gradient(top,#00b395,#009f85);
  128 + background-image: -moz-linear-gradient(top,#00b395,#009f85);
  129 + background-image: -ms-linear-gradient(top,#00b395,#009f85);
  130 + background-image: -o-linear-gradient(top,#00b395,#009f85);
  131 + background-image: linear-gradient(top,#00b395,#009f85);
  132 +
  133 + -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1);
  134 + -moz-box-shadow: 0 1px 1px rgba(0,0,0,.1);
  135 + box-shadow: 0 1px 1px rgba(0,0,0,.1);
  136 + width: auto;
  137 + height: 27px;
13 138 }
... ...
imports/client/views/org/admin/students/AddStudentFormContainer.js
... ... @@ -0,0 +1,97 @@
  1 +import React, { Component } from 'react'
  2 +import { AddStudentForm } from './addStudentForm'
  3 +import StudentForm from './StudentForm'
  4 +import Form from '/imports/client/views/core/Form'
  5 +import Validator from '/imports/client/views/core/Validator'
  6 +import { isRequired, isValidEmail } from '/imports/client/views/core/validations'
  7 +import { addStudentManually } from '/imports/collections/students/methods';
  8 +
  9 +export class AddStudentFormContainer extends Component {
  10 +
  11 + constructor(props) {
  12 + super(props)
  13 + this.state = { currentStep: 0 }
  14 + this.handleNextClick = this.handleNextClick.bind(this)
  15 + this.handleBackClick = this.handleBackClick.bind(this)
  16 + this.handleSubmit = this.handleSubmit.bind(this)
  17 + }
  18 +
  19 + handleNextClick() {
  20 + this.form.handleSubmit()
  21 + if (this.validator.getErrors() && Object.keys(this.validator.getErrors()).length > 0) return
  22 + this.setState({ currentStep: this.state.currentStep + 1 })
  23 + this.form.resetSubmitted()
  24 + }
  25 +
  26 + handleBackClick() {
  27 + this.setState({ currentStep: this.state.currentStep + -1 })
  28 + }
  29 +
  30 + handleSubmit() {
  31 + if (this.state.currentStep === 3) {
  32 + addStudentManually.call(this.form.state.values)
  33 + }
  34 + }
  35 +
  36 + //render callback
  37 + render() {
  38 + return (
  39 + <Form
  40 + onSubmit={this.handleSubmit}
  41 + ref={form => this.form = form}
  42 + initialValues={{
  43 + gender: 'male',
  44 + parentGender: 'male',
  45 + }}
  46 + >
  47 + {({ values, setValue, getValue, isSubmitted, isDirty }) => (
  48 + <Validator
  49 + values={values}
  50 + ref={validator => this.validator = validator}
  51 + validations={{
  52 + admissionId: [(value) => isRequired('Admission id', value)],
  53 + firstName: [(value) => isRequired('First name', value)],
  54 + middleName: [(value) => isRequired('Middle name', value)],
  55 + lastName: [(value) => isRequired('Last name', value)],
  56 + email: [(value) => isRequired('Email', value), isValidEmail],
  57 + dob: [(value) => isRequired('Date of birth', value)],
  58 + gender: [(value) => isRequired('Gender', value)],
  59 + rollNo: [(value) => this.state.currentStep === 1 && isRequired('Roll no', value)],
  60 + class: [(value) => this.state.currentStep === 1 && isRequired('Class', value)],
  61 + section: [(value) => this.state.currentStep === 1 && isRequired('Section', value)],
  62 + community: [(value) => this.state.currentStep === 1 && isRequired('Community', value)],
  63 + bloodGroup: [(value) => this.state.currentStep === 1 && isRequired('Blood group', value)],
  64 + phone: [(value) => this.state.currentStep === 1 && isRequired('Phone', value)],
  65 + address: [(value) => this.state.currentStep === 2 && isRequired('Address', value)],
  66 + city: [(value) => this.state.currentStep === 2 && isRequired('City', value)],
  67 + state: [(value) => this.state.currentStep === 2 && isRequired('State', value)],
  68 + parentName: [(value) => this.state.currentStep === 3 && isRequired('Parent name', value)],
  69 + parentEmail: [(value) => this.state.currentStep === 3 && isRequired('Parent email', value), (value) => this.state.currentStep === 3 && isValidEmail(value)],
  70 + relation: [(value) => this.state.currentStep === 3 && isRequired('Relation', value)],
  71 + profession: [(value) => this.state.currentStep === 3 && isRequired('Profession', value)],
  72 + parentGender: [(value) => this.state.currentStep === 3 && isRequired('Parent gender', value)],
  73 + parentPhone: [(value) => this.state.currentStep === 3 && isRequired('Parent phone', value)],
  74 + parentAddress: [(value) => this.state.currentStep === 3 && isRequired('Parent address', value)],
  75 + parentCity: [(value) => this.state.currentStep === 3 && isRequired('Parent city', value)],
  76 + parentState: [(value) => this.state.currentStep === 3 && isRequired('Parent state', value)],
  77 + parentZipcode: [(value) => this.state.currentStep === 3 && isRequired('Parent zip code', value)],
  78 + }}
  79 + >
  80 + {({ errors }) => (
  81 + <StudentForm
  82 + isDirty={isDirty}
  83 + setValue={setValue}
  84 + getValue={getValue}
  85 + isSubmitted={isSubmitted}
  86 + errors={errors}
  87 + onNextClick={this.handleNextClick}
  88 + onBackClick={this.handleBackClick}
  89 + currentStep={this.state.currentStep}
  90 + />
  91 + )}
  92 + </Validator>
  93 + )}
  94 + </Form>
  95 + )
  96 + }
  97 +}
... ...
imports/client/views/org/admin/students/StudentForm.js
... ... @@ -0,0 +1,483 @@
  1 +import React, { PropTypes } from 'react'
  2 +import {
  3 + Row,
  4 + Col,
  5 + FormGroup,
  6 + FormControl,
  7 + Button
  8 +} from 'react-bootstrap'
  9 +import DatePicker from '/imports/client/views/core/DatePicker'
  10 +import Label from '/imports/client/views/core/Label'
  11 +import Stepper from '/imports/client/views/core/Stepper'
  12 +import ErrorLabel from '/imports/client/views/core/ErrorLabel'
  13 +
  14 +const StudentForm = props => (
  15 + <div className="stepy-validation">
  16 + <Stepper
  17 + steps={[
  18 + {
  19 + label: 'Personal data',
  20 + active: props.currentStep === 0,
  21 + },
  22 + {
  23 + label: 'Academic',
  24 + active: props.currentStep === 1,
  25 + },
  26 + {
  27 + label: 'Address',
  28 + active: props.currentStep === 2,
  29 + },
  30 + {
  31 + label: 'Parent info',
  32 + active: props.currentStep === 3,
  33 + }
  34 + ]}
  35 + />
  36 + {props.currentStep === 0 && (
  37 + <fieldset title="1">
  38 + <legend className="text-semibold">Personal data</legend>
  39 + <Row>
  40 + <Col xs={12} sm={6}>
  41 + <FormGroup controlId="admissionId">
  42 + <Label required>Admission Id</Label>
  43 + <FormControl
  44 + type="text"
  45 + value={props.getValue('admissionId')}
  46 + placeholder="admission Id"
  47 + onChange={e => props.setValue('admissionId', e.target.value)}
  48 + />
  49 + {props.isSubmitted() && props.errors && props.errors.admissionId && (
  50 + <ErrorLabel> {props.errors.admissionId} </ErrorLabel>
  51 + )}
  52 + </FormGroup>
  53 + </Col>
  54 + <Col xs={12} sm={6}>
  55 + <FormGroup controlId="firstName">
  56 + <Label required>First Name</Label>
  57 + <FormControl
  58 + type="text"
  59 + value={props.getValue('firstName')}
  60 + placeholder="First Name"
  61 + onChange={e => props.setValue('firstName', e.target.value)}
  62 + />
  63 + {props.isSubmitted() && props.errors && props.errors.firstName && (
  64 + <ErrorLabel> {props.errors.firstName} </ErrorLabel>
  65 + )}
  66 + </FormGroup>
  67 + </Col>
  68 + </Row>
  69 + <Row>
  70 + <Col xs={12} sm={6}>
  71 + <FormGroup controlId="middleName">
  72 + <Label required>Middle Name</Label>
  73 + <FormControl
  74 + type="text"
  75 + value={props.getValue('middleName')}
  76 + placeholder="Middle Name"
  77 + onChange={e => props.setValue('middleName', e.target.value)}
  78 + />
  79 + {props.isSubmitted() && props.errors && props.errors.middleName && (
  80 + <ErrorLabel> {props.errors.middleName} </ErrorLabel>
  81 + )}
  82 + </FormGroup>
  83 + </Col>
  84 + <Col xs={12} sm={6}>
  85 + <FormGroup controlId="lastName">
  86 + <Label required>Last Name</Label>
  87 + <FormControl
  88 + type="text"
  89 + value={props.getValue('lastName')}
  90 + placeholder="Last Name"
  91 + onChange={e => props.setValue('lastName', e.target.value)}
  92 + />
  93 + {props.isSubmitted() && props.errors && props.errors.lastName && (
  94 + <ErrorLabel> {props.errors.lastName} </ErrorLabel>
  95 + )}
  96 + </FormGroup>
  97 + </Col>
  98 + </Row>
  99 + <Row>
  100 + <Col xs={12} sm={6}>
  101 + <FormGroup controlId="email">
  102 + <Label required>Email</Label>
  103 + <FormControl
  104 + type="email"
  105 + value={props.getValue('email')}
  106 + placeholder="Email"
  107 + onChange={e => props.setValue('email', e.target.value)}
  108 + />
  109 + {props.isSubmitted() && props.errors && props.errors.email && (
  110 + <ErrorLabel> {props.errors.email} </ErrorLabel>
  111 + )}
  112 + </FormGroup>
  113 + </Col>
  114 + <Col xs={12} sm={6}>
  115 + <FormGroup>
  116 + <Label required>Date of birth</Label>
  117 + <DatePicker
  118 + id="dob"
  119 + value={props.getValue('dob')}
  120 + onChange={(e) => {
  121 + props.setValue('dob', e.target.value)
  122 + }}
  123 + />
  124 + {props.isSubmitted() && props.errors && props.errors.dob && (
  125 + <ErrorLabel> {props.errors.dob} </ErrorLabel>
  126 + )}
  127 + </FormGroup>
  128 + </Col>
  129 + </Row>
  130 + <Row>
  131 + <Col xs={12} sm={6}>
  132 + <FormGroup controlId="formControlsSelect">
  133 + <Label>Gender</Label>
  134 + <FormControl componentClass="select"
  135 + placeholder="select"
  136 + value={props.getValue('gender')}
  137 + onChange={e => props.setValue('gender', e.target.value)}
  138 + >
  139 + <option value="male">Male</option>
  140 + <option value="female">Female</option>
  141 + </FormControl>
  142 + {props.isSubmitted() && props.errors && props.errors.gender && (
  143 + <ErrorLabel> {props.errors.gender} </ErrorLabel>
  144 + )}
  145 + </FormGroup>
  146 + </Col>
  147 + </Row>
  148 + </fieldset>
  149 + )}
  150 + {props.currentStep === 1 && (
  151 + <fieldset title="Academic">
  152 + <legend className="text-semibold">Academic</legend>
  153 + <Row>
  154 + <Col xs={12} sm={6}>
  155 + <FormGroup controlId="rollNo">
  156 + <Label required>Roll No</Label>
  157 + <FormControl
  158 + type="text"
  159 + value={props.getValue('rollNo')}
  160 + placeholder="Roll No"
  161 + onChange={e => props.setValue('rollNo', e.target.value)}
  162 + />
  163 + {props.isSubmitted() && props.errors && props.errors.rollNo && (
  164 + <ErrorLabel> {props.errors.rollNo} </ErrorLabel>
  165 + )}
  166 + </FormGroup>
  167 + </Col>
  168 + <Col xs={12} sm={6}>
  169 + <FormGroup controlId="class">
  170 + <Label required>Class</Label>
  171 + <FormControl
  172 + type="text"
  173 + value={props.getValue('class')}
  174 + placeholder="7"
  175 + onChange={e => props.setValue('class', e.target.value)}
  176 + />
  177 + {props.isSubmitted() && props.errors && props.errors.class && (
  178 + <ErrorLabel> {props.errors.class} </ErrorLabel>
  179 + )}
  180 + </FormGroup>
  181 + </Col>
  182 + </Row>
  183 + <Row>
  184 + <Col xs={12} sm={6}>
  185 + <FormGroup controlId="section">
  186 + <Label required>Section</Label>
  187 + <FormControl
  188 + type="text"
  189 + value={props.getValue('section')}
  190 + placeholder="B"
  191 + onChange={e => props.setValue('section', e.target.value)}
  192 + />
  193 + {props.isSubmitted() && props.errors && props.errors.section && (
  194 + <ErrorLabel> {props.errors.section} </ErrorLabel>
  195 + )}
  196 + </FormGroup>
  197 + </Col>
  198 + <Col xs={12} sm={6}>
  199 + <FormGroup controlId="community">
  200 + <Label required>Community</Label>
  201 + <FormControl
  202 + type="text"
  203 + value={props.getValue('community')}
  204 + placeholder="General"
  205 + onChange={e => props.setValue('community', e.target.value)}
  206 + />
  207 + {props.isSubmitted() && props.errors && props.errors.community && (
  208 + <ErrorLabel> {props.errors.community} </ErrorLabel>
  209 + )}
  210 + </FormGroup>
  211 + </Col>
  212 + </Row>
  213 + <Row>
  214 + <Col xs={12} sm={6}>
  215 + <FormGroup controlId="bloodGroup">
  216 + <Label required>bloodGroup</Label>
  217 + <FormControl
  218 + type="text"
  219 + value={props.getValue('bloodGroup')}
  220 + placeholder="B+"
  221 + onChange={e => props.setValue('bloodGroup', e.target.value)}
  222 + />
  223 + {props.isSubmitted() && props.errors && props.errors.bloodGroup && (
  224 + <ErrorLabel> {props.errors.bloodGroup} </ErrorLabel>
  225 + )}
  226 + </FormGroup>
  227 + </Col>
  228 + <Col xs={12} sm={6}>
  229 + <FormGroup controlId="phone">
  230 + <Label required>Phone</Label>
  231 + <FormControl
  232 + type="text"
  233 + value={props.getValue('phone')}
  234 + placeholder="9999999999"
  235 + onChange={e => props.setValue('phone', e.target.value)}
  236 + />
  237 + {props.isSubmitted() && props.errors && props.errors.phone && (
  238 + <ErrorLabel> {props.errors.phone} </ErrorLabel>
  239 + )}
  240 + </FormGroup>
  241 + </Col>
  242 + </Row>
  243 + </fieldset>
  244 + )}
  245 + {props.currentStep === 2 && (
  246 + <fieldset title="Address">
  247 + <legend className="text-semibold">Address</legend>
  248 + <Row>
  249 + <Col xs={12} sm={6}>
  250 + <FormGroup controlId="address">
  251 + <Label required>Address</Label>
  252 + <FormControl
  253 + type="text"
  254 + value={props.getValue('address')}
  255 + placeholder="#876, Street, town"
  256 + onChange={e => props.setValue('address', e.target.value)}
  257 + />
  258 + {props.isSubmitted() && props.errors && props.errors.address && (
  259 + <ErrorLabel> {props.errors.address} </ErrorLabel>
  260 + )}
  261 + </FormGroup>
  262 + </Col>
  263 + <Col xs={12} sm={6}>
  264 + <FormGroup controlId="city">
  265 + <Label required>City</Label>
  266 + <FormControl
  267 + type="text"
  268 + value={props.getValue('city')}
  269 + placeholder="Chennai"
  270 + onChange={e => props.setValue('city', e.target.value)}
  271 + />
  272 + {props.isSubmitted() && props.errors && props.errors.city && (
  273 + <ErrorLabel> {props.errors.city} </ErrorLabel>
  274 + )}
  275 + </FormGroup>
  276 + </Col>
  277 + </Row>
  278 + <Row>
  279 + <Col xs={12} sm={6}>
  280 + <FormGroup controlId="state">
  281 + <Label required>State</Label>
  282 + <FormControl
  283 + type="text"
  284 + value={props.getValue('state')}
  285 + placeholder="Tamilnadu"
  286 + onChange={e => props.setValue('state', e.target.value)}
  287 + />
  288 + {props.isSubmitted() && props.errors && props.errors.state && (
  289 + <ErrorLabel> {props.errors.state} </ErrorLabel>
  290 + )}
  291 + </FormGroup>
  292 + </Col>
  293 + </Row>
  294 + </fieldset>
  295 + )}
  296 + {props.currentStep === 3 && (
  297 + <fieldset title="2">
  298 + <legend className="text-semibold">Parent information</legend>
  299 + <Row>
  300 + <Col xs={12} sm={6}>
  301 + <FormGroup controlId="parentName">
  302 + <Label required>Parent Name</Label>
  303 + <FormControl
  304 + type="text"
  305 + value={props.getValue('parentName')}
  306 + placeholder="John"
  307 + onChange={e => props.setValue('parentName', e.target.value)}
  308 + />
  309 + {props.isSubmitted() && props.errors && props.errors.parentName && (
  310 + <ErrorLabel> {props.errors.parentName} </ErrorLabel>
  311 + )}
  312 + </FormGroup>
  313 + </Col>
  314 + <Col xs={12} sm={6}>
  315 + <FormGroup controlId="parentEmail">
  316 + <Label required>Parent Email</Label>
  317 + <FormControl
  318 + type="text"
  319 + value={props.getValue('parentEmail')}
  320 + placeholder="john@email.com"
  321 + onChange={e => props.setValue('parentEmail', e.target.value)}
  322 + />
  323 + {props.isSubmitted() && props.errors && props.errors.parentEmail && (
  324 + <ErrorLabel> {props.errors.parentEmail} </ErrorLabel>
  325 + )}
  326 + </FormGroup>
  327 + </Col>
  328 + </Row>
  329 + <Row>
  330 + <Col xs={12} sm={6}>
  331 + <FormGroup controlId="relation">
  332 + <Label required>Relation</Label>
  333 + <FormControl
  334 + type="text"
  335 + value={props.getValue('relation')}
  336 + placeholder="Father"
  337 + onChange={e => props.setValue('relation', e.target.value)}
  338 + />
  339 + {props.isSubmitted() && props.errors && props.errors.relation && (
  340 + <ErrorLabel> {props.errors.relation} </ErrorLabel>
  341 + )}
  342 + </FormGroup>
  343 + </Col>
  344 + <Col xs={12} sm={6}>
  345 + <FormGroup controlId="profession">
  346 + <Label required>Profession</Label>
  347 + <FormControl
  348 + type="text"
  349 + value={props.getValue('profession')}
  350 + placeholder="Farmer"
  351 + onChange={e => props.setValue('profession', e.target.value)}
  352 + />
  353 + {props.isSubmitted() && props.errors && props.errors.profession && (
  354 + <ErrorLabel> {props.errors.profession} </ErrorLabel>
  355 + )}
  356 + </FormGroup>
  357 + </Col>
  358 + </Row>
  359 + <Row>
  360 + <Col xs={12} sm={6}>
  361 + <FormGroup controlId="parentGender">
  362 + <Label>Parent Gender</Label>
  363 + <FormControl componentClass="select"
  364 + placeholder="select"
  365 + value={props.getValue('parentGender')}
  366 + onChange={e => props.setValue('parentGender', e.target.value)}
  367 + >
  368 + <option value="male">Male</option>
  369 + <option value="female">Female</option>
  370 + </FormControl>
  371 + {props.isSubmitted() && props.errors && props.errors.parentGender && (
  372 + <ErrorLabel> {props.errors.parentGender} </ErrorLabel>
  373 + )}
  374 + </FormGroup>
  375 + </Col>
  376 + <Col xs={12} sm={6}>
  377 + <FormGroup controlId="parentPhone">
  378 + <Label required>Parent Phone</Label>
  379 + <FormControl
  380 + type="text"
  381 + value={props.getValue('parentPhone')}
  382 + placeholder="9876543210"
  383 + onChange={e => props.setValue('parentPhone', e.target.value)}
  384 + />
  385 + {props.isSubmitted() && props.errors && props.errors.parentPhone && (
  386 + <ErrorLabel> {props.errors.parentPhone} </ErrorLabel>
  387 + )}
  388 + </FormGroup>
  389 + </Col>
  390 + </Row>
  391 + <Row>
  392 + <Col xs={12} sm={6}>
  393 + <FormGroup controlId="parentAddress">
  394 + <Label required>Parent Address</Label>
  395 + <FormControl
  396 + type="text"
  397 + value={props.getValue('parentAddress')}
  398 + placeholder="#12, street, town"
  399 + onChange={e => props.setValue('parentAddress', e.target.value)}
  400 + />
  401 + {props.isSubmitted() && props.errors && props.errors.parentAddress && (
  402 + <ErrorLabel> {props.errors.parentAddress} </ErrorLabel>
  403 + )}
  404 + </FormGroup>
  405 + </Col>
  406 + <Col xs={12} sm={6}>
  407 + <FormGroup controlId="parentCity">
  408 + <Label required>Parent City</Label>
  409 + <FormControl
  410 + type="text"
  411 + value={props.getValue('parentCity')}
  412 + placeholder="Chennai"
  413 + onChange={e => props.setValue('parentCity', e.target.value)}
  414 + />
  415 + {props.isSubmitted() && props.errors && props.errors.parentCity && (
  416 + <ErrorLabel> {props.errors.parentCity} </ErrorLabel>
  417 + )}
  418 + </FormGroup>
  419 + </Col>
  420 + </Row>
  421 + <Row>
  422 + <Col xs={12} sm={6}>
  423 + <FormGroup controlId="parentZipcode">
  424 + <Label required>Parent Zipcode</Label>
  425 + <FormControl
  426 + type="text"
  427 + value={props.getValue('parentZipcode')}
  428 + placeholder="600031"
  429 + onChange={e => props.setValue('parentZipcode', e.target.value)}
  430 + />
  431 + {props.isSubmitted() && props.errors && props.errors.parentZipcode && (
  432 + <ErrorLabel> {props.errors.parentZipcode} </ErrorLabel>
  433 + )}
  434 + </FormGroup>
  435 + </Col>
  436 + </Row>
  437 + </fieldset>
  438 + )}
  439 + <div style={{ textAlign: 'left' }}>
  440 + {props.currentStep > 0 && (
  441 + <div style={{ display: 'inline-block', marginRight: 10 }}>
  442 + <Button onClick={props.onBackClick}>
  443 + <i className="icon-arrow-left13 position-left"></i>
  444 + BACK
  445 + </Button>
  446 +
  447 + </div>
  448 + )}
  449 + {props.currentStep < 3 && (
  450 + <div style={{ display: 'inline-block' }}>
  451 + <Button
  452 + bsStyle="primary"
  453 + onClick={props.onNextClick}
  454 + >
  455 + NEXT
  456 + <i className="icon-arrow-right14 position-right" />
  457 + </Button>
  458 + </div>
  459 + )}
  460 + {props.currentStep === 3 && (
  461 + <div style={{ display: 'inline-block' }}>
  462 + <Button
  463 + bsStyle="primary"
  464 + onClick={props.onNextClick}
  465 + >
  466 + SAVE
  467 + <i className="fa fa-check" />
  468 + </Button>
  469 + </div>
  470 + )}
  471 + </div>
  472 + </div>
  473 +)
  474 +
  475 +StudentForm.propTypes = {
  476 + currentStep: PropTypes.number.isRequired,
  477 + onNextClick: PropTypes.func.isRequired,
  478 + onBackClick: PropTypes.func.isRequired,
  479 + setValue: PropTypes.func.isRequired,
  480 + getValue: PropTypes.func.isRequired,
  481 +}
  482 +
  483 +export default StudentForm
... ...
imports/client/views/org/admin/students/addStudent.js
... ... @@ -6,7 +6,7 @@ import { Link,browserHistory } from &#39;react-router&#39;;
6 6 import { FormGroup,Panel,Table,
7 7 ButtonToolbar,Modal,
8 8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9   -import { AddStudentForm } from './addStudentForm';
  9 +import { AddStudentFormContainer } from './AddStudentFormContainer';
10 10  
11 11 const style = {
12 12 margin: 12,
... ... @@ -49,7 +49,7 @@ export class AddStudent extends Component {
49 49 <Modal.Title id="contained-modal-title-lg">New Student</Modal.Title>
50 50 </Modal.Header>
51 51 <Modal.Body>
52   - <AddStudentForm />
  52 + <AddStudentFormContainer />
53 53 </Modal.Body>
54 54 <Modal.Footer>
55 55 <Button onClick={this.hideModal}>Close</Button>
... ...
imports/client/views/org/enter/LoginPane.js
... ... @@ -28,7 +28,7 @@ export class LoginPane extends React.Component {
28 28 </Link>
29 29 <div className="enterPane__box">
30 30 <div className="enterPane__header">
31   - Login
  31 + <h4>Login</h4>
32 32 </div>
33 33 <Alert color="danger" isOpen={ this.props.data.visible || this.props.data.error.length !== 0 }>
34 34 { this.props.data.error }
... ... @@ -36,6 +36,7 @@ export class LoginPane extends React.Component {
36 36 <Alert color="success" isOpen={ this.props.data.visible || this.props.data.message.length !== 0 }>
37 37 { this.props.data.message }
38 38 </Alert>
  39 + <hr width="25%"></hr>
39 40 <Form onSubmit={ (e) => this.props.onLogin(e) }>
40 41 <Col md={12}>
41 42 <FormGroup>
... ... @@ -44,7 +45,7 @@ export class LoginPane extends React.Component {
44 45 onChange={ (e) => this.props.onUpdate('email', e.currentTarget.value) }
45 46 name="email"
46 47 id="email"
47   - placeholder="Enter your email" />
  48 + placeholder="Email" />
48 49 </FormGroup></Col>
49 50 <Col md={12}>
50 51 <FormGroup>
... ... @@ -53,28 +54,30 @@ export class LoginPane extends React.Component {
53 54 onChange={ (e) => this.props.onUpdate('password', e.currentTarget.value) }
54 55 name="password"
55 56 id="password"
56   - placeholder="Enter your password" />
  57 + placeholder="Password" />
57 58 </FormGroup>
58 59 </Col>
59   - <Col md={12}>
  60 + <Col md={6}>
  61 + <FormGroup className="enterPane__formGroupLogin--center">
  62 + <Link style={{float:"left"}} className="enterPane__link"
  63 + to={ setQueryParam(this.props.location, { enter: 'forgot' }) }>
  64 + Forgot your password?
  65 + </Link>
  66 + </FormGroup>
  67 + </Col>
  68 + <Col md={6}>
60 69 <FormGroup>
61 70 <ActionButton
62 71 loading={ this.props.data.loading }>
63 72 <Button
64   - color="success" size="sm"
65   - type="submit"
66   - block>
  73 + className='blue'
  74 + type="submit" style={{float:"right"}}>
67 75 Log in
68 76 </Button>
69 77 </ActionButton>
70 78 </FormGroup>
71 79 </Col>
72   - <FormGroup className="enterPane__formGroupLogin--center">
73   - <Link className="enterPane__link"
74   - to={ setQueryParam(this.props.location, { enter: 'forgot' }) }>
75   - Forgotten password?
76   - </Link>
77   - </FormGroup>
  80 +
78 81 </Form>
79 82 </div>
80 83 </div>
... ...
imports/client/views/org/enter/loginpane.css
1   -.enterPane__box{
2   -background-color: white;
3   -margin: auto;
4   - width: 30%;
5   - border: 3px solid #73AD21;
6   - padding: 10px;
  1 +.enterPane__box
  2 +{
  3 + margin: 20px auto;
  4 + width: 400px;
  5 + height: 100%;
  6 + padding: 20px;
  7 + float:right;
  8 + -webkit-border-radius: 8px/7px;
  9 + -moz-border-radius: 8px/7px;
  10 + border-radius: 8px/7px;
  11 + background-color: white;
  12 + -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  13 + -moz-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  14 + box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  15 + border: solid 1px #cbc9c9;
  16 + font-family: 'Ubuntu', sans-serif;
7 17 }
8 18  
9   - .enterPane__header{
  19 + .enterPane__header
  20 + {
10 21 text-align: center;
11   - font-weight: bold;
  22 + color:#00b395;
  23 + font-weight: bolder;
  24 + }
  25 +
  26 + .blue {
  27 + background-color: #00b395;
  28 + background-image: -webkit-linear-gradient(top,#00b395,#00cdaa);
  29 + background-image: -moz-linear-gradient(top,#00b395,#00cdaa);
  30 + background-image: -ms-linear-gradient(top,#00b395,#00cdaa);
  31 + background-image: -o-linear-gradient(top,#00b395,#00cdaa);
  32 + background-image: linear-gradient(top,#00b395,#00cdaa);
  33 +
  34 + border: 1px solid #00b395;
  35 + color: white;
  36 +
  37 + font-size: 13px;
  38 + font-weight: bold;
  39 + text-align: center;
  40 + height: 27px;
  41 + line-height: 27px;
  42 + min-width: 54px;
  43 + padding: 0 10px;
  44 + text-decoration: none;
  45 + }
  46 +
  47 + .form-group
  48 + {
  49 + clear:both;
  50 + }
  51 +
  52 + .enterPane__link
  53 + {
  54 + text-decoration: underline;
  55 + }
  56 +
  57 + .blue:hover {
  58 + border: 1px solid #00b395;
  59 +
  60 + color: white;
  61 + background-color: #00b395;
  62 + background-image: -webkit-linear-gradient(top,#00b395,#009f85);
  63 + background-image: -moz-linear-gradient(top,#00b395,#009f85);
  64 + background-image: -ms-linear-gradient(top,#00b395,#009f85);
  65 + background-image: -o-linear-gradient(top,#00b395,#009f85);
  66 + background-image: linear-gradient(top,#00b395,#009f85);
  67 +
  68 + -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.1);
  69 + -moz-box-shadow: 0 1px 1px rgba(0,0,0,.1);
  70 + box-shadow: 0 1px 1px rgba(0,0,0,.1);
  71 + width: auto;
  72 + height: 27px;
12 73 }
... ...
imports/client/views/verify/EmailPane.js
... ... @@ -39,38 +39,28 @@ export class EmailPane extends React.Component {
39 39 const {user} = this.props;
40 40  
41 41 return (
42   - <div className = "wizardPane-box">
43   - <div className = "wizardPane-section">
44   - {/* <div className="icon-circle icon-lg">
45   - <i className="icon icon-simple icon-envelope"></i>
46   - </div> */}
47   - <div className = "wizardPane-title">
48   - Enter your email address
49   - </div>
50   - <div className = "col-xs-8 horizontalform verifyEmail wizardPane-text">
51   - <div className="form-row">
52   - <Col sm={4}>
53   - Enter email
54   - </Col>
55   - <Col sm={8}>
56   - <input
57   - type = "text"
58   - value = {this.state.email}
59   - onChange = {(evt) => this.onUpdate('email', evt.currentTarget.value)}
60   - placeholder = "Email"
61   - />
  42 + <div className = "wizardPane-box1">
  43 + <div>
  44 + <i className="fa fa-envelope-o fa-3x"></i>
  45 + </div>
  46 + <div>
  47 + <Row>
  48 + <Col md={12}>
  49 + <FormGroup>
  50 + <ControlLabel className='subheading'>Email</ControlLabel>
  51 + <FormControl
  52 + type="text"
  53 + value = {this.state.email}
  54 + onChange = {(evt) => this.onUpdate('email', evt.currentTarget.value)}
  55 + placeholder="Organisation Name"
  56 + />
  57 + </FormGroup>
62 58 </Col>
  59 + </Row>
63 60 </div>
64   -
65   - </div>
66   - </div>
67   - <div className = "wizardPane-section wizardPane-footer">
68   - <div
69   - className = "wizardPane-button btn btn-blue"
70   - onClick = {() => this.onSetEmail()}
71   - >
72   - Send verification email
73   - </div>
  61 + <div className = "wizardPane-sectionD wizardPane-footer">
  62 + <Button type="submit" onClick = {() => this.onSetEmail()} className='blue'>Verify Now</Button>
  63 + {/* <Button type="submit" onClick = {() => this.onSetEmail()} className='blue'>Sign Up</Button> */}
74 64 </div>
75 65 </div>
76 66 );
... ... @@ -85,12 +75,11 @@ export class EmailPane extends React.Component {
85 75  
86 76 <div className = "wizardPane-title">
87 77 {/* <i className="icon-envelope icon"></i> */}
88   - <h3>Your email needs verification</h3>
89   - </div>
90   - <div className = "wizardPane-text">
91   - Please check your email โ€“ย we sent a verification link to<br/>
  78 + <h3>Hi, your email needs verification</h3>
  79 +
  80 + <span>Please check your email โ€“ย we sent a verification link to &nbsp;
92 81 <span className = "EmailVerify">
93   - {user.emails[0].address}</span>
  82 + {user.emails[0].address}</span></span>
94 83 </div>
95 84 </div>
96 85 <div className = "wizardPane-sectionD wizardPane-footer">
... ...
imports/client/views/verify/emailpane.css
  1 +.wizardPane-box
  2 +{
  3 + margin: 20px auto;
  4 + width: 400px;
  5 + height: auto;
  6 + padding: 20px;
  7 + -webkit-border-radius: 8px/7px;
  8 + -moz-border-radius: 8px/7px;
  9 + border-radius: 8px/7px;
  10 + background-color: white;
  11 + -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  12 + -moz-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  13 + box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  14 + border: solid 1px #cbc9c9;
  15 + font-family: 'Ubuntu', sans-serif;
  16 +}
  17 +
  18 +.wizardPane-box1
  19 +{
  20 + margin: 20px auto;
  21 + width: 300px;
  22 + height: auto;
  23 + padding: 20px;
  24 + -webkit-border-radius: 8px/7px;
  25 + -moz-border-radius: 8px/7px;
  26 + border-radius: 8px/7px;
  27 + background-color: white;
  28 + -webkit-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  29 + -moz-box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  30 + box-shadow: 1px 2px 5px rgba(0,0,0,.31);
  31 + border: solid 1px #cbc9c9;
  32 + font-family: 'Ubuntu', sans-serif;
  33 +}
  34 +
1 35 .wizardPane-sectionD
2 36 {
3 37 background-color: white;
4 38 margin: auto;
5   - width: 30%;
  39 + width: 100%;
6 40 padding: 10px;
7 41 top:50px;
8 42 cursor: pointer;
9 43 font-weight: bold;
10   - color: crimson;
  44 + color: #00b395;
11 45 font-style: italic;
  46 + text-align: center;
12 47 }
13 48  
14 49 .EmailVerify
15 50 {
16 51 color:green;
17 52 font-weight: bold;
  53 + font-style: normal !important;
  54 + color: #00b395;
  55 +}
  56 +
  57 +.subheading
  58 +{
  59 + font-weight: bold;
  60 + color: #00b395;
18 61 }
19 62  
20 63 .wizardPane-link:hover
... ... @@ -22,32 +65,52 @@
22 65 text-decoration: underline;
23 66 }
24 67  
  68 +i
  69 +{
  70 + display: inline-block;
  71 + width: 100%;
  72 + text-align: center;
  73 +}
  74 +
  75 +h3
  76 +{
  77 + margin-top: 0px !important;
  78 + text-align: center;
  79 + color: white;
  80 +}
  81 +
  82 +span
  83 +{
  84 + font-size: 14px;
  85 + color: white;
  86 +}
  87 +
25 88 .wizardPane-section1
26 89 {
27   - margin:auto;
28   - width: 30%;
29   - padding: 10px;
30   - background:#fff;
31   - -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
32   - -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
33   - box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  90 + /*margin: 20px auto;*/
  91 + width: 360px;
  92 + height: auto;
  93 + padding: 10px;
  94 + -webkit-border-radius: 8px/7px;
  95 + -moz-border-radius: 8px/7px;
  96 + border-radius: 8px/7px;
  97 + background-color: darkslategray;
34 98  
35 99 }
36 100  
37 101 .wizardPane-section
38 102 {
39   - margin:auto;
40   - width: 30%;
41   - padding: 10px;
42   - background:#fff;
43   - -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
44   - -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
45   - box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
  103 + width: 360px;
  104 + height: auto;
  105 + padding: 10px;
  106 + -webkit-border-radius: 8px/7px;
  107 + -moz-border-radius: 8px/7px;
  108 + border-radius: 8px/7px;
  109 + background-color: black;
46 110  
47 111 }
48 112  
49 113 .wizardPane-title
50 114 {
51   - font-size: 20px;
52   - color:black;
  115 + color:white;
53 116 }
... ...
imports/collections/students/methods.js
... ... @@ -80,8 +80,8 @@ export const addStudentManually = new ValidatedMethod({
80 80 newParentId = Parents.insert({
81 81 userId: newParentUserId,
82 82 orgId: orgId,
83   - address: data.address,
84   - gender: data.gender,
  83 + address: data.address,
  84 + gender: data.gender,
85 85 dob: data.dob,
86 86 rollNo: data.rollNo,
87 87 class: data.studentclass,
... ... @@ -89,11 +89,7 @@ export const addStudentManually = new ValidatedMethod({
89 89 bloodGroup: data.bloodGroup,
90 90 community: data.community,
91 91 });
92   - console.log("newParentUserId");
93   - console.log(newParentUserId);
94 92 }
95   - console.log("newUserId");
96   - console.log(newStudentId);
97 93 if(newStudentId){
98 94 Students.insert({
99 95 userId: newStudentId,
... ...
... ... @@ -69,7 +69,9 @@
69 69 "csvtojson": "^1.1.4",
70 70 "fs": "0.0.1-security",
71 71 "jquery": "^2.2.4",
  72 + "jquery-ui": "^1.12.1",
72 73 "jquery-validation": "^1.15.1",
  74 + "lodash": "^4.17.4",
73 75 "material-fabmenu": "0.0.1",
74 76 "material-ui": "^0.17.1",
75 77 "meteor-node-stubs": "^0.2.6",
... ...