# 20th August Report

## Progress

Time: **09:00**
Event: Entering the lab

---

### Full documentation

Time: **10:23**
Event: Finish with Home page documentation
- Back end

Time: **13:38**
Event: Finish with Forgot Password page documentation
- Front end (HTML)
- Back end (TS)

Time: **15:30**
Event: Finish with Login page documentation
- Front end (HTML)
- Back end (TS)

Time: **16:26**
Event: Finish with Register page documentation
- Front end (HTML)
- Back end (TS)

Time: **16:52**
Event: Finish with Reset Password page documentation
- Front end (HTML)
- Back end (TS)

---

### Add REGEX into Register page and Reset Password page

Time: **16:33**
- REGEX for Register page and Reset Password page is a handler to prevent invalid input on email address and password.
- In **register.page.ts**

    export class RegisterPage implements OnInit {

      email = "";
      password = "";
      emailFalse = false;
      passwordFalse = false;

      checkEmail (email: string) {

        // regex logic for Email address
        let regexString = '[^@]+@[^\.\..+]+';
        let reg = new RegExp(regexString);

        // set emailFalse value with testing regex from input
        this.emailFalse = !reg.test(email);
      }

      checkPassword (password: string) {

        // regex logic for Password
        let regexString = '^(?=.*[0-9]+.*)(?=.*[a-zA-Z]+.*)[0-9a-zA-Z]{8,}$';
        let reg = new RegExp(regexString);

        // set emailFalse value with testing regex from input
        this.passwordFalse = !reg.test(password);    
      }
    }

- The REGEX function is same as the function in User/Student App.
- Email address must contains **@** symbol and valid domain on the end of email.
- Password must contains at least 1 alphabet, 1 number, and minimum 8 characters.

- In **register.page.html**

    <ion-item>
      <ion-label position="floating">Company Email Address</ion-label>
      <ion-input required type="email" [(ngModel)]="email" (change)=checkEmail(email)></ion-input>
      <p *ngIf="emailFalse" class="falseInput">Email is invalid or must be company domain!</p>
    </ion-item>

    <ion-item>
      <ion-label position="floating">Password</ion-label>
      <ion-input required type="password" [(ngModel)]="password" (change)=checkPassword(password)></ion-input>
      <p *ngIf="passwordFalse" class="falseInput">Password must minimum 6 character with at least contains 1 alphabet and 1 number!</p>
    </ion-item>

- When the `emailFalse` is true then it will shows warning text (color RED) to warns that the email is invalid.
- It has same as `passwordFalse` with warning text.

- In **Reset Password page**, only use the checkPassword because new input for password only, use the same code and same method.

---

## Conclusion
- Add documentation with comment lines for Home page, Login page, Register page, Forgot Password page, and Reset Password page.
- Add REGEX function to handle invalid input on Register page and Reset Password page.

---

Time: **18:00**
Event: Leaving the lab

###### tags: `on-intern`