From 69984d735034ba4119d668f0eebb086dad979670 Mon Sep 17 00:00:00 2001 From: Derek Holloway Date: Mon, 25 Aug 2025 21:12:34 -0700 Subject: [PATCH] Add email and phone validators --- src/Client/src/app/app.ts | 1 - .../company/editor/editor.component.html | 4 +- .../pages/company/editor/editor.component.ts | 37 ++++++++++++++++++- .../resumes/editor/editor.component.html | 4 +- .../pages/resumes/editor/editor.component.ts | 17 ++++++++- src/Client/src/app/services/Validation.ts | 35 ++++++++++++++++++ 6 files changed, 91 insertions(+), 7 deletions(-) create mode 100644 src/Client/src/app/services/Validation.ts diff --git a/src/Client/src/app/app.ts b/src/Client/src/app/app.ts index 6d4ec07..5048ec6 100644 --- a/src/Client/src/app/app.ts +++ b/src/Client/src/app/app.ts @@ -20,7 +20,6 @@ export class App { this.devMode = isDevMode(); this.route.queryParams.subscribe(params => { this.loginToken = params['LoginToken']; - console.log("LoginToken : " + this.loginToken); if (this.loginToken){ this.http.post( "api/account/loginticket", JSON.stringify(this.loginToken), { headers: {'Content-Type': 'application/json'} } ).subscribe({ next: async() => { diff --git a/src/Client/src/app/pages/company/editor/editor.component.html b/src/Client/src/app/pages/company/editor/editor.component.html index 53a4e56..8b85075 100644 --- a/src/Client/src/app/pages/company/editor/editor.component.html +++ b/src/Client/src/app/pages/company/editor/editor.component.html @@ -60,11 +60,11 @@
- +
- +
diff --git a/src/Client/src/app/pages/company/editor/editor.component.ts b/src/Client/src/app/pages/company/editor/editor.component.ts index e0b5b60..41eab5e 100644 --- a/src/Client/src/app/pages/company/editor/editor.component.ts +++ b/src/Client/src/app/pages/company/editor/editor.component.ts @@ -6,6 +6,7 @@ import { Title } from '@angular/platform-browser'; import { CommonModule } from '@angular/common'; import { Authentication } from 'app/services/Authentication'; import { Company } from 'app/models/Company'; +import { Validation } from 'app/services/Validation'; @Component({ selector: 'main-company-editor', @@ -23,7 +24,7 @@ export class CompanyEditorComponent { public ErrorMsg: string = ""; MaxFileMB: number = 3; - constructor( private http: HttpClient, private router: Router, private route: ActivatedRoute, private title: Title, public auth: Authentication ) { + constructor( private http: HttpClient, private router: Router, private route: ActivatedRoute, private title: Title, public auth: Authentication, public validator: Validation ) { this.title.setTitle("Company - Editor | BoredCareers"); if (!auth.isLoggedIn){ router.navigate(["/"]); @@ -54,6 +55,18 @@ export class CompanyEditorComponent { this.updateUI(0); } + validatePhone(input: string){ + let result = this.validator.validatePhoneNumber(input); + this.newListing.phone = result[1]; + } + + validateEmail(input: string){ + let result = this.validator.validateEmail(input); + if (result[0]){ + this.newListing.email = result[1]; + } + } + @HostListener('window:keydown', ['$event']) handleGlobalKeyDown(event: KeyboardEvent){ if ( event.key === 'Tab' ){ @@ -122,51 +135,73 @@ export class CompanyEditorComponent { PostNewCompany(company: Company){ if (this.isNullOrEmpty(company.name)){ + this.ErrorMsg = "Comany name is blank"; this.focusFrame(0, 0); return; } if (this.isNullOrEmpty(company.websiteURL)){ + this.ErrorMsg = "Website URL is blank"; this.focusFrame(1, 0); return; } if (this.isNullOrEmpty(company.logo)){ + this.ErrorMsg = "Logo is blank"; this.focusFrame(2, 0); return; } if (this.isNullOrEmpty(company.email)){ + this.ErrorMsg = "Email is blank"; + this.focusFrame(3, 0); + return; + } + + if (this.validator.validateEmail(company.email)[0]){ + this.ErrorMsg = "Email is invalid"; this.focusFrame(3, 0); return; } if (this.isNullOrEmpty(company.phone)){ + this.ErrorMsg = "Phone number is blank"; + this.focusFrame(3, 1); + return; + } + + if (this.validator.validatePhoneNumber(company.phone)[0]){ + this.ErrorMsg = "Phone number is invalid"; this.focusFrame(3, 1); return; } if (this.isNullOrEmpty(company.city)){ + this.ErrorMsg = "City is blank"; this.focusFrame(4, 0); return; } if (this.isNullOrEmpty(company.country)){ + this.ErrorMsg = "Country is blank"; this.focusFrame(4, 1); return; } if (this.isNullOrEmpty(company.stateOrRegion)){ + this.ErrorMsg = "State or Region is blank"; this.focusFrame(4, 2); return; } if (this.isNullOrEmpty(company.postalCode)){ + this.ErrorMsg = "Postal Code is blank"; this.focusFrame(4, 3); return; } if (this.isNullOrEmpty(company.description)){ + this.ErrorMsg = "Description is blank"; this.focusFrame(5, 0); return; } diff --git a/src/Client/src/app/pages/resumes/editor/editor.component.html b/src/Client/src/app/pages/resumes/editor/editor.component.html index 26833a1..c3ce681 100644 --- a/src/Client/src/app/pages/resumes/editor/editor.component.html +++ b/src/Client/src/app/pages/resumes/editor/editor.component.html @@ -23,8 +23,8 @@
- - + +
diff --git a/src/Client/src/app/pages/resumes/editor/editor.component.ts b/src/Client/src/app/pages/resumes/editor/editor.component.ts index 0663fa5..f4c8ee9 100644 --- a/src/Client/src/app/pages/resumes/editor/editor.component.ts +++ b/src/Client/src/app/pages/resumes/editor/editor.component.ts @@ -6,6 +6,7 @@ import { Title } from '@angular/platform-browser'; import { CommonModule } from '@angular/common'; import { Resume, ResumeCertification, ResumeEducation, ResumeExperience, ResumeExperienceBullet, ResumeLanguage, ResumeMilitary, ResumeMilitaryBullet, ResumeProject, ResumeSkill } from 'app/models/Resume'; import { Authentication } from 'app/services/Authentication'; +import { Validation } from 'app/services/Validation'; @Component({ selector: 'main-resume-editor', @@ -20,7 +21,7 @@ export class ResumesEditorComponent { public ErrorMsg: string = ""; - constructor( private http: HttpClient, private router: Router, private route: ActivatedRoute, private title: Title, public auth: Authentication ) { + constructor( private http: HttpClient, private router: Router, private route: ActivatedRoute, private title: Title, public auth: Authentication, public validator: Validation ) { this.title.setTitle("Resume - Editor | BoredCareers"); if (!this.auth.isLoggedIn){ this.router.navigate(["/"]); @@ -87,6 +88,20 @@ export class ResumesEditorComponent { }); } + validatePhone(input: string){ + let result = this.validator.validatePhoneNumber(input); + if (result[0]){ + this.resume.phoneNumber = result[1]; + } + } + + validateEmail(input: string){ + let result = this.validator.validateEmail(input); + if (result[0]){ + this.resume.email = result[1]; + } + } + PrintResume(){ const divToPrint = document.getElementsByClassName("paper")[0]; diff --git a/src/Client/src/app/services/Validation.ts b/src/Client/src/app/services/Validation.ts new file mode 100644 index 0000000..56314ea --- /dev/null +++ b/src/Client/src/app/services/Validation.ts @@ -0,0 +1,35 @@ +import { Injectable } from "@angular/core"; + +@Injectable({ providedIn: 'root' }) +export class Validation { + + constructor(){ } + + validatePhoneNumber(input: string): [boolean, string] { + var sanitized = input.replace(/\D/g, ''); + if (sanitized.length < 10){ + let formatted = sanitized.replace(/(\d{3})(?=\d{3})/g, '$1-').replace(/(\d{4})(?=\d{1,4}$)/, '$1-'); + return [false, formatted]; + } else if (sanitized.length === 10) { + let result = `(${sanitized.slice(0, 3)})${sanitized.slice(3, 6)}-${sanitized.slice(6, 10)}`; + return [true, result]; + } else if (sanitized.length > 10 && sanitized.length < 14) { + let countryCode = sanitized.slice(0, sanitized.length - 10); + let areaCode = sanitized.slice(sanitized.length - 10, sanitized.length - 7); + let firstPart = sanitized.slice(sanitized.length - 7, sanitized.length - 4); + let secondPart = sanitized.slice(sanitized.length - 4); + let result = `+${countryCode} (${areaCode})${firstPart}-${secondPart}`; + return [true, result]; + }else{ + return [false, input]; + } + } + + emailRegex: RegExp = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; + validateEmail(input: string): [boolean, string] { + const corrected = input.trim().toLowerCase(); + const success = this.emailRegex.test(corrected); + return [success, corrected]; + } + +} \ No newline at end of file