Sunny Negi / Meteor-projects

Blame view

imports/client/views/verify/EmailPane.js 3.1 KB
edit raw normal view history
878ca8a15   Deepak   added signup form... 
1
2
3
4
 
  import React                              from 'react';
  import { Link }                           from 'react-router';
  import { If, Case }                       from '/imports/client/components/Logic';
  import { Bert }                             from 'meteor/themeteorchef:bert';
db3748612   ajaiprakash   Verify Email styling 
5
 
  import './emailpane.css';
878ca8a15   Deepak   added signup form... 
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
  
  import { Row, Col, Alert,ControlLabel,
          FormGroup, FormControl, Button }  from 'react-bootstrap';
  
  
  export class EmailPane extends React.Component {
  
    constructor(props) {
      super(props);
  
      this.state = {
        email:  props.user.emails[0].address,
        form:   false,
      };
    };
  
    onUpdate(key, val) {
      this.setState({[key]: val});
    };
  
    onSetEmail() {
      startEmailVerification.call({email: this.state.email}, (err, res)=>{
        Bert.alert('New verification email sent!', 'success');
  
      });
      this.setState({form: false});
    };
  
    onShowForm() {
      this.setState({form: true});
    };
  
    renderForm() {
      const {user} = this.props;
  
      return (
        <div className = "wizardPane-box">
8ce8e66f3   ajaiprakash   Emailpane styling 
43
44
 
          <div className = "wizardPane-section">
              {/* <div className="icon-circle icon-lg">
878ca8a15   Deepak   added signup form... 
45
 
                  <i className="icon icon-simple icon-envelope"></i>
8ce8e66f3   ajaiprakash   Emailpane styling 
46
 
              </div> */}
878ca8a15   Deepak   added signup form... 
47
 
            <div className = "wizardPane-title">
8ce8e66f3   ajaiprakash   Emailpane styling 
48
 
              Enter your email address
878ca8a15   Deepak   added signup form... 
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
 
            </div>
            <div className = "col-xs-8 horizontalform verifyEmail wizardPane-text">
              <div className="form-row">
                  <Col sm={4}>
                      Enter email
                  </Col>
                  <Col sm={8}>
                     <input
                      type      = "text"
                      value     = {this.state.email}
                      onChange  = {(evt) => this.onUpdate('email', evt.currentTarget.value)}
                      placeholder = "Email"
                    />
                  </Col>
              </div>
  
            </div>
          </div>
          <div className = "wizardPane-section wizardPane-footer">
            <div
              className = "wizardPane-button btn btn-blue"
              onClick   = {() => this.onSetEmail()}
            >
              Send verification email
            </div>
          </div>
        </div>
      );
    };
  
    renderMessage() {
      const {user} = this.props;
  
      return (
        <div className = "wizardPane-box">
db3748612   ajaiprakash   Verify Email styling 
84
 
          <div className = "wizardPane-section1">
878ca8a15   Deepak   added signup form... 
85
86
 
  
            <div className = "wizardPane-title">
8ce8e66f3   ajaiprakash   Emailpane styling 
87
88
 
            {/* <i className="icon-envelope icon"></i> */}
             <h3>Your email needs verification</h3>
878ca8a15   Deepak   added signup form... 
89
90
 
            </div>
            <div className = "wizardPane-text">
8ce8e66f3   ajaiprakash   Emailpane styling 
91
92
 
              Please check your email – we sent a verification link to<br/>
              <span className = "EmailVerify">
db3748612   ajaiprakash   Verify Email styling 
93
 
              {user.emails[0].address}</span>
878ca8a15   Deepak   added signup form... 
94
95
 
            </div>
          </div>
8ce8e66f3   ajaiprakash   Emailpane styling 
96
 
          <div className = "wizardPane-sectionD wizardPane-footer">
878ca8a15   Deepak   added signup form... 
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
 
            <div className="btn"
              className = "wizardPane-link"
              onClick   = {() => this.onShowForm()}
            >
              Email did not arrive or want to use a different email?
            </div>
          </div>
        </div>
      );
    };
  
    render() {
      return this.state.form ? this.renderForm() : this.renderMessage();
    };
  
  };