Add check boxes on register page

src/app/components/register/register.component.html

@@ -28,6 +28,14 @@
           </button>
         </mat-form-field>
       </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"
               (click)="onClickSubmit(username.value,email.value,password.value, repeatpassword.value)">Register
       </button>

src/app/components/register/register.component.sass

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

src/app/components/register/register.component.ts

@@ -14,6 +14,8 @@ export class RegisterComponent implements OnInit {
   errorMessage: string;
   hide1 = true;
   hide2 = true;
+  ageCheck = false;
+  imprintCheck = false;
 
   constructor(private registerService: RegisterService) {
     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) {
     this.errorOccurred = false;
     this.errorMessage = ' ';
-    if (this.passwordSame(pPasswordHash, pPasswordHashRepeat)) {
+    if (this.passwordSame(pPasswordHash, pPasswordHashRepeat) && this.boxesChecked()) {
       this.registration.username = pUsername.trim();
       this.registration.email = pEmail.trim().toLowerCase();
       this.registration.passwordHash = sha512.sha512(pPasswordHash);
@@ -38,7 +40,6 @@ export class RegisterComponent implements OnInit {
 
   passwordSame(pwd: string, pwd2: string) {
     if (pwd === pwd2) {
-      console.log('password same');
       return true;
     } else {
       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() {
   }