From c692efb1df7dfba7417d93e80d3cbda6b7f7f182 Mon Sep 17 00:00:00 2001
From: Sonja Galovic <galovicsonja@gmail.com>
Date: Sat, 2 Apr 2022 12:36:03 +0200
Subject: Profile page - validacija unosa kod izmene profila

---
 .../src/app/_pages/profile/profile.component.html  |   7 ++
 .../src/app/_pages/profile/profile.component.ts    | 118 +++++++++++++++++++--
 2 files changed, 116 insertions(+), 9 deletions(-)

(limited to 'frontend')

diff --git a/frontend/src/app/_pages/profile/profile.component.html b/frontend/src/app/_pages/profile/profile.component.html
index d082a003..557d69fd 100644
--- a/frontend/src/app/_pages/profile/profile.component.html
+++ b/frontend/src/app/_pages/profile/profile.component.html
@@ -30,12 +30,14 @@
                                     <label class="small mb-1" for="inputPassword">Važeća lozinka</label>
                                     <input class="form-control" id="inputPassword" name="inputPassword" type="password" [(ngModel)]="this.oldPass" placeholder="Trenutna lozinka">
                                     <small *ngIf="wrongPassBool" class="form-text text-danger">Neispravna lozinka.</small>
+                                    <small *ngIf="wrongOldPassBool" class="form-text text-danger">Pogrešan format.</small>
                                 </div>
                                 <!-- Form Group (new password)-->
                                 <div class="col-md-6">
                                     <label class="small mb-1" for="inputNewPassword">Nova lozinka</label>
                                     <input class="form-control" id="inputNewPassword" name="inputNewPassword" type="password" [(ngModel)]="this.newPass1" placeholder="Ukucaj novu lozinku">
                                     <small *ngIf="wrongNewPassBool" class="form-text text-danger">Lozinke se ne podudaraju.</small>
+                                    <small *ngIf="wrongNewPass1Bool" class="form-text text-danger">Pogrešan format.</small>
                                 </div>
                             </div>
     
@@ -52,6 +54,7 @@
                                     <label class="small mb-1" for="inputNewPasswordAgain">Ponovo nova lozinka</label>
                                     <input class="form-control" id="inputNewPasswordAgain" name="inputNewPasswordAgain" type="password" [(ngModel)]="this.newPass2" placeholder="Ukucaj novu lozinku">
                                     <small *ngIf="wrongNewPassBool" class="form-text text-danger">Lozinke se ne podudaraju.</small>
+                                    <small *ngIf="wrongNewPass2Bool" class="form-text text-danger">Pogrešan format.</small>
                                 </div>
                             </div>
                         </div>
@@ -73,11 +76,13 @@
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputUsername">Korisničko ime (kako će ostali korisnici videti tvoje ime)</label>
                                 <input class="form-control" id="inputUsername" name="inputUsername" type="text" [(ngModel)]="this.username">
+                                <small *ngIf="wrongUsernameBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                             <!-- Form Group (email address)-->
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputEmailAddress">Email adresa</label>
                                 <input class="form-control" id="inputEmailAddress" name="inputEmailAddress" type="email" [(ngModel)]="this.email">
+                                <small *ngIf="wrongEmailBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                         </div>
 
@@ -87,11 +92,13 @@
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputFirstName">Ime</label>
                                 <input class="form-control" id="inputFirstName" name="inputFirstName" type="text" [(ngModel)]="this.firstName">
+                                <small *ngIf="wrongFirstNameBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                             <!-- Form Group (last name)-->
                             <div class="col-md-6">
                                 <label class="small mb-1" for="inputLastName">Prezime</label>
                                 <input class="form-control" id="inputLastName" name="inputLastName" type="text" [(ngModel)]="this.lastName">
+                                <small *ngIf="wrongLastNameBool" class="form-text text-danger">Pogrešan format.</small>
                             </div>
                         </div>
 
diff --git a/frontend/src/app/_pages/profile/profile.component.ts b/frontend/src/app/_pages/profile/profile.component.ts
index 3e9a0d11..7a7796da 100644
--- a/frontend/src/app/_pages/profile/profile.component.ts
+++ b/frontend/src/app/_pages/profile/profile.component.ts
@@ -15,6 +15,8 @@ import shared from '../../Shared';
 })
 export class ProfileComponent implements OnInit {
 
+
+
   user: User = new User();
   pictures: Picture[] = PICTURES;
 
@@ -71,6 +73,9 @@ export class ProfileComponent implements OnInit {
   }
 
   saveInfoChanges() {
+    if (!(this.checkInfoChanges())) //nije prosao regex
+      return;
+
     let editedUser: User = {
       _id: this.user._id,
       username: this.username,
@@ -84,18 +89,20 @@ export class ProfileComponent implements OnInit {
     this.userInfoService.changeUserInfo(editedUser).subscribe((response: any) =>{
       if (this.user.username != editedUser.username) { //promenio username, ide logout
         this.user = editedUser;
+        this.resetInfo();
         alert("Nakon promene korisničkog imena, moraćete ponovo da se ulogujete.");
         this.authService.logOut();
         this.router.navigate(['']);
         return;
       }
+      alert("Podaci su uspešno promenjeni.");
       this.user = editedUser;
       console.log(this.user);
       this.resetInfo();
     }, (error: any) =>{
       if (error.error == "Username already exists!") {
         alert("Ukucano korisničko ime je već zauzeto!\nIzaberite neko drugo.");
-        (<HTMLSelectElement>document.getElementById("inputUsername")).focus();
+        //(<HTMLSelectElement>document.getElementById("inputUsername")).focus();
         //poruka obavestenja ispod inputa
         this.resetInfo();
       }
@@ -103,23 +110,26 @@ export class ProfileComponent implements OnInit {
   }
 
   savePasswordChanges() {
+    this.wrongPassBool = false;
+    this.wrongNewPassBool = false;
+
+    if (!(this.checkPasswordChanges())) //nije prosao regex
+      return;
+
     if (this.newPass1 == '' && this.newPass2 == '') //ne zeli da promeni lozinku
       return;
-    console.log("zeli da promeni lozinku");
+    //console.log("zeli da promeni lozinku");
 
     if (this.newPass1 != this.newPass2) { //netacno ponovio novu lozinku
       this.wrongNewPassBool = true;
       this.resetNewPassInputs();
-      console.log("Netacno ponovljena lozinka");
+      //console.log("Netacno ponovljena lozinka");
       return;
     }
 
-    this.wrongPassBool = false;
-    this.wrongNewPassBool = false;
-
     let passwordArray: string[] = [this.oldPass, this.newPass1];
     this.userInfoService.changeUserPassword(passwordArray).subscribe((response: any) => {
-      console.log("PROMENIO LOZINKU");
+      //console.log("PROMENIO LOZINKU");
       this.resetNewPassInputs();
       alert("Nakon promene lozinke, moraćete ponovo da se ulogujete.");
       this.authService.logOut();
@@ -128,13 +138,13 @@ export class ProfileComponent implements OnInit {
       console.log("error poruka: ", error.error);
       if (error.error == 'Wrong old password!') {
         this.wrongPassBool = true;
-        (<HTMLSelectElement>document.getElementById("inputPassword")).focus();
+        //(<HTMLSelectElement>document.getElementById("inputPassword")).focus();
         return;
       }
       else if (error.error == 'Identical password!') {
         alert("Stara i nova lozinka su identične.");
         this.resetNewPassInputs();
-        (<HTMLSelectElement>document.getElementById("inputNewPassword")).focus();
+        //(<HTMLSelectElement>document.getElementById("inputNewPassword")).focus();
         return;
       }
     });
@@ -161,5 +171,95 @@ export class ProfileComponent implements OnInit {
     shared.photoId = this.photoId;
   }
   
+  checkPasswordChanges() : boolean {
+    this.passwordValidation();
+
+    if (!(this.wrongOldPassBool || this.wrongNewPass1Bool || this.wrongNewPass2Bool))
+      return true;
+    return false;
+  }
+  checkInfoChanges() : boolean {
+    this.firstName = this.firstName.trim();
+    this.lastName = this.lastName.trim();
+    this.username = this.username.trim();
+    this.email = this.email.trim();
+
+    this.firstNameValidation();
+    this.lastNameValidation();
+    this.usernameValidation();
+    this.emailValidation();
+
+    if (!(this.wrongUsernameBool || this.wrongEmailBool || this.wrongFirstNameBool || this.wrongLastNameBool))
+      return true;
+    return false;
+  }
+
+  isCorrectName(element: string): boolean {
+    if (this.pattName.test(element) && !(this.pattTwoSpaces.test(element)) && (element.length >= 1 && element.length <= 30))
+      return true;
+    return false;
+  }
+  isCorrectUsername(element: string): boolean {
+    if (this.pattUsername.test(element) && !(this.pattTwoSpaces.test(element)) && (element.length >= 1 && element.length <= 30))
+      return true;
+    return false;
+  }
+  isCorrectEmail(element: string): boolean {
+    if (this.pattEmail.test(element.toLowerCase()) && element.length <= 320)
+      return true;
+    return false;
+  }
+  isCorrectPassword(element: string): boolean {
+    if (this.pattPassword.test(element))
+      return true;
+    return false;
+  }
+  firstNameValidation() {
+    if (this.isCorrectName(this.firstName) == true) {
+      this.wrongFirstNameBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('firstName')).focus();
+    this.wrongFirstNameBool = true;
+  }
+  lastNameValidation() {
+    if (this.isCorrectName(this.lastName) == true) {
+      this.wrongLastNameBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('lastName')).focus();
+    this.wrongLastNameBool = true;
+  }
+  usernameValidation() {
+    if (this.isCorrectUsername(this.username) == true) {
+      this.wrongUsernameBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('username-register')).focus();
+    this.wrongUsernameBool = true;
+  }
+  emailValidation() {
+    if (this.isCorrectEmail(this.email) == true) {
+      this.wrongEmailBool = false;
+      return;
+    }
+    //(<HTMLSelectElement>document.getElementById('email')).focus();
+    this.wrongEmailBool = true;
+  }
+  passwordValidation() {
+    if (this.isCorrectPassword(this.oldPass) && this.isCorrectPassword(this.newPass1) && this.newPass1 == this.newPass2) {
+      this.wrongOldPassBool = false;
+      this.wrongNewPass1Bool = false;
+      this.wrongNewPass2Bool = false;
+      return;
+    }
+    this.oldPass = '';
+    this.newPass1 = '';
+    this.newPass2 = '';
+    //(<HTMLSelectElement>document.getElementById('pass1')).focus();
+    this.wrongOldPassBool = true;
+    this.wrongNewPass1Bool = true;
+    this.wrongNewPass2Bool = true;
+  }
 
 }
-- 
cgit v1.2.3