Merge pull request #234 from COS301-SE-2023/WIP-66-ISSUE-ui-feedback

Wip 66 issue UI feedback
COS301-SE-2023 · Oct 27, 2023 · da7a3dc · da7a3dc
2 parents 244c5f6 + dc67e35
commit da7a3dc
Show file tree

Hide file tree

Showing 4 changed files with 57 additions and 8 deletions.
diff --git a/app/WhereIsThePower/src/app/shared/components/signup/signup.component.html b/app/WhereIsThePower/src/app/shared/components/signup/signup.component.html
@@ -50,6 +50,15 @@ <h3 class="ion-padding-start"><ion-text color="primary">Where Is the Power?</ion
       <ion-text color="danger" *ngIf="signupForm.get('password')!.hasError('minlength')" class="ion-padding-start">
         Password must be at least 8 characters
       </ion-text>
+
+      <ion-item>
+        <ion-label position="floating">Confirm Password</ion-label>
+        <ion-input type="password" formControlName="confirmPassword" aria-label="Confrim Password"></ion-input>
+      </ion-item>
+      <ion-text color="danger" *ngIf="signupForm.get('confirmPassword')!.hasError('matchingErr')" class="ion-padding-start">
+        Passwords do not match
+      </ion-text>
+
       <div class="ion-padding-top">
         <ion-button expand="block" type="submit" data-cy="btn-confirm-signup" class="ion-margin-top ion-margin-start">Signup</ion-button>
       </div>

diff --git a/app/WhereIsThePower/src/app/shared/components/signup/signup.component.ts b/app/WhereIsThePower/src/app/shared/components/signup/signup.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { ToastController } from '@ionic/angular';
 import { RegisterUser } from '../../models/register-user';
@@ -27,16 +27,28 @@ export class SignupComponent implements OnInit {
     lastName: ['', [Validators.required]],
     email: ['', [Validators.required, Validators.email]],
     password: ['', [Validators.required, Validators.minLength(8)]],
+    confirmPassword: ['', Validators.required],
   });
 
+
   constructor(
     private router: Router,
     private formBuilder: FormBuilder,
     private toastController: ToastController,
     private authService: AuthService,
     public modalController: ModalController,
     private loadingController: LoadingController
-  ) { }
+  ) {
+    this.signupForm.addValidators(
+      this.comparePasswordValidator(
+        this.signupForm.controls['password'],
+        this.signupForm.controls['confirmPassword']
+      )
+    );
+   }
+
+
+
 
 
   ngOnInit() { }
@@ -45,7 +57,24 @@ export class SignupComponent implements OnInit {
     this.modalController.dismiss();
   }
 
+
+  comparePasswordValidator(passwordOne: AbstractControl, passwordTwo: AbstractControl) {
+      return () => {
+      if (passwordOne.value !== passwordTwo.value) {
+        console.log("Passwords do not match")
+        return { match_error: 'matchingErr' };
+      }
+
+      return null;
+    };
+  }
+
   signup() {
+    if(this.signupForm.value.password !== this.signupForm.value.confirmPassword) {
+      this.failToast('Passwords do not match');
+      return;
+    }
+
     if (this.signupForm.valid) {
       this.newUser.firstName = this.signupForm.value.firstName;
       this.newUser.lastName = this.signupForm.value.lastName;

diff --git a/app/WhereIsThePower/src/app/tab-schedule/tab-schedule.page.html b/app/WhereIsThePower/src/app/tab-schedule/tab-schedule.page.html
@@ -32,9 +32,12 @@ <h3><strong>{{ result.name }}</strong></h3>
     <ion-row *ngIf="isLocationProvided && isAreaFound; else areaNotAvailable">
       <ion-col size="12" class="ion-text-center"><h2>{{ suburbName }}</h2></ion-col>
       <ion-col size="12" class="ion-text-center">
-        <ion-chip [color]="chipColor">
+        <ion-chip *ngIf="loadsheddingStage > 0" [color]="chipColor">
           Current Stage: {{ loadsheddingStage }}
         </ion-chip>
+        <ion-chip *ngIf="loadsheddingStage <= 0" [color]="chipColor">
+          No Loadshedding
+        </ion-chip>
       </ion-col>
       <ion-col>     
         <ion-card *ngFor="let time of loadshedTimes">

diff --git a/app/WhereIsThePower/src/app/tab-statistics/tab-statistics.page.ts b/app/WhereIsThePower/src/app/tab-statistics/tab-statistics.page.ts
@@ -83,15 +83,23 @@ export class TabStatisticsPage implements OnInit {
 
   processDoughnutChart(data: any) {
     // Get today's day name (e.g., "Mon", "Tue", etc.)
+
     const today = new Date().toLocaleDateString('en-US', { weekday: 'short' });
+    //const today = "Wed";
 
+    //console.log("WEDNESDAY", data.result.perDayTimes["Wed"]);
     // Get the on and off values for today's day from the data
-    const todayOnValue = data.result.perDayTimes[today]?.on || 0;
-    const todayOffValue = data.result.perDayTimes[today]?.off || 0;
+    let uptimeToday = 24;
+    let downtimeToday = 0;
+    if (data.result.perDayTimes[today] != undefined) {
+      const todayOnValue = data.result.perDayTimes[today]?.on || 0;
+      const todayOffValue = data.result.perDayTimes[today]?.off || 0;
+
+      // Convert total uptime and downtime to hours
+      uptimeToday = Math.floor(todayOnValue / 60);
+      downtimeToday = Math.floor(todayOffValue / 60);
+    }
 
-    // Convert total uptime and downtime to hours
-    const uptimeToday = Math.floor(todayOnValue / 60);
-    const downtimeToday = Math.floor(todayOffValue / 60);
 
     // Data for Doughnut Chart (Uptime/Downtime for Today)
     const doughnutData = {