Skip to content

Commit c98a015

Browse files
khoadnguyenkhoadnguyen
authored
Merge pull request #99 from SoftStackFactory/67-register-backend-functionality-and-updates
67 register backend functionality and updates
2 parents 07329c8 + 836ed30 commit c98a015

4 files changed

Lines changed: 103 additions & 60 deletions

File tree

‎src/app/app.module.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import { TransitionPage } from '../pages/transition/transition';
1616
import { AssessmentPage } from '../pages/assessment/assessment';
1717
import { TimelinePage } from '../pages/timeline/timeline';
1818
import { UserProvider } from '../providers/user/user';
19+
import { HttpClientModule } from '@angular/common/http';
1920

2021
@NgModule({
2122
declarations: [

‎src/pages/register/register.html‎

Lines changed: 62 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -17,22 +17,50 @@ <h1 id="title">INTRANSITION</h1>
1717
</div>
1818
-->
1919

20-
<ion-grid fixed>
20+
<form class="form" [formGroup]='validate' (ngSubmit)='submitReg()'>
21+
<ion-item class="input" no-lines>
22+
<ion-input
23+
[(ngModel)]="registerUser.firstName"
24+
class="input"
25+
type="text"
26+
#first
27+
placeholder="First Name"
28+
formControlName='first'
29+
[class.invalid]="!validate.controls.first.valid && (validate.controls.first.dirty || submitAttempt)">
30+
</ion-input>
31+
</ion-item>
32+
<ion-item class="input" no-lines *ngIf="!validate.controls.first.valid && (validate.controls.first.dirty || submitAttempt)">
33+
<p class="invalid-text">Enter a valid name</p>
34+
</ion-item><br>
2135

22-
<br>
23-
24-
<ion-row justify-content-center>
25-
<ion-col col-10>
26-
<h2 text-center>Transitioning from the military to civilian environment is more than just a job change.</h2>
27-
<br>
28-
<h2 id="lifechange" text-center>It's a life change.</h2>
29-
</ion-col>
30-
</ion-row>
31-
32-
<br>
33-
<!--</ion-grid>-->
34-
35-
<form [formGroup]='validate' (ngSubmit)='regform()'>
36+
<ion-item class="input" no-lines>
37+
<ion-input
38+
[(ngModel)]="registerUser.lastName"
39+
class="input"
40+
type="text"
41+
#last
42+
placeholder="Last Name"
43+
formControlName='last'
44+
[class.invalid]="!validate.controls.last.valid && (validate.controls.last.dirty || submitAttempt)"></ion-input>
45+
</ion-item>
46+
<ion-item class="input" no-lines *ngIf="!validate.controls.last.valid && (validate.controls.last.dirty || submitAttempt)">
47+
<p class="invalid-text">Enter a valid name</p>
48+
</ion-item><br>
49+
50+
51+
<ion-item class="input" no-lines>
52+
<ion-input
53+
[(ngModel)]="registerUser.email"
54+
class="input"
55+
type="email"
56+
#email
57+
placeholder="Email Address"
58+
formControlName='email'
59+
[class.invalid]="!validate.controls.email.valid && (validate.controls.email.dirty || submitAttempt)"></ion-input>
60+
</ion-item>
61+
<ion-item class="input" no-lines *ngIf="!validate.controls.email.valid && (validate.controls.email.dirty || submitAttempt)">
62+
<p class="invalid-text">Enter a valid email</p>
63+
</ion-item><br>
3664

3765
<ion-row justify-content-center>
3866
<ion-col col-10>
@@ -69,22 +97,19 @@ <h2 id="lifechange" text-center>It's a life change.</h2>
6997
</ion-col>
7098
</ion-row>
7199

72-
<ion-row justify-content-center>
73-
<ion-col col-10>
74-
<ion-item no-lines>
75-
<ion-input
76-
type="email"
77-
#email
78-
placeholder="Email Address"
79-
formControlName='email'
80-
[class.invalid]="!validate.controls.email.valid && (validate.controls.email.dirty || submitAttempt)">
81-
</ion-input>
82-
</ion-item>
83-
<ion-item no-lines *ngIf="!validate.controls.email.valid && (validate.controls.email.dirty || submitAttempt)">
84-
<p class="invalid-text">Enter a valid email</p>
85-
</ion-item><br>
86-
</ion-col>
87-
</ion-row>
100+
<ion-item class="input" no-lines>
101+
<ion-input
102+
[(ngModel)]="registerUser.password"
103+
class="input"
104+
type="password"
105+
#pass
106+
placeholder="Password"
107+
formControlName='password'
108+
[class.invalid]="!validate.controls.password.valid && (validate.controls.password.dirty || submitAttempt)"></ion-input>
109+
</ion-item>
110+
<ion-item class="input" no-lines *ngIf="!validate.controls.password.valid && (validate.controls.password.dirty || submitAttempt)">
111+
<p class="invalid-text">Enter a password between 6-30 characters using only letters and numbers</p>
112+
</ion-item><br>
88113

89114
<ion-row justify-content-center>
90115
<ion-col col-10>
@@ -119,31 +144,13 @@ <h2 id="lifechange" text-center>It's a life change.</h2>
119144
</ion-item>
120145
</ion-col>
121146
</ion-row>
122-
123-
<br>
124-
<br>
125-
126-
<ion-row justify-content-center>
127-
<ion-col col-8>
128-
<button id="regButton" ion-button block [disabled]="!validate.valid" (click)='regForm()'>REGISTER</button>
129-
</ion-col>
130-
</ion-row>
147+
<button id="register-button"color="secondary" ion-button [disabled]="!validate.valid" type="submit">REGISTER</button>
131148
</form>
132-
133-
<br>
134-
<br>
135-
136-
<ion-row justify-content-center>
137-
<ion-col col-10>
138-
<h3 text-center>If you already have an account, sign in.</h3>
139-
</ion-col>
140-
</ion-row>
141-
142-
<ion-row justify-content-center>
143-
<ion-col col-8>
144-
<button id="loginButton" ion-button block>LOGIN</button>
145-
</ion-col>
146-
</ion-row>
149+
150+
<div class='login2'>
151+
<p id="sign-in">If you already have an account, sign in.</p>
152+
<button id="login-button"color="primary" ion-button (click)="goLogin()">LOGIN</button>
153+
</div>
147154

148155
</ion-grid>
149156
</ion-content>

‎src/pages/register/register.ts‎

Lines changed: 32 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@ import { Component } from '@angular/core';
22
import { NavController, NavParams } from 'ionic-angular';
33
import { Validators, FormBuilder, FormGroup} from '@angular/forms';
44
import { PasswordValidator } from '../../validators/password.validator';
5+
import { UserProvider } from '../../providers/user/user';
6+
import { WizardPage } from '../wizard/wizard'
7+
import { LoginPage } from '../login/login';
8+
59

610

711
@Component({
@@ -10,12 +14,19 @@ import { PasswordValidator } from '../../validators/password.validator';
1014
})
1115
export class RegisterPage {
1216

17+
registerUser: any = {
18+
firstName: '',
19+
lastName: '',
20+
email: '',
21+
password: ''
22+
}
23+
1324
private validate: FormGroup
1425
submitAttempt: boolean = false;
1526

16-
constructor(public navCtrl: NavController, public navParams: NavParams, private formbuilder: FormBuilder) {
17-
18-
this.validate = this.formbuilder.group({
27+
constructor(public navCtrl: NavController, public navParams: NavParams, private fb: FormBuilder, public _user: UserProvider) {
28+
29+
this.validate = this.fb.group({
1930
first: ['', Validators.compose([Validators.maxLength(30), Validators.pattern('[a-zA-Z ]*'), Validators.required])],
2031
last: ['', Validators.compose([Validators.maxLength(30), Validators.pattern('[a-zA-Z ]*'), Validators.required])],
2132
email: ['', Validators.compose([Validators.required, Validators.pattern('^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$')])],
@@ -31,9 +42,25 @@ export class RegisterPage {
3142
console.log('ionViewDidLoad RegisterPage');
3243
}
3344

34-
regForm(){
45+
submitReg() {
3546
this.submitAttempt = true
36-
console.log(this.validate)
47+
console.log('submitReg() runs', this.validate)
48+
this._user.sendReg(this.registerUser)
49+
.subscribe( (data: any) => {
50+
console.log('data from submitReg()', data)
51+
},
52+
err => {
53+
console.error('err from register:', err)
54+
//this.presentToast()
55+
},
56+
() => {
57+
this.navCtrl.setRoot(WizardPage, {registered: this.registerUser})
58+
}
59+
)
60+
}
61+
62+
goLogin() {
63+
this.navCtrl.setRoot(LoginPage)
3764
}
3865

3966
}

‎src/providers/user/user.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,10 +10,18 @@ import { Injectable } from '@angular/core';
1010
@Injectable()
1111
export class UserProvider {
1212

13+
regUrl: string = "https://j-reboot-backend.herokuapp.com/api/appUsers"
14+
1315
constructor(public http: HttpClient) {
1416
console.log('Hello UserProvider Provider');
1517
}
1618

19+
sendReg(user) {
20+
console.log('sendReg() runs')
21+
return this.http.post(this.regUrl, user)
22+
}
23+
24+
1725
login(creds) {
1826
return this.http.post('https://reboot-ssf.herokuapp.com/api/appUsers/login', creds);
1927
}

0 commit comments

Comments
 (0)