Add check boxes on register page

master
Max 5 years ago
parent 6b5daded46
commit 5eac1567c4

@ -28,6 +28,14 @@
</button> </button>
</mat-form-field> </mat-form-field>
</div> </div>
<p class="check-box">
<mat-checkbox color="primary" [(ngModel)]="ageCheck" >I am older than 16 years.
</mat-checkbox>
</p>
<p class="check-box">
<mat-checkbox color="primary" [(ngModel)]="imprintCheck">I've read the <a routerLink="/imprint">privacy policy</a>.
</mat-checkbox>
</p>
<button mat-raised-button color="primary" <button mat-raised-button color="primary"
(click)="onClickSubmit(username.value,email.value,password.value, repeatpassword.value)">Register (click)="onClickSubmit(username.value,email.value,password.value, repeatpassword.value)">Register
</button> </button>

@ -5,6 +5,8 @@
padding: 2em padding: 2em
max-width: 35em max-width: 35em
margin: 0 auto margin: 0 auto
::ng-deep a
color: $primary-color
.example-container .example-container
display: flex display: flex
@ -26,6 +28,10 @@ input.example-right-align
.mat-error .mat-error
margin-bottom: 0.25em margin-bottom: 0.25em
.check-box
float: left
margin-right: 1em
.mat-raised-button .mat-raised-button
margin: 0.25em margin: 0.25em
width: 100% width: 100%

@ -14,6 +14,8 @@ export class RegisterComponent implements OnInit {
errorMessage: string; errorMessage: string;
hide1 = true; hide1 = true;
hide2 = true; hide2 = true;
ageCheck = false;
imprintCheck = false;
constructor(private registerService: RegisterService) { constructor(private registerService: RegisterService) {
this.registration = {username: null, passwordHash: null, email: null}; this.registration = {username: null, passwordHash: null, email: null};
@ -28,7 +30,7 @@ export class RegisterComponent implements OnInit {
onClickSubmit(pUsername: string, pEmail: string, pPasswordHash: string, pPasswordHashRepeat: string) { onClickSubmit(pUsername: string, pEmail: string, pPasswordHash: string, pPasswordHashRepeat: string) {
this.errorOccurred = false; this.errorOccurred = false;
this.errorMessage = ' '; this.errorMessage = ' ';
if (this.passwordSame(pPasswordHash, pPasswordHashRepeat)) { if (this.passwordSame(pPasswordHash, pPasswordHashRepeat) && this.boxesChecked()) {
this.registration.username = pUsername.trim(); this.registration.username = pUsername.trim();
this.registration.email = pEmail.trim().toLowerCase(); this.registration.email = pEmail.trim().toLowerCase();
this.registration.passwordHash = sha512.sha512(pPasswordHash); this.registration.passwordHash = sha512.sha512(pPasswordHash);
@ -38,7 +40,6 @@ export class RegisterComponent implements OnInit {
passwordSame(pwd: string, pwd2: string) { passwordSame(pwd: string, pwd2: string) {
if (pwd === pwd2) { if (pwd === pwd2) {
console.log('password same');
return true; return true;
} else { } else {
this.errorOccurred = true; this.errorOccurred = true;
@ -47,6 +48,21 @@ export class RegisterComponent implements OnInit {
} }
} }
boxesChecked(): boolean {
if (this.imprintCheck && this.ageCheck) {
console.log('all boxes checked');
return true;
} else {
this.errorOccurred = true;
if (!this.ageCheck) {
this.errorMessage = 'You have to confirm your age.';
} else if (!this.imprintCheck) {
this.errorMessage = 'You have to confirm that you read the privacy policy.';
}
return false;
}
}
ngOnInit() { ngOnInit() {
} }

Loading…
Cancel
Save