+
-
+
-
-
-
+
+
+
Login With Google
-
-
+
+
Login With Github
-
-
diff --git a/src/app/header/header-popup/login/login.component.spec.ts b/src/app/header/header-popup/login/login.component.spec.ts
index b4fcab3..b6637ca 100644
--- a/src/app/header/header-popup/login/login.component.spec.ts
+++ b/src/app/header/header-popup/login/login.component.spec.ts
@@ -8,9 +8,8 @@ describe('LoginComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ LoginComponent ]
- })
- .compileComponents();
+ declarations: [LoginComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(LoginComponent);
component = fixture.componentInstance;
diff --git a/src/app/header/header-popup/login/login.component.ts b/src/app/header/header-popup/login/login.component.ts
index 9184125..f96873e 100644
--- a/src/app/header/header-popup/login/login.component.ts
+++ b/src/app/header/header-popup/login/login.component.ts
@@ -1,24 +1,44 @@
-import { AfterViewInit, ChangeDetectorRef, Component, EventEmitter, Input, OnDestroy, OnInit, Output } from '@angular/core';
+import {
+ AfterViewInit,
+ ChangeDetectorRef,
+ Component,
+ EventEmitter,
+ Input,
+ OnDestroy,
+ OnInit,
+ Output,
+} from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';
import { faLock, faUser } from '@fortawesome/free-solid-svg-icons';
-import {Subscription} from 'rxjs';
+import { Subscription } from 'rxjs';
import { AuthService } from 'src/app/shared/auth/auth.service';
import { HttpError } from 'src/app/shared/model/httpError/httpError.model';
import HttpErrorChecker from 'src/app/shared/model/httpError/httpErrorChecker';
import UserChecker from 'src/app/shared/model/user/user.checker';
import { User } from 'src/app/shared/model/user/user.model';
-import {animate, animateChild, group, query, state, style, transition, trigger} from "@angular/animations";
-import {ValidatePasswordValidator} from "../../../shared/validators/validate-password.validator";
-import {ValidateNotEmptyValidator} from "../../../shared/validators/validate-not-empty.validator";
-import {NgcCookieConsentService, NgcStatusChangeEvent} from "ngx-cookieconsent";
-import {CookieConsertService} from "../../../shared/cookie-consent/cookie-consert.service";
+import {
+ animate,
+ animateChild,
+ group,
+ query,
+ state,
+ style,
+ transition,
+ trigger,
+} from '@angular/animations';
+import { ValidatePasswordValidator } from '../../../shared/validators/validate-password.validator';
+import { ValidateNotEmptyValidator } from '../../../shared/validators/validate-not-empty.validator';
+import {
+ NgcCookieConsentService,
+ NgcStatusChangeEvent,
+} from 'ngx-cookieconsent';
+import { CookieConsertService } from '../../../shared/cookie-consent/cookie-consert.service';
-
-const GOOGLE_LOGO_SVG = "assets/img/providers/google.svg";
-const GOOGLE_DISABLED_LOGO_SVG = "assets/img/providers/google-disabled.svg";
-const GITHUB_LOGO_SVG = "assets/img/providers/github.svg";
+const GOOGLE_LOGO_SVG = 'assets/img/providers/google.svg';
+const GOOGLE_DISABLED_LOGO_SVG = 'assets/img/providers/google-disabled.svg';
+const GITHUB_LOGO_SVG = 'assets/img/providers/github.svg';
@Component({
selector: 'app-login',
@@ -26,78 +46,66 @@ const GITHUB_LOGO_SVG = "assets/img/providers/github.svg";
styleUrls: ['./login.component.css'],
animations: [
trigger('resizeContainerForErrorMessage', [
- state('hide',
+ state(
+ 'hide',
style({
height: '100px',
width: '320px',
- })
+ }),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('1s ease')
- ])
- )
+ query('@*', animateChild(), { optional: true }),
+ animate('1s ease'),
+ ]),
+ ),
]),
trigger('showErrorMessage', [
- state('show',
+ state(
+ 'show',
style({
opacity: 1,
height: '100px',
width: '320px',
- })
+ }),
),
- state('hide',
+ state(
+ 'hide',
style({
opacity: 0,
height: '0px',
width: '0px',
- })
- ),
- transition(
- '* => show',
- animate(
- '500ms ease-in'
- )
+ }),
),
+ transition('* => show', animate('500ms ease-in')),
]),
trigger('hideAuthContainer', [
- state('hide',
+ state(
+ 'hide',
style({
opacity: 0,
- })
+ }),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate(
- '250ms ease-out'
- )
- ])
- )
+ query('@*', animateChild(), { optional: true }),
+ animate('250ms ease-out'),
+ ]),
+ ),
]),
- ]
+ ],
})
export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
+ @Input()
+ state: boolean = false;
@Input()
- state: boolean = false;
-
- @Input()
- ignoreClickOutside!: HTMLDivElement[];
+ ignoreClickOutside!: HTMLDivElement[];
@Output()
- stateChange = new EventEmitter
();
+ stateChange = new EventEmitter();
loginForm!: FormGroup;
@@ -121,39 +129,47 @@ export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
private cookieConsentService: CookieConsertService,
private changeDetectorRef: ChangeDetectorRef,
private matIconRegistry: MatIconRegistry,
- private domSanitizer: DomSanitizer) {
+ private domSanitizer: DomSanitizer,
+ ) {
this.matIconRegistry.addSvgIcon(
- "google-logo",
- this.domSanitizer.bypassSecurityTrustResourceUrl(GOOGLE_LOGO_SVG)
+ 'google-logo',
+ this.domSanitizer.bypassSecurityTrustResourceUrl(GOOGLE_LOGO_SVG),
);
this.matIconRegistry.addSvgIcon(
- "google-disabled-logo",
- this.domSanitizer.bypassSecurityTrustResourceUrl(GOOGLE_DISABLED_LOGO_SVG)
- )
+ 'google-disabled-logo',
+ this.domSanitizer.bypassSecurityTrustResourceUrl(
+ GOOGLE_DISABLED_LOGO_SVG,
+ ),
+ );
this.matIconRegistry.addSvgIcon(
- "github-logo",
- this.domSanitizer.bypassSecurityTrustResourceUrl(GITHUB_LOGO_SVG)
+ 'github-logo',
+ this.domSanitizer.bypassSecurityTrustResourceUrl(GITHUB_LOGO_SVG),
);
}
ngOnInit(): void {
this.loginForm = new FormGroup({
- 'username': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
- 'password': new FormControl(null, [Validators.required, ValidatePasswordValidator])
+ username: new FormControl(null, [
+ Validators.required,
+ ValidateNotEmptyValidator,
+ ]),
+ password: new FormControl(null, [
+ Validators.required,
+ ValidatePasswordValidator,
+ ]),
});
this.errorMessage = null;
- this.authSubject = this.authService.authSubject.subscribe(
- res => {
- this.validateLogin(res);
- }
- );
+ this.authSubject = this.authService.authSubject.subscribe((res) => {
+ this.validateLogin(res);
+ });
- this.cookieStatusChangeSubscription = this.cookieConsentService.cookieStatusChangeSubscription.subscribe(
- (status: boolean) => {
- this.isCookieBlocked = !status;
- console.log("Cookie status: " + status);
- }
- );
+ this.cookieStatusChangeSubscription =
+ this.cookieConsentService.cookieStatusChangeSubscription.subscribe(
+ (status: boolean) => {
+ this.isCookieBlocked = !status;
+ console.log('Cookie status: ' + status);
+ },
+ );
if (this.isCookieBlocked) {
this.ccService.fadeIn();
@@ -176,8 +192,8 @@ export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
onLogin() {
let user: User = {
username: this.loginForm.controls['username'].value,
- password: this.loginForm.controls['password'].value
- }
+ password: this.loginForm.controls['password'].value,
+ };
this.authService.login(user);
}
@@ -191,11 +207,11 @@ export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
private validateLogin(res: User | HttpError | null) {
if (res && UserChecker.test(res)) {
- this.closePopup()
- } if (HttpErrorChecker.test(res)) {
+ this.closePopup();
+ }
+ if (HttpErrorChecker.test(res)) {
this.errorMessage = (res).details;
}
-
}
private closePopup() {
@@ -205,23 +221,22 @@ export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
public showErrorMessage(): string {
if (this.isShowErrorMessage) {
- return "show";
+ return 'show';
}
- return "hide";
+ return 'hide';
}
public hideErrorMessage(): string {
if (!!this.errorMessage) {
- return "hide";
+ return 'hide';
}
- return "show";
+ return 'show';
}
hideAuthContainer(event: any) {
- if (event.toState === "hide") {
- event.element.style.display = "none";
+ if (event.toState === 'hide') {
+ event.element.style.display = 'none';
this.isShowErrorMessage = true;
}
}
-
}
diff --git a/src/app/header/header-popup/my-profile/my-profile.component.css b/src/app/header/header-popup/my-profile/my-profile.component.css
index 325ac10..098249c 100644
--- a/src/app/header/header-popup/my-profile/my-profile.component.css
+++ b/src/app/header/header-popup/my-profile/my-profile.component.css
@@ -36,7 +36,6 @@
}
.profile-options-container button {
-
text-decoration: none;
border-radius: 8px;
color: #ffffff;
@@ -55,9 +54,7 @@
background-color: rgba(216, 41, 28, 0.7) !important;
}
-
-@media (min-width:767px) {
-
+@media (min-width: 767px) {
.profile-options-container {
all: unset;
justify-content: space-around;
@@ -96,5 +93,4 @@
border-radius: 50px;
height: 100%;
}
-
}
diff --git a/src/app/header/header-popup/my-profile/my-profile.component.html b/src/app/header/header-popup/my-profile/my-profile.component.html
index b678bfb..15789bb 100644
--- a/src/app/header/header-popup/my-profile/my-profile.component.html
+++ b/src/app/header/header-popup/my-profile/my-profile.component.html
@@ -1,23 +1,28 @@
-
-
-
-
-
+
+
+
-
-
+
-
+ (imageSent)="onProfilePictureSent($event)"
+ >
@@ -26,16 +31,11 @@
-
+
Delete Account
-
-
-
-
diff --git a/src/app/header/header-popup/my-profile/my-profile.component.spec.ts b/src/app/header/header-popup/my-profile/my-profile.component.spec.ts
index 3141cca..ed5efc8 100644
--- a/src/app/header/header-popup/my-profile/my-profile.component.spec.ts
+++ b/src/app/header/header-popup/my-profile/my-profile.component.spec.ts
@@ -3,21 +3,20 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { MyProfileComponent } from './my-profile.component';
describe('MyProfileComponent', () => {
- let component: MyProfileComponent;
- let fixture: ComponentFixture;
+ let component: MyProfileComponent;
+ let fixture: ComponentFixture;
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ MyProfileComponent ]
- })
- .compileComponents();
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [MyProfileComponent],
+ }).compileComponents();
- fixture = TestBed.createComponent(MyProfileComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
+ fixture = TestBed.createComponent(MyProfileComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
- it('should create', () => {
- expect(component).toBeTruthy();
- });
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
});
diff --git a/src/app/header/header-popup/my-profile/my-profile.component.ts b/src/app/header/header-popup/my-profile/my-profile.component.ts
index bce74ee..ee46287 100644
--- a/src/app/header/header-popup/my-profile/my-profile.component.ts
+++ b/src/app/header/header-popup/my-profile/my-profile.component.ts
@@ -1,18 +1,33 @@
-import {ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
-import {AuthService} from "../../../shared/auth/auth.service";
-import {User} from "../../../shared/model/user/user.model";
-import {animate, animateChild, group, query, state, style, transition, trigger} from "@angular/animations";
-import {MatIconRegistry} from "@angular/material/icon";
-import {DomSanitizer} from "@angular/platform-browser";
-import {FormControl, FormGroup, Validators} from "@angular/forms";
-import {ValidateNotEmptyValidator} from "../../../shared/validators/validate-not-empty.validator";
-import {ValidatePasswordValidator} from "../../../shared/validators/validate-password.validator";
-import {first, take} from "rxjs";
-import UserChecker from "../../../shared/model/user/user.checker";
-import HttpErrorChecker from "../../../shared/model/httpError/httpErrorChecker";
-import {HttpError} from "../../../shared/model/httpError/httpError.model";
-import {faFileUpload} from "@fortawesome/free-solid-svg-icons";
-
+import {
+ ChangeDetectorRef,
+ Component,
+ EventEmitter,
+ Input,
+ OnInit,
+ Output,
+} from '@angular/core';
+import { AuthService } from '../../../shared/auth/auth.service';
+import { User } from '../../../shared/model/user/user.model';
+import {
+ animate,
+ animateChild,
+ group,
+ query,
+ state,
+ style,
+ transition,
+ trigger,
+} from '@angular/animations';
+import { MatIconRegistry } from '@angular/material/icon';
+import { DomSanitizer } from '@angular/platform-browser';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { ValidateNotEmptyValidator } from '../../../shared/validators/validate-not-empty.validator';
+import { ValidatePasswordValidator } from '../../../shared/validators/validate-password.validator';
+import { first, take } from 'rxjs';
+import UserChecker from '../../../shared/model/user/user.checker';
+import HttpErrorChecker from '../../../shared/model/httpError/httpErrorChecker';
+import { HttpError } from '../../../shared/model/httpError/httpError.model';
+import { faFileUpload } from '@fortawesome/free-solid-svg-icons';
@Component({
selector: 'app-my-profile',
@@ -20,81 +35,69 @@ import {faFileUpload} from "@fortawesome/free-solid-svg-icons";
styleUrls: ['./my-profile.component.css'],
animations: [
trigger('resizeContainerForErrorMessage', [
- state('hide',
+ state(
+ 'hide',
style({
height: '100px',
width: '320px',
- })
+ }),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('1s ease')
- ])
- )
+ query('@*', animateChild(), { optional: true }),
+ animate('1s ease'),
+ ]),
+ ),
]),
trigger('showErrorMessage', [
- state('show',
+ state(
+ 'show',
style({
opacity: 1,
height: '100px',
width: '320px',
- })
+ }),
),
- state('hide',
+ state(
+ 'hide',
style({
opacity: 0,
height: '0px',
width: '0px',
- })
- ),
- transition(
- '* => show',
- animate(
- '500ms ease-in'
- )
+ }),
),
+ transition('* => show', animate('500ms ease-in')),
]),
trigger('hideAuthContainer', [
- state('hide',
+ state(
+ 'hide',
style({
opacity: 0,
- })
+ }),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate(
- '250ms ease-out'
- )
- ])
- )
+ query('@*', animateChild(), { optional: true }),
+ animate('250ms ease-out'),
+ ]),
+ ),
]),
- ]
+ ],
})
export class MyProfileComponent implements OnInit {
+ @Input()
+ state: boolean = false;
@Input()
- state: boolean = false;
+ user!: User | null;
@Input()
- user!: User | null;
-
- @Input()
- ignoreClickOutside!: HTMLDivElement[];
+ ignoreClickOutside!: HTMLDivElement[];
@Output()
- stateChange = new EventEmitter();
+ stateChange = new EventEmitter();
alterForm!: FormGroup;
@@ -102,15 +105,20 @@ export class MyProfileComponent implements OnInit {
isShowErrorMessage = false;
- _fileIcon = faFileUpload
+ _fileIcon = faFileUpload;
- constructor(private authService: AuthService) {
- }
+ constructor(private authService: AuthService) {}
ngOnInit(): void {
this.alterForm = new FormGroup({
- 'username': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
- 'password': new FormControl(null, [Validators.required, ValidatePasswordValidator])
+ username: new FormControl(null, [
+ Validators.required,
+ ValidateNotEmptyValidator,
+ ]),
+ password: new FormControl(null, [
+ Validators.required,
+ ValidatePasswordValidator,
+ ]),
});
this.errorMessage = null;
}
@@ -121,30 +129,30 @@ export class MyProfileComponent implements OnInit {
showErrorMessage(): string {
if (this.isShowErrorMessage) {
- return "show";
+ return 'show';
}
- return "hide";
+ return 'hide';
}
hideErrorMessage(): string {
if (!!this.errorMessage) {
- return "hide";
+ return 'hide';
}
- return "show";
+ return 'show';
}
onDeleteAccount() {
this.authService.deleteAccount().subscribe({
next: (response: any) => {
this.authService.logout();
- }
- })
+ },
+ });
this.closePopup();
}
hideAuthContainer(event: any) {
- if (event.toState === "hide") {
- event.element.style.display = "none";
+ if (event.toState === 'hide') {
+ event.element.style.display = 'none';
this.isShowErrorMessage = true;
}
}
@@ -158,5 +166,4 @@ export class MyProfileComponent implements OnInit {
private closePopup() {
this.onStateChange(false);
}
-
}
diff --git a/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.html b/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.html
index 81af439..9bdb7cd 100644
--- a/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.html
+++ b/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.html
@@ -1,20 +1,27 @@
diff --git a/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.spec.ts b/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.spec.ts
index 41eb615..e221791 100644
--- a/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.spec.ts
+++ b/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.spec.ts
@@ -3,21 +3,20 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ProfilePicturePickerComponent } from './profile-picture-picker.component';
describe('ProfilePicturePickerComponent', () => {
- let component: ProfilePicturePickerComponent;
- let fixture: ComponentFixture;
+ let component: ProfilePicturePickerComponent;
+ let fixture: ComponentFixture;
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ ProfilePicturePickerComponent ]
- })
- .compileComponents();
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ProfilePicturePickerComponent],
+ }).compileComponents();
- fixture = TestBed.createComponent(ProfilePicturePickerComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
+ fixture = TestBed.createComponent(ProfilePicturePickerComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
- it('should create', () => {
- expect(component).toBeTruthy();
- });
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
});
diff --git a/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.ts b/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.ts
index f850a4f..e211ac5 100644
--- a/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.ts
+++ b/src/app/header/header-popup/my-profile/profile-picture-picker/profile-picture-picker.component.ts
@@ -1,19 +1,18 @@
-import {Component, EventEmitter, Output} from '@angular/core';
-import {AuthService} from "../../../../shared/auth/auth.service";
+import { Component, EventEmitter, Output } from '@angular/core';
+import { AuthService } from '../../../../shared/auth/auth.service';
@Component({
selector: 'app-profile-picture-picker',
templateUrl: './profile-picture-picker.component.html',
- styleUrls: ['./profile-picture-picker.component.css']
+ styleUrls: ['./profile-picture-picker.component.css'],
})
-export class ProfilePicturePickerComponent {
-
+export class ProfilePicturePickerComponent {
@Output()
- imageSent = new EventEmitter();
+ imageSent = new EventEmitter();
private profilePicture!: File;
- constructor(private authService: AuthService) { }
+ constructor(private authService: AuthService) {}
handleFileInput(event: Event) {
const element = event.currentTarget as HTMLInputElement;
@@ -35,5 +34,4 @@ export class ProfilePicturePickerComponent {
get isProfilePictureSelected(): boolean {
return !!this.profilePicture;
}
-
}
diff --git a/src/app/header/header-popup/signup/signup.component.css b/src/app/header/header-popup/signup/signup.component.css
index a109cf3..2d1882b 100644
--- a/src/app/header/header-popup/signup/signup.component.css
+++ b/src/app/header/header-popup/signup/signup.component.css
@@ -22,7 +22,7 @@
}
.auth-body .btn {
- background-color: #D8291C !important;
+ background-color: #d8291c !important;
text-decoration: none;
border-radius: 8px;
color: #ffffff;
@@ -70,7 +70,7 @@
border-bottom: 2px solid #7676769b;
}
.input-div:after {
- content: '';
+ content: "";
left: 0;
right: 0;
width: 0;
@@ -84,11 +84,12 @@
.input-div:hover:after,
.input-div:has(input.form-control:focus):after {
width: 100%;
- transition: .4s;
+ transition: 0.4s;
overflow: hidden;
}
-.input-div > .form-control, .input-div > .form-control:focus {
+.input-div > .form-control,
+.input-div > .form-control:focus {
border: none;
border-color: inherit;
-webkit-box-shadow: none;
@@ -101,7 +102,7 @@
font-size: 17px;
color: #767676;
}
-.input-div >.form-control:-webkit-autofill {
+.input-div > .form-control:-webkit-autofill {
-webkit-text-fill-color: #767676;
box-shadow: 0 0 0px 1000px #ffffff inset;
-webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
@@ -111,17 +112,16 @@
.input-div:hover > .form-control::placeholder,
.input-div:hover > .input-div-icon,
.input-div:has(input.form-control:focus) > .input-div-icon {
- color: #D8291C;
- transition: .3s;
+ color: #d8291c;
+ transition: 0.3s;
}
.input-div:hover > .form-control::placeholder,
-.input-div:focus > .form-control::placeholder{
+.input-div:focus > .form-control::placeholder {
font-weight: 500;
- transition: .3s;
+ transition: 0.3s;
}
-@media (min-width:767px) {
-
+@media (min-width: 767px) {
.authentication-container {
min-width: 630px;
}
@@ -151,5 +151,4 @@
border-right: 2px solid #80808076;
height: 100%;
}
-
}
diff --git a/src/app/header/header-popup/signup/signup.component.html b/src/app/header/header-popup/signup/signup.component.html
index 947eba8..9a584ec 100644
--- a/src/app/header/header-popup/signup/signup.component.html
+++ b/src/app/header/header-popup/signup/signup.component.html
@@ -1,60 +1,81 @@
-
-
-
-
-
-
+ [ignoreClickOutside]="ignoreClickOutside"
+>
+
+
-
+
-
-
+
+
Login With Google
-
-
+
+
Login With Github
-
-
diff --git a/src/app/header/header-popup/signup/signup.component.spec.ts b/src/app/header/header-popup/signup/signup.component.spec.ts
index bd959a5..d3fe11f 100644
--- a/src/app/header/header-popup/signup/signup.component.spec.ts
+++ b/src/app/header/header-popup/signup/signup.component.spec.ts
@@ -8,9 +8,8 @@ describe('SignupComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ SignupComponent ]
- })
- .compileComponents();
+ declarations: [SignupComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(SignupComponent);
component = fixture.componentInstance;
diff --git a/src/app/header/header-popup/signup/signup.component.ts b/src/app/header/header-popup/signup/signup.component.ts
index 3b7bf25..6c041b3 100644
--- a/src/app/header/header-popup/signup/signup.component.ts
+++ b/src/app/header/header-popup/signup/signup.component.ts
@@ -2,21 +2,34 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { FormControl, FormGroup, Validators } from '@angular/forms';
import { MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';
-import { faEnvelope, faFingerprint, faLock, faUser } from '@fortawesome/free-solid-svg-icons';
+import {
+ faEnvelope,
+ faFingerprint,
+ faLock,
+ faUser,
+} from '@fortawesome/free-solid-svg-icons';
import { Subscription } from 'rxjs';
import { AuthService } from 'src/app/shared/auth/auth.service';
import { HttpError } from 'src/app/shared/model/httpError/httpError.model';
import HttpErrorChecker from 'src/app/shared/model/httpError/httpErrorChecker';
import UserChecker from 'src/app/shared/model/user/user.checker';
import { User } from 'src/app/shared/model/user/user.model';
-import {animate, animateChild, group, query, state, style, transition, trigger} from "@angular/animations";
-import {ValidateEmailValidator} from "../../../shared/validators/validate-email.validator";
-import {ValidatePasswordValidator} from "../../../shared/validators/validate-password.validator";
-import {ValidateNotEmptyValidator} from "../../../shared/validators/validate-not-empty.validator";
+import {
+ animate,
+ animateChild,
+ group,
+ query,
+ state,
+ style,
+ transition,
+ trigger,
+} from '@angular/animations';
+import { ValidateEmailValidator } from '../../../shared/validators/validate-email.validator';
+import { ValidatePasswordValidator } from '../../../shared/validators/validate-password.validator';
+import { ValidateNotEmptyValidator } from '../../../shared/validators/validate-not-empty.validator';
-
-const GOOGLE_LOGO_SVG = "assets/img/providers/google.svg";
-const GITHUB_LOGO_SVG = "assets/img/providers/github.svg";
+const GOOGLE_LOGO_SVG = 'assets/img/providers/google.svg';
+const GITHUB_LOGO_SVG = 'assets/img/providers/github.svg';
@Component({
selector: 'app-signup',
@@ -24,78 +37,66 @@ const GITHUB_LOGO_SVG = "assets/img/providers/github.svg";
styleUrls: ['./signup.component.css'],
animations: [
trigger('resizeContainerForErrorMessage', [
- state('hide',
+ state(
+ 'hide',
style({
height: '100px',
width: '320px',
- })
+ }),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('1s ease')
- ])
- )
+ query('@*', animateChild(), { optional: true }),
+ animate('1s ease'),
+ ]),
+ ),
]),
trigger('showErrorMessage', [
- state('show',
+ state(
+ 'show',
style({
opacity: 1,
height: '100px',
width: '320px',
- })
+ }),
),
- state('hide',
+ state(
+ 'hide',
style({
opacity: 0,
height: '0px',
width: '0px',
- })
- ),
- transition(
- '* => show',
- animate(
- '500ms ease-in'
- )
+ }),
),
+ transition('* => show', animate('500ms ease-in')),
]),
trigger('hideAuthContainer', [
- state('hide',
+ state(
+ 'hide',
style({
opacity: 0,
- })
+ }),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate(
- '250ms ease-out'
- )
- ])
- )
+ query('@*', animateChild(), { optional: true }),
+ animate('250ms ease-out'),
+ ]),
+ ),
]),
- ]
+ ],
})
export class SignupComponent implements OnInit {
+ @Input()
+ state: boolean = false;
@Input()
- state: boolean = false;
-
- @Input()
- ignoreClickOutside!: HTMLDivElement[];
+ ignoreClickOutside!: HTMLDivElement[];
@Output()
- stateChange = new EventEmitter
();
+ stateChange = new EventEmitter();
signupForm!: FormGroup;
@@ -113,34 +114,46 @@ export class SignupComponent implements OnInit {
_passwordIcon = faLock;
- constructor(private authService: AuthService,
+ constructor(
+ private authService: AuthService,
private matIconRegistry: MatIconRegistry,
- private domSanitizer: DomSanitizer) {
+ private domSanitizer: DomSanitizer,
+ ) {
this.matIconRegistry.addSvgIcon(
- "google-logo",
- this.domSanitizer.bypassSecurityTrustResourceUrl(GOOGLE_LOGO_SVG)
+ 'google-logo',
+ this.domSanitizer.bypassSecurityTrustResourceUrl(GOOGLE_LOGO_SVG),
);
this.matIconRegistry.addSvgIcon(
- "github-logo",
- this.domSanitizer.bypassSecurityTrustResourceUrl(GITHUB_LOGO_SVG)
+ 'github-logo',
+ this.domSanitizer.bypassSecurityTrustResourceUrl(GITHUB_LOGO_SVG),
);
}
ngOnInit(): void {
this.signupForm = new FormGroup({
- 'fullname': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
+ fullname: new FormControl(null, [
+ Validators.required,
+ ValidateNotEmptyValidator,
+ ]),
// Create a Email Validator
- 'email': new FormControl(null, [Validators.required, ValidateEmailValidator]),
- 'username': new FormControl(null, [Validators.required, ValidateNotEmptyValidator]),
+ email: new FormControl(null, [
+ Validators.required,
+ ValidateEmailValidator,
+ ]),
+ username: new FormControl(null, [
+ Validators.required,
+ ValidateNotEmptyValidator,
+ ]),
// Create a Password Validator
- 'password': new FormControl(null, [Validators.required, ValidatePasswordValidator])
+ password: new FormControl(null, [
+ Validators.required,
+ ValidatePasswordValidator,
+ ]),
});
this.errorMessage = null;
- this.authSubject = this.authService.authSubject.subscribe(
- res => {
- this.validateSignup(res);
- }
- );
+ this.authSubject = this.authService.authSubject.subscribe((res) => {
+ this.validateSignup(res);
+ });
}
onStateChange(state: boolean) {
@@ -152,8 +165,8 @@ export class SignupComponent implements OnInit {
name: this.signupForm.controls['fullname'].value,
email: this.signupForm.controls['email'].value,
username: this.signupForm.controls['username'].value,
- password: this.signupForm.controls['password'].value
- }
+ password: this.signupForm.controls['password'].value,
+ };
this.authService.signup(user);
}
@@ -167,11 +180,11 @@ export class SignupComponent implements OnInit {
private validateSignup(res: User | HttpError | null) {
if (res && UserChecker.test(res)) {
- this.closePopup()
- } if (HttpErrorChecker.test(res)) {
+ this.closePopup();
+ }
+ if (HttpErrorChecker.test(res)) {
this.errorMessage = (res).details;
}
-
}
private closePopup() {
@@ -181,24 +194,22 @@ export class SignupComponent implements OnInit {
public showErrorMessage(): string {
if (this.isShowErrorMessage) {
- return "show";
+ return 'show';
}
- return "hide";
+ return 'hide';
}
public hideErrorMessage(): string {
if (!!this.errorMessage) {
- return "hide";
+ return 'hide';
}
- return "show";
+ return 'show';
}
hideAuthContainer(event: any) {
- if (event.toState === "hide") {
- event.element.style.display = "none";
+ if (event.toState === 'hide') {
+ event.element.style.display = 'none';
this.isShowErrorMessage = true;
}
}
-
-
}
diff --git a/src/app/header/header-slider/header-slider.component.css b/src/app/header/header-slider/header-slider.component.css
index c5cbae0..33888b5 100644
--- a/src/app/header/header-slider/header-slider.component.css
+++ b/src/app/header/header-slider/header-slider.component.css
@@ -6,4 +6,4 @@
top: 10vh;
right: 0;
overflow: hidden !important;
-}
\ No newline at end of file
+}
diff --git a/src/app/header/header-slider/header-slider.component.html b/src/app/header/header-slider/header-slider.component.html
index 00be7fc..c938a46 100644
--- a/src/app/header/header-slider/header-slider.component.html
+++ b/src/app/header/header-slider/header-slider.component.html
@@ -1,8 +1,10 @@
-
+
-
\ No newline at end of file
+
diff --git a/src/app/header/header-slider/header-slider.component.spec.ts b/src/app/header/header-slider/header-slider.component.spec.ts
index f5d03dd..a95b96f 100644
--- a/src/app/header/header-slider/header-slider.component.spec.ts
+++ b/src/app/header/header-slider/header-slider.component.spec.ts
@@ -8,9 +8,8 @@ describe('HeaderSliderComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ HeaderSliderComponent ]
- })
- .compileComponents();
+ declarations: [HeaderSliderComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(HeaderSliderComponent);
component = fixture.componentInstance;
diff --git a/src/app/header/header-slider/header-slider.component.ts b/src/app/header/header-slider/header-slider.component.ts
index 137d205..47ef4ca 100644
--- a/src/app/header/header-slider/header-slider.component.ts
+++ b/src/app/header/header-slider/header-slider.component.ts
@@ -1,70 +1,73 @@
-import { animate, animateChild, group, query, state, style, transition, trigger } from '@angular/animations';
+import {
+ animate,
+ animateChild,
+ group,
+ query,
+ state,
+ style,
+ transition,
+ trigger,
+} from '@angular/animations';
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
@Component({
selector: 'app-header-slider',
templateUrl: './header-slider.component.html',
styleUrls: ['./header-slider.component.css'],
- animations:[
+ animations: [
trigger('slideState', [
- state('hide', style({
- transform: 'translateX(100%)'
- })),
- state('show', style({
- transform: 'translateX(0%)'
- })),
- transition(
- 'hide => show', [
- group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('600ms ease-in')
- ])
+ state(
+ 'hide',
+ style({
+ transform: 'translateX(100%)',
+ }),
+ ),
+ state(
+ 'show',
+ style({
+ transform: 'translateX(0%)',
+ }),
+ ),
+ transition('hide => show', [
+ group([
+ query('@*', animateChild(), { optional: true }),
+ animate('600ms ease-in'),
]),
- transition(
- 'show => hide', [
- group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('500ms ease-out')
- ])
- ])
- ])
- ]
+ ]),
+ transition('show => hide', [
+ group([
+ query('@*', animateChild(), { optional: true }),
+ animate('500ms ease-out'),
+ ]),
+ ]),
+ ]),
+ ],
})
export class HeaderSliderComponent {
+ @Input()
+ ignoreClickOutside!: HTMLDivElement[];
@Input()
- ignoreClickOutside!: HTMLDivElement[];
+ clickOutsideStopWatching: boolean = false;
@Input()
- clickOutsideStopWatching: boolean = false;
-
- @Input()
- state: boolean = false;
+ state: boolean = false;
@Output()
- stateChange = new EventEmitter();
+ stateChange = new EventEmitter();
- constructor() { }
+ constructor() {}
get sliderStatus() {
return this.state ? 'show' : 'hide';
}
public closeNavSlider(): void {
- this.state = false;
+ this.state = false;
this.changeState();
}
public changeState() {
- this.stateChange.emit(this.state)
+ this.stateChange.emit(this.state);
}
-
}
diff --git a/src/app/header/header-slider/nav-slider/nav-slider.component.css b/src/app/header/header-slider/nav-slider/nav-slider.component.css
index 2237b90..f74439c 100644
--- a/src/app/header/header-slider/nav-slider/nav-slider.component.css
+++ b/src/app/header/header-slider/nav-slider/nav-slider.component.css
@@ -29,15 +29,14 @@
.nav-links li a {
text-decoration: none;
- font-family: 'Montserrat';
+ font-family: "Montserrat";
font-weight: 400;
color: #ffffff;
font-size: 18px;
}
-
.nav-links li a:hover {
- opacity: .8;
+ opacity: 0.8;
color: #f44336;
transition: 0.5s;
}
diff --git a/src/app/header/header-slider/nav-slider/nav-slider.component.html b/src/app/header/header-slider/nav-slider/nav-slider.component.html
index b87d00c..93ccce0 100644
--- a/src/app/header/header-slider/nav-slider/nav-slider.component.html
+++ b/src/app/header/header-slider/nav-slider/nav-slider.component.html
@@ -1,9 +1,18 @@
-
-
-
-
+
+
+
+
diff --git a/src/app/header/header-slider/nav-slider/nav-slider.component.spec.ts b/src/app/header/header-slider/nav-slider/nav-slider.component.spec.ts
index 25a3d77..8057e54 100644
--- a/src/app/header/header-slider/nav-slider/nav-slider.component.spec.ts
+++ b/src/app/header/header-slider/nav-slider/nav-slider.component.spec.ts
@@ -8,9 +8,8 @@ describe('NavSliderComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ NavSliderComponent ]
- })
- .compileComponents();
+ declarations: [NavSliderComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(NavSliderComponent);
component = fixture.componentInstance;
diff --git a/src/app/header/header-slider/nav-slider/nav-slider.component.ts b/src/app/header/header-slider/nav-slider/nav-slider.component.ts
index 104595b..c45202a 100644
--- a/src/app/header/header-slider/nav-slider/nav-slider.component.ts
+++ b/src/app/header/header-slider/nav-slider/nav-slider.component.ts
@@ -1,33 +1,41 @@
-import {Component, EventEmitter, OnDestroy, OnInit, Output} from '@angular/core';
+import {
+ Component,
+ EventEmitter,
+ OnDestroy,
+ OnInit,
+ Output,
+} from '@angular/core';
import { faUser } from '@fortawesome/free-solid-svg-icons';
import { SliderItemComponent } from 'src/app/shared/components/slider-item/slider-item.component';
-import UserChecker from "../../../shared/model/user/user.checker";
-import {User} from "../../../shared/model/user/user.model";
-import {AuthService} from "../../../shared/auth/auth.service";
-import {Subscription} from "rxjs";
+import UserChecker from '../../../shared/model/user/user.checker';
+import { User } from '../../../shared/model/user/user.model';
+import { AuthService } from '../../../shared/auth/auth.service';
+import { Subscription } from 'rxjs';
@Component({
selector: 'app-nav-slider',
templateUrl: './nav-slider.component.html',
- styleUrls: ['./nav-slider.component.css']
+ styleUrls: ['./nav-slider.component.css'],
})
-export class NavSliderComponent extends SliderItemComponent implements OnInit, OnDestroy {
-
+export class NavSliderComponent
+ extends SliderItemComponent
+ implements OnInit, OnDestroy
+{
userIcon = faUser;
navLink = [
- { page: "Home", link: "/home" },
- { page: "Work", link: "/home" },
- { page: "Contact", link: "/home" },
- { page: "About", link: "/home" }
- ]
+ { page: 'Home', link: '/home' },
+ { page: 'Work', link: '/home' },
+ { page: 'Contact', link: '/home' },
+ { page: 'About', link: '/home' },
+ ];
loggedUser!: User | null;
private userSubscription!: Subscription;
@Output()
- profileButtonClicked = new EventEmitter();
+ profileButtonClicked = new EventEmitter();
constructor(private authService: AuthService) {
super();
@@ -35,14 +43,14 @@ export class NavSliderComponent extends SliderItemComponent implements OnInit, O
ngOnInit(): void {
this.userSubscription = this.authService.authSubject.subscribe(
- res => {
+ (res) => {
if (res && UserChecker.test(res)) {
this.loggedUser =
res;
} else {
this.loggedUser = null;
}
- }
- )
+ },
+ );
}
ngOnDestroy(): void {
@@ -52,5 +60,4 @@ export class NavSliderComponent extends SliderItemComponent implements OnInit, O
onProfileButtonClicked() {
this.profileButtonClicked.emit();
}
-
}
diff --git a/src/app/header/header-slider/user-slider/user-slider.component.css b/src/app/header/header-slider/user-slider/user-slider.component.css
index 1fd2273..60d7cbd 100644
--- a/src/app/header/header-slider/user-slider/user-slider.component.css
+++ b/src/app/header/header-slider/user-slider/user-slider.component.css
@@ -28,17 +28,16 @@
}
.user-options li a {
- font-family: 'Montserrat';
+ font-family: "Montserrat";
text-decoration: none;
font-weight: 400;
color: #ffffff;
font-size: 18px;
}
-
.user-options li a:hover {
color: #f44336;
transition: 0.5s;
cursor: pointer;
- opacity: .8;
-}
\ No newline at end of file
+ opacity: 0.8;
+}
diff --git a/src/app/header/header-slider/user-slider/user-slider.component.html b/src/app/header/header-slider/user-slider/user-slider.component.html
index fe223f5..70ad5ea 100644
--- a/src/app/header/header-slider/user-slider/user-slider.component.html
+++ b/src/app/header/header-slider/user-slider/user-slider.component.html
@@ -1,11 +1,23 @@
\ No newline at end of file
+
diff --git a/src/app/header/header-slider/user-slider/user-slider.component.spec.ts b/src/app/header/header-slider/user-slider/user-slider.component.spec.ts
index b6f8fbc..98dce97 100644
--- a/src/app/header/header-slider/user-slider/user-slider.component.spec.ts
+++ b/src/app/header/header-slider/user-slider/user-slider.component.spec.ts
@@ -8,9 +8,8 @@ describe('UserSliderComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ UserSliderComponent ]
- })
- .compileComponents();
+ declarations: [UserSliderComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(UserSliderComponent);
component = fixture.componentInstance;
diff --git a/src/app/header/header-slider/user-slider/user-slider.component.ts b/src/app/header/header-slider/user-slider/user-slider.component.ts
index 7a62574..f97c412 100644
--- a/src/app/header/header-slider/user-slider/user-slider.component.ts
+++ b/src/app/header/header-slider/user-slider/user-slider.component.ts
@@ -8,77 +8,75 @@ import { User } from 'src/app/shared/model/user/user.model';
@Component({
selector: 'app-user-slider',
templateUrl: './user-slider.component.html',
- styleUrls: ['./user-slider.component.css']
+ styleUrls: ['./user-slider.component.css'],
})
export class UserSliderComponent extends SliderItemComponent implements OnInit {
-
userlessOptions = [
{
- name: "Login",
+ name: 'Login',
onClick: () => {
this.onLoginOptionClicked();
- }
+ },
},
{
- name: "Signup",
+ name: 'Signup',
onClick: () => {
this.onSignUpOptionClick();
- }
- }
- ]
+ },
+ },
+ ];
userOptions = [
{
- name: "My Profile",
+ name: 'My Profile',
onClick: () => {
- this.onMyProfileClicked()
- }
+ this.onMyProfileClicked();
+ },
},
{
- name: "Help",
+ name: 'Help',
onClick: () => {
this.onHelpClicked();
- }
+ },
},
{
- name: "Logout",
+ name: 'Logout',
onClick: () => {
this.onLogout();
- }
- }
- ]
+ },
+ },
+ ];
- user!: User|null;
+ user!: User | null;
authSubscription!: Subscription;
@Output()
- loginPopupState: EventEmitter
= new EventEmitter();
+ loginPopupState: EventEmitter = new EventEmitter();
@Output()
- signupPopupState: EventEmitter = new EventEmitter();
+ signupPopupState: EventEmitter = new EventEmitter();
@Output()
- helpPopupState: EventEmitter = new EventEmitter();
+ helpPopupState: EventEmitter = new EventEmitter();
@Output()
- myProfilePopupState: EventEmitter = new EventEmitter();
+ myProfilePopupState: EventEmitter = new EventEmitter();
constructor(private authService: AuthService) {
super();
}
ngOnInit() {
- this.authSubscription =
- this.authService.authSubject.subscribe(
- res => {
- if (UserChecker.test(res)) {
- this.user = res;
- } else {
- this.user = null;
- }
+ this.authSubscription = this.authService.authSubject.subscribe(
+ (res) => {
+ if (UserChecker.test(res)) {
+ this.user = res;
+ } else {
+ this.user = null;
}
- )
+ },
+ );
}
onLoginOptionClicked(): void {
@@ -100,5 +98,4 @@ export class UserSliderComponent extends SliderItemComponent implements OnInit {
onLogout() {
this.authService.logout();
}
-
}
diff --git a/src/app/header/header.component.css b/src/app/header/header.component.css
index 3aa86b5..1d46c26 100644
--- a/src/app/header/header.component.css
+++ b/src/app/header/header.component.css
@@ -48,20 +48,20 @@
height: 5px;
background: #ffffff;
border-radius: 5px;
- box-shadow: 0 2px 5px rgba(255, 101, 47, .2);
- transition: all .5s ease-in-out;
+ box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
+ transition: all 0.5s ease-in-out;
}
.burger-menu::before,
.burger-menu::after {
- content: '';
+ content: "";
position: absolute;
width: 40px;
height: 5px;
background: #ffffff;
border-radius: 5px;
- box-shadow: 0 2px 5px rgba(255, 101, 47, .2);
- transition: all .5s ease-in-out;
+ box-shadow: 0 2px 5px rgba(255, 101, 47, 0.2);
+ transition: all 0.5s ease-in-out;
}
.burger-menu::before {
@@ -75,17 +75,17 @@
.burger-menu.open {
background: transparent;
box-shadow: none;
- transition: all .5s ease-in-out;
+ transition: all 0.5s ease-in-out;
}
.burger-menu.open::before {
transform: rotate(45deg);
- transition: all .5s ease-in-out;
+ transition: all 0.5s ease-in-out;
}
.burger-menu.open::after {
transform: rotate(-45deg);
- transition: all .5s ease-in-out;
+ transition: all 0.5s ease-in-out;
}
.profile {
@@ -99,7 +99,6 @@ app-header-slider {
/* ====================== COMPUTER MEDIA FORMAT ======================== */
@media only screen and (min-width: 712px) {
-
.nav-links {
all: unset;
width: 50%;
@@ -121,7 +120,7 @@ app-header-slider {
}
.link-container li a {
- font-family: 'Montserrat', sans-serif;
+ font-family: "Montserrat", sans-serif;
text-decoration: none;
letter-spacing: 3px;
color: #ffffff;
@@ -180,5 +179,4 @@ app-header-slider {
app-header-slider {
opacity: 0;
}
-
}
diff --git a/src/app/header/header.component.html b/src/app/header/header.component.html
index 72ba43a..ab9528b 100644
--- a/src/app/header/header.component.html
+++ b/src/app/header/header.component.html
@@ -2,7 +2,7 @@
@@ -15,14 +15,25 @@
-
-
-
+
+
+
+ (helpPopupState)="helpPopupStateChange($event)"
+ >
-
+
+ [(state)]="navSliderStatus"
+ [clickOutsideStopWatching]="userSliderStatus"
+ [ignoreClickOutside]="[header, user]"
+ >
+ (profileButtonClicked)="profileButtonClicked()"
+ >
+ [(state)]="userSliderStatus"
+ [ignoreClickOutside]="[header, nav]"
+ >
+ (helpPopupState)="helpPopupStateChange($event)"
+ >
diff --git a/src/app/header/header.component.spec.ts b/src/app/header/header.component.spec.ts
index 307790b..4dd632c 100644
--- a/src/app/header/header.component.spec.ts
+++ b/src/app/header/header.component.spec.ts
@@ -8,9 +8,8 @@ describe('HeaderComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ HeaderComponent ]
- })
- .compileComponents();
+ declarations: [HeaderComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(HeaderComponent);
component = fixture.componentInstance;
diff --git a/src/app/header/header.component.ts b/src/app/header/header.component.ts
index 0400e74..8ecf85a 100644
--- a/src/app/header/header.component.ts
+++ b/src/app/header/header.component.ts
@@ -1,21 +1,28 @@
-import {Component, ComponentRef, ElementRef, OnDestroy, OnInit, ViewChild, ViewContainerRef} from '@angular/core';
+import {
+ Component,
+ ComponentRef,
+ ElementRef,
+ OnDestroy,
+ OnInit,
+ ViewChild,
+ ViewContainerRef,
+} from '@angular/core';
import { faUser } from '@fortawesome/free-solid-svg-icons';
import { LoginComponent } from './header-popup/login/login.component';
import { SignupComponent } from './header-popup/signup/signup.component';
-import {AuthService} from "../shared/auth/auth.service";
-import UserChecker from "../shared/model/user/user.checker";
-import {User} from "../shared/model/user/user.model";
-import {Subscription} from "rxjs";
-import {HelpComponent} from "./header-popup/help/help.component";
-import {MyProfileComponent} from "./header-popup/my-profile/my-profile.component";
+import { AuthService } from '../shared/auth/auth.service';
+import UserChecker from '../shared/model/user/user.checker';
+import { User } from '../shared/model/user/user.model';
+import { Subscription } from 'rxjs';
+import { HelpComponent } from './header-popup/help/help.component';
+import { MyProfileComponent } from './header-popup/my-profile/my-profile.component';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
- styleUrls: ['./header.component.css']
+ styleUrls: ['./header.component.css'],
})
export class HeaderComponent implements OnInit, OnDestroy {
-
userIcon = faUser;
profileDropdownState: boolean = false;
@@ -26,13 +33,13 @@ export class HeaderComponent implements OnInit, OnDestroy {
userSliderStatus: boolean = false;
@ViewChild('profileBtn')
- profileBtnElementRef!: ElementRef;
+ profileBtnElementRef!: ElementRef;
@ViewChild('profileDropdown')
- profileDropdownElementRef!: ElementRef;
+ profileDropdownElementRef!: ElementRef;
@ViewChild('user')
- userElementRef!: ElementRef;
+ userElementRef!: ElementRef;
loggedUser!: User | null;
@@ -46,25 +53,27 @@ export class HeaderComponent implements OnInit, OnDestroy {
private helpComponent!: ComponentRef
;
- constructor(private viewContainerRef: ViewContainerRef, private authService: AuthService) { }
+ constructor(
+ private viewContainerRef: ViewContainerRef,
+ private authService: AuthService,
+ ) {}
ngOnInit(): void {
this.userSubscription = this.authService.authSubject.subscribe(
- res => {
+ (res) => {
if (res && UserChecker.test(res)) {
this.loggedUser = res;
} else {
this.loggedUser = null;
}
- }
- )
+ },
+ );
}
ngOnDestroy(): void {
this.userSubscription.unsubscribe();
}
-
public toogleProfileDropdown(): void {
this.profileDropdownState = !this.profileDropdownState;
}
@@ -121,22 +130,21 @@ export class HeaderComponent implements OnInit, OnDestroy {
}
private createLoginPopup(): void {
- this.loginComponent = this.viewContainerRef.createComponent(LoginComponent);
+ this.loginComponent =
+ this.viewContainerRef.createComponent(LoginComponent);
this.loginComponent.instance.state = true;
this.loginComponent.instance.ignoreClickOutside = [
this.profileBtnElementRef,
this.profileDropdownElementRef,
- this.userElementRef
- ].map(element => element.nativeElement);
+ this.userElementRef,
+ ].map((element) => element.nativeElement);
- this.loginComponent.instance.stateChange.subscribe(
- state => {
- if (!state) {
- this.closeLoginPopup()
- }
+ this.loginComponent.instance.stateChange.subscribe((state) => {
+ if (!state) {
+ this.closeLoginPopup();
}
- );
+ });
this.navSliderStatus = false;
this.userSliderStatus = false;
@@ -144,22 +152,21 @@ export class HeaderComponent implements OnInit, OnDestroy {
}
private createSignupPopup() {
- this.signupComponent = this.viewContainerRef.createComponent(SignupComponent);
+ this.signupComponent =
+ this.viewContainerRef.createComponent(SignupComponent);
this.signupComponent.instance.state = true;
this.signupComponent.instance.ignoreClickOutside = [
this.profileBtnElementRef,
this.profileDropdownElementRef,
- this.userElementRef
- ].map(element => element.nativeElement);
+ this.userElementRef,
+ ].map((element) => element.nativeElement);
- this.signupComponent.instance.stateChange.subscribe(
- state => {
- if (!state) {
- this.closeSignupPopup()
- }
+ this.signupComponent.instance.stateChange.subscribe((state) => {
+ if (!state) {
+ this.closeSignupPopup();
}
- );
+ });
this.navSliderStatus = false;
this.userSliderStatus = false;
@@ -167,17 +174,16 @@ export class HeaderComponent implements OnInit, OnDestroy {
}
private createMyProfilePopup() {
- this.myProfileComponent = this.viewContainerRef.createComponent(MyProfileComponent);
+ this.myProfileComponent =
+ this.viewContainerRef.createComponent(MyProfileComponent);
this.myProfileComponent.instance.state = true;
this.myProfileComponent.instance.user = this.loggedUser;
- this.myProfileComponent.instance.stateChange.subscribe(
- state => {
- if (!state) {
- this.closeMyProfilePopup()
- }
+ this.myProfileComponent.instance.stateChange.subscribe((state) => {
+ if (!state) {
+ this.closeMyProfilePopup();
}
- );
+ });
this.navSliderStatus = false;
this.userSliderStatus = false;
@@ -185,16 +191,15 @@ export class HeaderComponent implements OnInit, OnDestroy {
}
private createHelpPopup() {
- this.helpComponent = this.viewContainerRef.createComponent(HelpComponent);
+ this.helpComponent =
+ this.viewContainerRef.createComponent(HelpComponent);
this.helpComponent.instance.state = true;
- this.helpComponent.instance.stateChange.subscribe(
- state => {
- if (!state) {
- this.closeHelpPopup()
- }
+ this.helpComponent.instance.stateChange.subscribe((state) => {
+ if (!state) {
+ this.closeHelpPopup();
}
- );
+ });
this.navSliderStatus = false;
this.userSliderStatus = false;
diff --git a/src/app/header/header.module.ts b/src/app/header/header.module.ts
index 59807b6..3d91f04 100644
--- a/src/app/header/header.module.ts
+++ b/src/app/header/header.module.ts
@@ -1,6 +1,6 @@
import { NgModule } from '@angular/core';
-import {CommonModule, NgOptimizedImage} from '@angular/common';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
+import { CommonModule, NgOptimizedImage } from '@angular/common';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { HeaderComponent } from './header.component';
import { HeaderSliderComponent } from './header-slider/header-slider.component';
@@ -14,14 +14,12 @@ import { LoginComponent } from './header-popup/login/login.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { SignupComponent } from './header-popup/signup/signup.component';
import { CallbackComponent } from './header-popup/callback/callback.component';
-import {MatIconModule} from '@angular/material/icon';
+import { MatIconModule } from '@angular/material/icon';
import { ErrorBoxComponent } from './header-popup/error-box/error-box.component';
import { HelpComponent } from './header-popup/help/help.component';
import { MyProfileComponent } from './header-popup/my-profile/my-profile.component';
import { ProfilePicturePickerComponent } from './header-popup/my-profile/profile-picture-picker/profile-picture-picker.component';
-
-
@NgModule({
declarations: [
HeaderComponent,
@@ -46,12 +44,13 @@ import { ProfilePicturePickerComponent } from './header-popup/my-profile/profile
ReactiveFormsModule,
MatIconModule,
SharedModule,
- NgOptimizedImage
- ], exports: [
+ NgOptimizedImage,
+ ],
+ exports: [
HeaderComponent,
HeaderSliderComponent,
NavSliderComponent,
- UserSliderComponent
- ]
+ UserSliderComponent,
+ ],
})
-export class HeaderModule { }
+export class HeaderModule {}
diff --git a/src/app/home/home.component.spec.ts b/src/app/home/home.component.spec.ts
index 5a930fa..e3d3847 100644
--- a/src/app/home/home.component.spec.ts
+++ b/src/app/home/home.component.spec.ts
@@ -8,9 +8,8 @@ describe('HomeComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ HomeComponent ]
- })
- .compileComponents();
+ declarations: [HomeComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(HomeComponent);
component = fixture.componentInstance;
diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts
index 9996bb5..68bf907 100644
--- a/src/app/home/home.component.ts
+++ b/src/app/home/home.component.ts
@@ -3,10 +3,8 @@ import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
- styleUrls: ['./home.component.css']
+ styleUrls: ['./home.component.css'],
})
export class HomeComponent {
-
- constructor() { }
-
+ constructor() {}
}
diff --git a/src/app/shared/auth/auth.service.ts b/src/app/shared/auth/auth.service.ts
index 9d3bf68..b3aedae 100644
--- a/src/app/shared/auth/auth.service.ts
+++ b/src/app/shared/auth/auth.service.ts
@@ -1,17 +1,25 @@
import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';
import { Injectable } from '@angular/core';
-import {first, firstValueFrom, map, Observable, of, Subject, take, tap} from 'rxjs';
+import {
+ first,
+ firstValueFrom,
+ map,
+ Observable,
+ of,
+ Subject,
+ take,
+ tap,
+} from 'rxjs';
import { catchError } from 'rxjs/operators';
import { environment } from 'src/environments/environment';
import { HttpError } from '../model/httpError/httpError.model';
import { User } from '../model/user/user.model';
-import * as http from "http";
+import * as http from 'http';
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class AuthService {
-
private userAuthenticated!: User;
authSubject = new Subject();
@@ -20,30 +28,35 @@ export class AuthService {
readonly BACKEND_OAUTH_PATH = environment.backendOAuthPath;
- constructor(private http: HttpClient) { }
+ constructor(private http: HttpClient) {}
login(userAuthAtempt: User): void {
this.validateUser(this.loginUser(userAuthAtempt));
}
googleLogin() {
- window.open(this.BACKEND_OAUTH_PATH + '/oauth2/authorization/google', '_self');
+ window.open(
+ this.BACKEND_OAUTH_PATH + '/oauth2/authorization/google',
+ '_self',
+ );
}
githubLogin() {
- window.open(this.BACKEND_OAUTH_PATH + '/oauth2/authorization/github', '_self');
+ window.open(
+ this.BACKEND_OAUTH_PATH + '/oauth2/authorization/github',
+ '_self',
+ );
}
loginGoogleUser(p: any): void {
- this.validateUser(this.fetchGoogleOAuthToken(p))
+ this.validateUser(this.fetchGoogleOAuthToken(p));
}
loginGithubUser(p: any): void {
- this.validateUser(this.fetchGithubOAuthToken(p))
+ this.validateUser(this.fetchGithubOAuthToken(p));
}
signup(userAuthAtempt: User): void {
this.validateUser(this.createUser(userAuthAtempt));
-
}
refresh(): void {
@@ -56,7 +69,7 @@ export class AuthService {
logout() {
this.authSubject.next(null);
- this.destroySessions().subscribe()
+ this.destroySessions().subscribe();
}
deleteAccount() {
@@ -66,7 +79,7 @@ export class AuthService {
addProfilePicture(file: File): void {
const fileType = file.type.split('/')[1];
this.getAddProfilePictureUrl(fileType).subscribe({
- next: (url: string|null) => {
+ next: (url: string | null) => {
if (url != null) {
this.uploadProfilePicture(url, file).then(
(response: Observable) => {
@@ -75,169 +88,160 @@ export class AuthService {
this.processProfilePicture().subscribe(
() => {
this.refresh();
- }
+ },
);
- }
+ },
});
- }
+ },
);
}
- }
- })
+ },
+ });
}
- private loginUser(userAuthAtempt: User): Observable {
-
+ private loginUser(userAuthAtempt: User): Observable {
let loginParams = new URLSearchParams();
- loginParams.set("username", userAuthAtempt.username!);
- loginParams.set("password", userAuthAtempt.password!);
+ loginParams.set('username', userAuthAtempt.username!);
+ loginParams.set('password', userAuthAtempt.password!);
let headers = new HttpHeaders({
- 'Content-Type': 'application/x-www-form-urlencoded'
+ 'Content-Type': 'application/x-www-form-urlencoded',
});
- return this.http.post(
- this.BACKEND_PATH + "/user/login",
- loginParams,
- { headers: headers, withCredentials: true }
- ).pipe(
- first()
- )
+ return this.http
+ .post(this.BACKEND_PATH + '/user/login', loginParams, {
+ headers: headers,
+ withCredentials: true,
+ })
+ .pipe(first());
}
- private fetchGoogleOAuthToken(p: any): Observable {
+ private fetchGoogleOAuthToken(p: any): Observable {
+ let params = new HttpParams({
+ fromObject: p,
+ });
- let params = new HttpParams(
- {
- fromObject: p
- }
- );
-
- return this.http.get(
- this.BACKEND_OAUTH_PATH + '/login/oauth2/code/google',
- {
+ return this.http
+ .get(this.BACKEND_OAUTH_PATH + '/login/oauth2/code/google', {
withCredentials: true,
- params: params
- },
- ).pipe(
- first()
- );
+ params: params,
+ })
+ .pipe(first());
}
- private fetchGithubOAuthToken(p: any): Observable {
+ private fetchGithubOAuthToken(p: any): Observable {
+ let params = new HttpParams({
+ fromObject: p,
+ });
- let params = new HttpParams(
- {
- fromObject: p
- }
- );
-
- return this.http.get(
- this.BACKEND_OAUTH_PATH + '/login/oauth2/code/github',
- {
+ return this.http
+ .get(this.BACKEND_OAUTH_PATH + '/login/oauth2/code/github', {
withCredentials: true,
- params: params
- },
- ).pipe(
- first()
- );
+ params: params,
+ })
+ .pipe(first());
}
private createUser(newUser: User) {
- return this.http.post(
- this.BACKEND_PATH + "/user/signup",
- newUser,
- { withCredentials: true }
- ).pipe(
- first()
- )
+ return this.http
+ .post(this.BACKEND_PATH + '/user/signup', newUser, {
+ withCredentials: true,
+ })
+ .pipe(first());
}
private refreshAccessToken() {
return this.http.post(
- this.BACKEND_PATH + "/user/login/refresh",
+ this.BACKEND_PATH + '/user/login/refresh',
this.userAuthenticated.refreshToken,
- { withCredentials: true }
+ { withCredentials: true },
);
}
private validateSession(): Observable {
- return this.http.get(
- this.BACKEND_PATH + '/session/validate',
- { withCredentials: true }
- );
- }
-
- private destroySessions() {
- return this.http.delete(
- this.BACKEND_PATH + '/session/destroy',
- { withCredentials: true }
- );
- }
-
- private deleteAccountRequest() {
- let headers = this.createAuthorizationHeader()
-
- return this.http.delete(
- this.BACKEND_PATH + `/user/delete`,
- { headers: headers, withCredentials: true }
- );
- }
-
- private validateUser(userAuthAtempt: Observable) {
- userAuthAtempt.pipe(
- catchError(error => {
- if (error.status == 0) {
- return of({
- title: "Service Unavailable",
- status: 500,
- details: "Service Unavailable, please try again later.",
- developerMessage: "Service Unavailable, please try again later.",
- timestamp: new Date().toISOString()
- });
- }
- return of(error.error);
- }),
- first()
- ).subscribe({
- next: userAuthentication => {
- this.userAuthenticated = userAuthentication;
- this.authSubject.next(this.userAuthenticated);
- }
+ return this.http.get(this.BACKEND_PATH + '/session/validate', {
+ withCredentials: true,
});
}
- private getAddProfilePictureUrl(fileType: string): Observable {
- return this.http.post<{ presigned_url: string, file_key: string }>(
- this.BACKEND_PATH + '/user/profile-picture?fileType=' + fileType,
- null,
- {
- headers: this.createAuthorizationHeader(),
- withCredentials: true
- }
- ).pipe(
- first(),
- map((res) => {
- if (!!res && !!res.presigned_url) {
- return res.presigned_url;
- }
- return null
- })
- )
+ private destroySessions() {
+ return this.http.delete(this.BACKEND_PATH + '/session/destroy', {
+ withCredentials: true,
+ });
}
- private async uploadProfilePicture(url: string, file: File): Promise> {
+ private deleteAccountRequest() {
+ let headers = this.createAuthorizationHeader();
+
+ return this.http.delete(this.BACKEND_PATH + `/user/delete`, {
+ headers: headers,
+ withCredentials: true,
+ });
+ }
+
+ private validateUser(userAuthAtempt: Observable) {
+ userAuthAtempt
+ .pipe(
+ catchError((error) => {
+ if (error.status == 0) {
+ return of({
+ title: 'Service Unavailable',
+ status: 500,
+ details:
+ 'Service Unavailable, please try again later.',
+ developerMessage:
+ 'Service Unavailable, please try again later.',
+ timestamp: new Date().toISOString(),
+ });
+ }
+ return of(error.error);
+ }),
+ first(),
+ )
+ .subscribe({
+ next: (userAuthentication) => {
+ this.userAuthenticated = userAuthentication;
+ this.authSubject.next(this.userAuthenticated);
+ },
+ });
+ }
+
+ private getAddProfilePictureUrl(
+ fileType: string,
+ ): Observable {
+ return this.http
+ .post<{ presigned_url: string; file_key: string }>(
+ this.BACKEND_PATH +
+ '/user/profile-picture?fileType=' +
+ fileType,
+ null,
+ {
+ headers: this.createAuthorizationHeader(),
+ withCredentials: true,
+ },
+ )
+ .pipe(
+ first(),
+ map((res) => {
+ if (!!res && !!res.presigned_url) {
+ return res.presigned_url;
+ }
+ return null;
+ }),
+ );
+ }
+
+ private async uploadProfilePicture(
+ url: string,
+ file: File,
+ ): Promise> {
const fileData = await this.readAsArrayBuffer(file);
let headers = new HttpHeaders({
- 'Content-Type': file.type
- })
- return this.http.put(
- url,
- fileData,
- {
- headers: headers,
- }
- );
+ 'Content-Type': file.type,
+ });
+ return this.http.put(url, fileData, {
+ headers: headers,
+ });
}
private processProfilePicture() {
@@ -246,21 +250,22 @@ export class AuthService {
null,
{
headers: this.createAuthorizationHeader(),
- withCredentials: true
- }
- )
+ withCredentials: true,
+ },
+ );
}
private createAuthorizationHeader(): HttpHeaders {
return new HttpHeaders({
'Content-Type': 'application/json',
- 'Authorization': 'Bearer ' + this.userAuthenticated.accessToken?.token
+ Authorization:
+ 'Bearer ' + this.userAuthenticated.accessToken?.token,
});
}
private async readAsArrayBuffer(file: File): Promise {
const reader = new FileReader();
- reader.readAsArrayBuffer(file)
+ reader.readAsArrayBuffer(file);
return new Promise((resolve, reject) => {
reader.onload = () => {
resolve(reader.result as ArrayBuffer);
diff --git a/src/app/shared/components/popup/popup.component.css b/src/app/shared/components/popup/popup.component.css
index 9f1c197..14fa8fa 100644
--- a/src/app/shared/components/popup/popup.component.css
+++ b/src/app/shared/components/popup/popup.component.css
@@ -1,8 +1,8 @@
-@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap");
* {
box-sizing: border-box;
- font-family: 'Poppins', sans-serif;
+ font-family: "Poppins", sans-serif;
}
.popup-background {
@@ -51,7 +51,7 @@
background: #808080;
border-radius: 5px;
position: fixed;
- content: '';
+ content: "";
width: 25px;
height: 5px;
}
@@ -73,11 +73,9 @@
height: 60px;
}
-@media (min-width:767px) {
-
+@media (min-width: 767px) {
.popup {
width: fit-content;
max-width: unset;
}
-
}
diff --git a/src/app/shared/components/popup/popup.component.html b/src/app/shared/components/popup/popup.component.html
index ffe1cad..6aa276b 100644
--- a/src/app/shared/components/popup/popup.component.html
+++ b/src/app/shared/components/popup/popup.component.html
@@ -1,11 +1,15 @@
-
-
\ No newline at end of file
+
diff --git a/src/app/shared/components/popup/popup.component.spec.ts b/src/app/shared/components/popup/popup.component.spec.ts
index c767141..bf3233d 100644
--- a/src/app/shared/components/popup/popup.component.spec.ts
+++ b/src/app/shared/components/popup/popup.component.spec.ts
@@ -8,9 +8,8 @@ describe('PopupComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ PopupComponent ]
- })
- .compileComponents();
+ declarations: [PopupComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(PopupComponent);
component = fixture.componentInstance;
diff --git a/src/app/shared/components/popup/popup.component.ts b/src/app/shared/components/popup/popup.component.ts
index 3cacb5e..b7fee51 100644
--- a/src/app/shared/components/popup/popup.component.ts
+++ b/src/app/shared/components/popup/popup.component.ts
@@ -1,5 +1,21 @@
-import { animate, animateChild, group, query, state, style, transition, trigger } from '@angular/animations';
-import { Component, ElementRef, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
+import {
+ animate,
+ animateChild,
+ group,
+ query,
+ state,
+ style,
+ transition,
+ trigger,
+} from '@angular/animations';
+import {
+ Component,
+ ElementRef,
+ EventEmitter,
+ Input,
+ Output,
+ ViewEncapsulation,
+} from '@angular/core';
@Component({
selector: 'app-popup',
@@ -7,49 +23,46 @@ import { Component, ElementRef, EventEmitter, Input, Output, ViewEncapsulation }
styleUrls: ['./popup.component.css'],
animations: [
trigger('popupState', [
- state('hide', style({
- 'opacity': '0'
- })),
- state('show', style({
- 'opacity': '1'
- })),
+ state(
+ 'hide',
+ style({
+ opacity: '0',
+ }),
+ ),
+ state(
+ 'show',
+ style({
+ opacity: '1',
+ }),
+ ),
transition(
'* => show',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('250ms ease-in')
- ])
+ query('@*', animateChild(), { optional: true }),
+ animate('250ms ease-in'),
+ ]),
),
transition(
'show => hide',
group([
- query(
- "@*",
- animateChild(),
- { optional: true }
- ),
- animate('250ms ease-out')
- ])
- )
- ])
- ]
+ query('@*', animateChild(), { optional: true }),
+ animate('250ms ease-out'),
+ ]),
+ ),
+ ]),
+ ],
})
export class PopupComponent {
+ @Input()
+ state: boolean = false;
@Input()
- state: boolean = false;
-
- @Input()
- ignoreClickOutside!: HTMLDivElement[];
+ ignoreClickOutside!: HTMLDivElement[];
@Output()
- stateChange = new EventEmitter(false);
+ stateChange = new EventEmitter(false);
- constructor() { }
+ constructor() {}
get popupState(): string {
return this.state ? 'show' : 'hide';
@@ -57,7 +70,7 @@ export class PopupComponent {
animationStop() {
if (!this.state) {
- this.closePopup()
+ this.closePopup();
this.stateChange.emit(false);
}
}
@@ -65,5 +78,4 @@ export class PopupComponent {
closePopup(): void {
this.state = false;
}
-
}
diff --git a/src/app/shared/components/slider-item/slider-item.component.spec.ts b/src/app/shared/components/slider-item/slider-item.component.spec.ts
index deecfc1..160b845 100644
--- a/src/app/shared/components/slider-item/slider-item.component.spec.ts
+++ b/src/app/shared/components/slider-item/slider-item.component.spec.ts
@@ -8,9 +8,8 @@ describe('SliderItemComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
- declarations: [ SliderItemComponent ]
- })
- .compileComponents();
+ declarations: [SliderItemComponent],
+ }).compileComponents();
fixture = TestBed.createComponent(SliderItemComponent);
component = fixture.componentInstance;
diff --git a/src/app/shared/components/slider-item/slider-item.component.ts b/src/app/shared/components/slider-item/slider-item.component.ts
index 9f96b10..118f1ae 100644
--- a/src/app/shared/components/slider-item/slider-item.component.ts
+++ b/src/app/shared/components/slider-item/slider-item.component.ts
@@ -1,46 +1,56 @@
-import { animate, state, style, transition, trigger } from '@angular/animations';
+import {
+ animate,
+ state,
+ style,
+ transition,
+ trigger,
+} from '@angular/animations';
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
@Component({
selector: 'app-slider-item',
templateUrl: './slider-item.component.html',
styleUrls: ['./slider-item.component.css'],
- animations:[
- trigger('animateSliderItem',[
- state('hide', style({
- 'opacity': '0',
- 'transform': 'translateX(150px)'
- }),
- {
- params: {
- fadeInTime: 600,
- fadeOutTime: 600
- }
- }),
- state('show', style({
- 'opacity': '1',
- 'transform': 'translateX(0px)'
- }),
- {
- params: {
- fadeOutTime: 600,
- fadeInTime: 600
+ animations: [
+ trigger('animateSliderItem', [
+ state(
+ 'hide',
+ style({
+ opacity: '0',
+ transform: 'translateX(150px)',
+ }),
+ {
+ params: {
+ fadeInTime: 600,
+ fadeOutTime: 600,
+ },
},
- }),
+ ),
+ state(
+ 'show',
+ style({
+ opacity: '1',
+ transform: 'translateX(0px)',
+ }),
+ {
+ params: {
+ fadeOutTime: 600,
+ fadeInTime: 600,
+ },
+ },
+ ),
transition('hide => show', animate(`{{ fadeInTime }}s ease-in`)),
- transition('show => hide', animate(`{{ fadeOutTime }}s ease-out`))
- ])
- ]
+ transition('show => hide', animate(`{{ fadeOutTime }}s ease-out`)),
+ ]),
+ ],
})
export class SliderItemComponent {
-
@Input()
- public state:boolean = false;
-
- constructor() { }
+ public state: boolean = false;
+
+ constructor() {}
get itemStatus(): string {
return this.state ? 'show' : 'hide';
}
-
}
diff --git a/src/app/shared/cookie-consent/cookie-consent.module.ts b/src/app/shared/cookie-consent/cookie-consent.module.ts
index 571fd8f..754461f 100644
--- a/src/app/shared/cookie-consent/cookie-consent.module.ts
+++ b/src/app/shared/cookie-consent/cookie-consent.module.ts
@@ -1,44 +1,42 @@
-import {NgModule} from '@angular/core';
-import {CommonModule} from '@angular/common';
-import {NgcCookieConsentConfig, NgcCookieConsentModule} from "ngx-cookieconsent";
-
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import {
+ NgcCookieConsentConfig,
+ NgcCookieConsentModule,
+} from 'ngx-cookieconsent';
const cookieConfig: NgcCookieConsentConfig = {
- "cookie": {
- "domain": "tinesoft.github.io"
+ cookie: {
+ domain: 'tinesoft.github.io',
},
- "position": "bottom-left",
- "theme": "classic",
- "palette": {
- "popup": {
- "background": "#4e4e4e",
- "text": "#ffffff",
- "link": "#ffffff"
+ position: 'bottom-left',
+ theme: 'classic',
+ palette: {
+ popup: {
+ background: '#4e4e4e',
+ text: '#ffffff',
+ link: '#ffffff',
+ },
+ button: {
+ background: '#fa2f22',
+ text: '#ffffff',
+ border: 'transparent',
},
- "button": {
- "background": "#fa2f22",
- "text": "#ffffff",
- "border": "transparent"
- }
},
- "type": "opt-in",
- "content": {
- "message": "This website uses cookies to ensure you get the best experience on our website.",
- "dismiss": "Got it!",
- "deny": "Refuse cookies",
- "link": "",
- "href": "",
- "policy": "Cookie Policy"
- }
+ type: 'opt-in',
+ content: {
+ message:
+ 'This website uses cookies to ensure you get the best experience on our website.',
+ dismiss: 'Got it!',
+ deny: 'Refuse cookies',
+ link: '',
+ href: '',
+ policy: 'Cookie Policy',
+ },
};
-
@NgModule({
declarations: [],
- imports: [
- CommonModule,
- NgcCookieConsentModule.forRoot(cookieConfig)
- ]
+ imports: [CommonModule, NgcCookieConsentModule.forRoot(cookieConfig)],
})
-export class CookieConsentModule {
-}
+export class CookieConsentModule {}
diff --git a/src/app/shared/cookie-consent/cookie-consert.service.spec.ts b/src/app/shared/cookie-consent/cookie-consert.service.spec.ts
index b1ceeb3..20a74d6 100644
--- a/src/app/shared/cookie-consent/cookie-consert.service.spec.ts
+++ b/src/app/shared/cookie-consent/cookie-consert.service.spec.ts
@@ -3,14 +3,14 @@ import { TestBed } from '@angular/core/testing';
import { CookieConsertService } from './cookie-consert.service';
describe('CookieConsertService', () => {
- let service: CookieConsertService;
+ let service: CookieConsertService;
- beforeEach(() => {
- TestBed.configureTestingModule({});
- service = TestBed.inject(CookieConsertService);
- });
+ beforeEach(() => {
+ TestBed.configureTestingModule({});
+ service = TestBed.inject(CookieConsertService);
+ });
- it('should be created', () => {
- expect(service).toBeTruthy();
- });
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
});
diff --git a/src/app/shared/cookie-consent/cookie-consert.service.ts b/src/app/shared/cookie-consent/cookie-consert.service.ts
index ac9c5cd..06b8888 100644
--- a/src/app/shared/cookie-consent/cookie-consert.service.ts
+++ b/src/app/shared/cookie-consent/cookie-consert.service.ts
@@ -1,21 +1,20 @@
-import {Injectable} from '@angular/core';
-import {BehaviorSubject, Subject, Subscription} from "rxjs";
-import {CookieService} from "ngx-cookie-service";
+import { Injectable } from '@angular/core';
+import { BehaviorSubject, Subject, Subscription } from 'rxjs';
+import { CookieService } from 'ngx-cookie-service';
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class CookieConsertService {
-
private storage: Storage;
- cookieStatusChangeSubscription!: BehaviorSubject
+ cookieStatusChangeSubscription!: BehaviorSubject;
constructor(private cookieService: CookieService) {
- this.storage = window.localStorage
+ this.storage = window.localStorage;
this.cookieStatusChangeSubscription = new BehaviorSubject(
- this.getCookieConsentStatusFromLocalStorage()
+ this.getCookieConsentStatusFromLocalStorage(),
);
}
@@ -48,5 +47,4 @@ export class CookieConsertService {
return status === 'true';
}
-
}
diff --git a/src/app/shared/directive/clicked-outside/clicked-outside.directive.ts b/src/app/shared/directive/clicked-outside/clicked-outside.directive.ts
index c474bc5..d25a3ce 100644
--- a/src/app/shared/directive/clicked-outside/clicked-outside.directive.ts
+++ b/src/app/shared/directive/clicked-outside/clicked-outside.directive.ts
@@ -1,12 +1,28 @@
import { DOCUMENT } from '@angular/common';
-import { AfterViewInit, Directive, ElementRef, EventEmitter, Inject, Input, OnDestroy, Output, ViewChild } from '@angular/core';
-import { combineLatest, combineLatestWith, filter, fromEvent, merge, Subscription } from 'rxjs';
+import {
+ AfterViewInit,
+ Directive,
+ ElementRef,
+ EventEmitter,
+ Inject,
+ Input,
+ OnDestroy,
+ Output,
+ ViewChild,
+} from '@angular/core';
+import {
+ combineLatest,
+ combineLatestWith,
+ filter,
+ fromEvent,
+ merge,
+ Subscription,
+} from 'rxjs';
@Directive({
- selector: '[appClickedOutside]'
+ selector: '[appClickedOutside]',
})
export class ClickedOutsideDirective implements AfterViewInit, OnDestroy {
-
@Input()
ignoreElementList!: HTMLDivElement[];
@@ -23,27 +39,27 @@ export class ClickedOutsideDirective implements AfterViewInit, OnDestroy {
constructor(
private element: ElementRef,
- @Inject(DOCUMENT) private document: Document
- ) { }
+ @Inject(DOCUMENT) private document: Document,
+ ) {}
ngAfterViewInit(): void {
-
const clickListener$ = fromEvent(this.document, 'click');
- this.eventListener = clickListener$.pipe(
- filter((click) => {
- return (
- (
- this.isOutside(click.target as HTMLElement) ||
- this.isInIncludedList(click.target as HTMLElement)
- ) &&
- this.notInIgnoredList(click.target as HTMLElement)
- );
- })
- ). subscribe( () => {
- !this.clickOutsideStopWatching && this.clickOutside.emit();
- });
-
+ this.eventListener = clickListener$
+ .pipe(
+ filter((click) => {
+ return (
+ (this.isOutside(click.target as HTMLElement) ||
+ this.isInIncludedList(
+ click.target as HTMLElement,
+ )) &&
+ this.notInIgnoredList(click.target as HTMLElement)
+ );
+ }),
+ )
+ .subscribe(() => {
+ !this.clickOutsideStopWatching && this.clickOutside.emit();
+ });
}
ngOnDestroy(): void {
@@ -52,12 +68,14 @@ export class ClickedOutsideDirective implements AfterViewInit, OnDestroy {
private isOutside(elementToCheck: HTMLElement): boolean {
let status = true;
- if (this.element.nativeElement === elementToCheck ||
- this.element.nativeElement.contains(elementToCheck)) {
+ if (
+ this.element.nativeElement === elementToCheck ||
+ this.element.nativeElement.contains(elementToCheck)
+ ) {
status = false;
}
- console.log('isOutside', status)
+ console.log('isOutside', status);
return status;
}
@@ -68,26 +86,32 @@ export class ClickedOutsideDirective implements AfterViewInit, OnDestroy {
}
let validateIsIgnored = (ignoreElement: HTMLDivElement): boolean => {
- return ignoreElement === elementToCheck
- || ignoreElement.contains(elementToCheck)
- || elementToCheck.contains(ignoreElement)
- }
+ return (
+ ignoreElement === elementToCheck ||
+ ignoreElement.contains(elementToCheck) ||
+ elementToCheck.contains(ignoreElement)
+ );
+ };
- return !this.ignoreElementList.some(validateIsIgnored)
+ return !this.ignoreElementList.some(validateIsIgnored);
}
private isInIncludedList(elementToCheck: HTMLElement): boolean {
- if (!this.includeClickedOutside || this.includeClickedOutside.length === 0) {
+ if (
+ !this.includeClickedOutside ||
+ this.includeClickedOutside.length === 0
+ ) {
return false;
}
let validateIsIncluded = (includedElement: HTMLDivElement): boolean => {
- return includedElement === elementToCheck
- || includedElement.contains(elementToCheck)
- || elementToCheck.contains(includedElement)
- }
+ return (
+ includedElement === elementToCheck ||
+ includedElement.contains(elementToCheck) ||
+ elementToCheck.contains(includedElement)
+ );
+ };
- return !this.includeClickedOutside.some(validateIsIncluded)
+ return !this.includeClickedOutside.some(validateIsIncluded);
}
-
}
diff --git a/src/app/shared/model/httpError/httpError.model-ti.ts b/src/app/shared/model/httpError/httpError.model-ti.ts
index 9efdffa..7396270 100644
--- a/src/app/shared/model/httpError/httpError.model-ti.ts
+++ b/src/app/shared/model/httpError/httpError.model-ti.ts
@@ -1,15 +1,15 @@
/**
* This module was automatically generated by `ts-interface-builder`
*/
-import * as t from "ts-interface-checker";
+import * as t from 'ts-interface-checker';
// tslint:disable:object-literal-key-quotes
export const HttpError = t.iface([], {
- "title": "string",
- "status": "number",
- "details": "string",
- "developerMessage": "string",
- "timestamp": "string",
+ title: 'string',
+ status: 'number',
+ details: 'string',
+ developerMessage: 'string',
+ timestamp: 'string',
});
const exportedTypeSuite: t.ITypeSuite = {
diff --git a/src/app/shared/model/httpError/httpError.model.ts b/src/app/shared/model/httpError/httpError.model.ts
index 1304c6b..909a52f 100644
--- a/src/app/shared/model/httpError/httpError.model.ts
+++ b/src/app/shared/model/httpError/httpError.model.ts
@@ -4,4 +4,4 @@ export interface HttpError {
details: string;
developerMessage: string;
timestamp: string;
-}
\ No newline at end of file
+}
diff --git a/src/app/shared/model/httpError/httpErrorChecker.ts b/src/app/shared/model/httpError/httpErrorChecker.ts
index 5c707b9..322bc27 100644
--- a/src/app/shared/model/httpError/httpErrorChecker.ts
+++ b/src/app/shared/model/httpError/httpErrorChecker.ts
@@ -1,5 +1,5 @@
-import { createCheckers } from "ts-interface-checker";
-import HttpError from "./httpError.model-ti";
+import { createCheckers } from 'ts-interface-checker';
+import HttpError from './httpError.model-ti';
const HttpErrorChecker = createCheckers(HttpError)['HttpError'];
export default HttpErrorChecker;
diff --git a/src/app/shared/model/token/token.model-ti.ts b/src/app/shared/model/token/token.model-ti.ts
index 5a10297..e9eb5a4 100644
--- a/src/app/shared/model/token/token.model-ti.ts
+++ b/src/app/shared/model/token/token.model-ti.ts
@@ -1,12 +1,12 @@
/**
* This module was automatically generated by `ts-interface-builder`
*/
-import * as t from "ts-interface-checker";
+import * as t from 'ts-interface-checker';
// tslint:disable:object-literal-key-quotes
export const Token = t.iface([], {
- "token": "string",
- "expirationDate": t.union("string", "number"),
+ token: 'string',
+ expirationDate: t.union('string', 'number'),
});
const exportedTypeSuite: t.ITypeSuite = {
diff --git a/src/app/shared/model/token/token.model.ts b/src/app/shared/model/token/token.model.ts
index c26f14c..cbfaa69 100644
--- a/src/app/shared/model/token/token.model.ts
+++ b/src/app/shared/model/token/token.model.ts
@@ -1,4 +1,4 @@
export interface Token {
- token: string,
- expirationDate: string|number
-}
\ No newline at end of file
+ token: string;
+ expirationDate: string | number;
+}
diff --git a/src/app/shared/model/user/user.checker.ts b/src/app/shared/model/user/user.checker.ts
index ec4d3db..00ad4c6 100644
--- a/src/app/shared/model/user/user.checker.ts
+++ b/src/app/shared/model/user/user.checker.ts
@@ -1,6 +1,6 @@
-import { createCheckers } from "ts-interface-checker";
-import User from "./user.model-ti";
-import Token from "../token/token.model-ti";
+import { createCheckers } from 'ts-interface-checker';
+import User from './user.model-ti';
+import Token from '../token/token.model-ti';
const UserChecker = createCheckers(User, Token)['User'];
export default UserChecker;
diff --git a/src/app/shared/model/user/user.model-ti.ts b/src/app/shared/model/user/user.model-ti.ts
index f806613..9bdb1ff 100644
--- a/src/app/shared/model/user/user.model-ti.ts
+++ b/src/app/shared/model/user/user.model-ti.ts
@@ -1,19 +1,19 @@
/**
* This module was automatically generated by `ts-interface-builder`
*/
-import * as t from "ts-interface-checker";
+import * as t from 'ts-interface-checker';
// tslint:disable:object-literal-key-quotes
export const User = t.iface([], {
- "id": t.opt("number"),
- "name": t.opt("string"),
- "email": t.opt("string"),
- "username": "string",
- "password": t.opt("string"),
- "profilePictureUrl": t.opt("string"),
- "accessToken": t.opt("Token"),
- "refreshToken": t.opt("Token"),
- "roles": t.opt(t.array("string")),
+ id: t.opt('number'),
+ name: t.opt('string'),
+ email: t.opt('string'),
+ username: 'string',
+ password: t.opt('string'),
+ profilePictureUrl: t.opt('string'),
+ accessToken: t.opt('Token'),
+ refreshToken: t.opt('Token'),
+ roles: t.opt(t.array('string')),
});
const exportedTypeSuite: t.ITypeSuite = {
diff --git a/src/app/shared/model/user/user.model.ts b/src/app/shared/model/user/user.model.ts
index fc43e94..6979709 100644
--- a/src/app/shared/model/user/user.model.ts
+++ b/src/app/shared/model/user/user.model.ts
@@ -1,14 +1,14 @@
-import { Token } from "../token/token.model";
+import { Token } from '../token/token.model';
export interface User {
- id?: number,
- name?: string,
- email?: string,
- username: string,
- password?: string,
- profilePictureUrl?: string,
- accessToken?: Token,
- refreshToken?: Token,
- roles?: Array,
+ id?: number;
+ name?: string;
+ email?: string;
+ username: string;
+ password?: string;
+ profilePictureUrl?: string;
+ accessToken?: Token;
+ refreshToken?: Token;
+ roles?: Array;
validateAccessToken?: () => Token | undefined;
-};
+}
diff --git a/src/app/shared/service-worker/update.service.spec.ts b/src/app/shared/service-worker/update.service.spec.ts
index b51fcc8..058dbb8 100644
--- a/src/app/shared/service-worker/update.service.spec.ts
+++ b/src/app/shared/service-worker/update.service.spec.ts
@@ -3,14 +3,14 @@ import { TestBed } from '@angular/core/testing';
import { UpdateService } from './update.service';
describe('UpdateService', () => {
- let service: UpdateService;
+ let service: UpdateService;
- beforeEach(() => {
- TestBed.configureTestingModule({});
- service = TestBed.inject(UpdateService);
- });
+ beforeEach(() => {
+ TestBed.configureTestingModule({});
+ service = TestBed.inject(UpdateService);
+ });
- it('should be created', () => {
- expect(service).toBeTruthy();
- });
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
});
diff --git a/src/app/shared/service-worker/update.service.ts b/src/app/shared/service-worker/update.service.ts
index 9cb21ef..491d9b5 100644
--- a/src/app/shared/service-worker/update.service.ts
+++ b/src/app/shared/service-worker/update.service.ts
@@ -1,26 +1,27 @@
import { Injectable } from '@angular/core';
-import {SwUpdate} from "@angular/service-worker";
-import {interval} from "rxjs";
+import { SwUpdate } from '@angular/service-worker';
+import { interval } from 'rxjs';
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class UpdateService {
-
constructor(private swUpdate: SwUpdate) {
if (swUpdate.isEnabled) {
- interval(6 * 60 * 60).subscribe(() => swUpdate.checkForUpdate()
- .then(() => console.log('checking for updates')));
+ interval(6 * 60 * 60).subscribe(() =>
+ swUpdate
+ .checkForUpdate()
+ .then(() => console.log('checking for updates')),
+ );
}
}
public checkForUpdates(): void {
- this.swUpdate.available.subscribe(event => this.promptUser());
+ this.swUpdate.available.subscribe((event) => this.promptUser());
}
private promptUser(): void {
console.log('updating to new version');
this.swUpdate.activateUpdate().then(() => document.location.reload());
}
-
}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index b62c8bb..1bf206d 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -6,7 +6,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { HttpClientModule } from '@angular/common/http';
import { PopupComponent } from './components/popup/popup.component';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
-import {CookieConsentModule} from "./cookie-consent/cookie-consent.module";
+import { CookieConsentModule } from './cookie-consent/cookie-consent.module';
@NgModule({
declarations: [
@@ -19,12 +19,8 @@ import {CookieConsentModule} from "./cookie-consent/cookie-consent.module";
HttpClientModule,
BrowserAnimationsModule,
FontAwesomeModule,
- CookieConsentModule
+ CookieConsentModule,
],
- exports: [
- ClickedOutsideDirective,
- SliderItemComponent,
- PopupComponent
- ]
+ exports: [ClickedOutsideDirective, SliderItemComponent, PopupComponent],
})
-export class SharedModule { }
+export class SharedModule {}
diff --git a/src/app/shared/validators/validate-email.validator.ts b/src/app/shared/validators/validate-email.validator.ts
index f30c4e3..95361fc 100644
--- a/src/app/shared/validators/validate-email.validator.ts
+++ b/src/app/shared/validators/validate-email.validator.ts
@@ -1,4 +1,4 @@
-import {AbstractControl} from "@angular/forms";
+import { AbstractControl } from '@angular/forms';
export function ValidateEmailValidator(control: AbstractControl) {
const email = control.value;
diff --git a/src/app/shared/validators/validate-not-empty.validator.ts b/src/app/shared/validators/validate-not-empty.validator.ts
index be790a1..04f1f5d 100644
--- a/src/app/shared/validators/validate-not-empty.validator.ts
+++ b/src/app/shared/validators/validate-not-empty.validator.ts
@@ -1,4 +1,4 @@
-import {AbstractControl} from "@angular/forms";
+import { AbstractControl } from '@angular/forms';
export function ValidateNotEmptyValidator(control: AbstractControl) {
const value = control.value;
diff --git a/src/app/shared/validators/validate-password.validator.ts b/src/app/shared/validators/validate-password.validator.ts
index 71817d0..3dc3c6b 100644
--- a/src/app/shared/validators/validate-password.validator.ts
+++ b/src/app/shared/validators/validate-password.validator.ts
@@ -1,8 +1,9 @@
-import {AbstractControl} from "@angular/forms";
+import { AbstractControl } from '@angular/forms';
export function ValidatePasswordValidator(control: AbstractControl) {
var password = control.value;
- var passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/g;
+ var passwordRegex =
+ /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/g;
var passwordValid = passwordRegex.test(password);
if (!passwordValid) {
return { invalidPassword: true };
diff --git a/src/assets/env.sample.js b/src/assets/env.sample.js
index e3d573f..ac046df 100644
--- a/src/assets/env.sample.js
+++ b/src/assets/env.sample.js
@@ -1,7 +1,7 @@
(function (window) {
- window['env'] = window['env'] || {};
+ window["env"] = window["env"] || {};
// Environment variables
- window['env']['BACKEND_URL'] = '${BACKEND_URL}';
- window['env']['BACKEND_OAUTH_URL'] = '${BACKEND_OAUTH_URL}';
+ window["env"]["BACKEND_URL"] = "${BACKEND_URL}";
+ window["env"]["BACKEND_OAUTH_URL"] = "${BACKEND_OAUTH_URL}";
})(this);
diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts
index ef04952..d1643c6 100644
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@@ -1,5 +1,5 @@
export const environment = {
production: true,
backendPath: (window)['env']['BACKEND_URL'],
- backendOAuthPath: (window)['env']['BACKEND_OAUTH_URL']
+ backendOAuthPath: (window)['env']['BACKEND_OAUTH_URL'],
};
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index 1b5df07..6e0d313 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -5,7 +5,7 @@
export const environment = {
production: false,
backendPath: 'http://localhost:8070',
- backendOAuthPath: 'http://localhost:8070'
+ backendOAuthPath: 'http://localhost:8070',
};
/*
diff --git a/src/font-montserrat.css b/src/font-montserrat.css
index b7942c0..2f514df 100644
--- a/src/font-montserrat.css
+++ b/src/font-montserrat.css
@@ -1,71 +1,115 @@
@font-face {
- font-family: 'Montserrat';
- font-style: italic;
- font-weight: 100;
- src: url(assets/fonts/Montserrat/Montserrat-italic-100.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-italic-100.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-italic-100.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: italic;
+ font-weight: 100;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-italic-100.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-italic-100.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-italic-100.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: italic;
- font-weight: 300;
- src: url(assets/fonts/Montserrat/Montserrat-italic-300.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-italic-300.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-italic-300.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: italic;
+ font-weight: 300;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-italic-300.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-italic-300.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-italic-300.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: italic;
- font-weight: 400;
- src: url(assets/fonts/Montserrat/Montserrat-italic-400.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-italic-400.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-italic-400.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: italic;
+ font-weight: 400;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-italic-400.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-italic-400.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-italic-400.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: italic;
- font-weight: 700;
- src: url(assets/fonts/Montserrat/Montserrat-italic-700.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-italic-700.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-italic-700.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: italic;
+ font-weight: 700;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-italic-700.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-italic-700.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-italic-700.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: italic;
- font-weight: 900;
- src: url(assets/fonts/Montserrat/Montserrat-italic-900.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-italic-900.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-italic-900.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: italic;
+ font-weight: 900;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-italic-900.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-italic-900.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-italic-900.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: normal;
- font-weight: 100;
- src: url(assets/fonts/Montserrat/Montserrat-normal-100.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-normal-100.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-normal-100.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: normal;
+ font-weight: 100;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-normal-100.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-normal-100.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-normal-100.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: normal;
- font-weight: 300;
- src: url(assets/fonts/Montserrat/Montserrat-normal-300.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-normal-300.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-normal-300.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: normal;
+ font-weight: 300;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-normal-300.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-normal-300.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-normal-300.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: normal;
- font-weight: 400;
- src: url(assets/fonts/Montserrat/Montserrat-normal-400.eot);
- src: local('Montserrat'), url(assets/fonts/Montserrat/Montserrat-normal-400.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-normal-400.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-normal-400.svg#Montserrat) format('svg'), url(assets/fonts/Montserrat/Montserrat-normal-400.eot?#iefix) format('embedded-opentype'), url(assets/fonts/Montserrat/Montserrat-normal-400.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: normal;
+ font-weight: 400;
+ src: url(assets/fonts/Montserrat/Montserrat-normal-400.eot);
+ src:
+ local("Montserrat"),
+ url(assets/fonts/Montserrat/Montserrat-normal-400.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-normal-400.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-normal-400.svg#Montserrat)
+ format("svg"),
+ url(assets/fonts/Montserrat/Montserrat-normal-400.eot?#iefix)
+ format("embedded-opentype"),
+ url(assets/fonts/Montserrat/Montserrat-normal-400.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: normal;
- font-weight: 700;
- src: url(assets/fonts/Montserrat/Montserrat-normal-700.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-normal-700.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-normal-700.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: normal;
+ font-weight: 700;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-normal-700.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-normal-700.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-normal-700.ttf)
+ format("truetype");
}
@font-face {
- font-family: 'Montserrat';
- font-style: normal;
- font-weight: 900;
- src: url(assets/fonts/Montserrat/Montserrat-normal-900.woff) format('woff'), url(assets/fonts/Montserrat/Montserrat-normal-900.woff2) format('woff2'), url(assets/fonts/Montserrat/Montserrat-normal-900.ttf) format('truetype');
+ font-family: "Montserrat";
+ font-style: normal;
+ font-weight: 900;
+ src:
+ url(assets/fonts/Montserrat/Montserrat-normal-900.woff) format("woff"),
+ url(assets/fonts/Montserrat/Montserrat-normal-900.woff2) format("woff2"),
+ url(assets/fonts/Montserrat/Montserrat-normal-900.ttf)
+ format("truetype");
}
-
diff --git a/src/index.html b/src/index.html
index 1fbd79b..5f64d54 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,31 +1,39 @@
-
+
+
+
+ Hideyoshi Portfolio
+
+
+
-
-
- Hideyoshi Portfolio
-
-
-
+
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
- Please enable JavaScript to continue using this application.
-
+
+
+ Please enable JavaScript to continue using this
+ application.
+
diff --git a/src/main.ts b/src/main.ts
index 9d9067c..207c6dd 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -8,5 +8,6 @@ if (environment.production) {
enableProdMode();
}
-platformBrowserDynamic().bootstrapModule(AppModule)
- .catch(err => console.error(err));
+platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .catch((err) => console.error(err));
diff --git a/src/manifest.webmanifest b/src/manifest.webmanifest
index f05dad6..f5cdd24 100644
--- a/src/manifest.webmanifest
+++ b/src/manifest.webmanifest
@@ -1,17 +1,17 @@
{
- "name": "Hideyoshi Portfolio",
- "short_name": "Hideyoshi",
- "theme_color": "#2e2e2e",
- "background_color": "#2e2e2e",
- "display": "standalone",
- "orientation": "portrait",
- "scope": "./",
- "start_url": "./",
- "icons": [
- {
- "src": "assets/icons/icon-512x512.png",
- "sizes": "512x512",
- "type": "image/png"
- }
- ]
+ "name": "Hideyoshi Portfolio",
+ "short_name": "Hideyoshi",
+ "theme_color": "#2e2e2e",
+ "background_color": "#2e2e2e",
+ "display": "standalone",
+ "orientation": "portrait",
+ "scope": "./",
+ "start_url": "./",
+ "icons": [
+ {
+ "src": "assets/icons/icon-512x512.png",
+ "sizes": "512x512",
+ "type": "image/png"
+ }
+ ]
}
diff --git a/src/polyfills.ts b/src/polyfills.ts
index 429bb9e..e4555ed 100644
--- a/src/polyfills.ts
+++ b/src/polyfills.ts
@@ -45,8 +45,7 @@
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
-import 'zone.js'; // Included with Angular CLI.
-
+import 'zone.js'; // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS
diff --git a/src/styles.css b/src/styles.css
index d40de97..0b165c2 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1,11 +1,16 @@
/* You can add global styles to this file, and also import other style files */
-@import 'font-montserrat.css';
+@import "font-montserrat.css";
* {
padding: 0 auto;
margin: 0 auto;
}
-h1, h2, h3, h4, h5, h6 {
- font-family: 'Montserrat', sans-serif;
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ font-family: "Montserrat", sans-serif;
}
diff --git a/src/test.ts b/src/test.ts
index 1622015..f6559e7 100644
--- a/src/test.ts
+++ b/src/test.ts
@@ -4,7 +4,7 @@ import 'zone.js/testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
- platformBrowserDynamicTesting
+ platformBrowserDynamicTesting,
} from '@angular/platform-browser-dynamic/testing';
// First, initialize the Angular testing environment.
diff --git a/tsconfig.app.json b/tsconfig.app.json
index b120c1d..b4a792c 100644
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -1,15 +1,10 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
- "extends": "./tsconfig.json",
- "compilerOptions": {
- "outDir": "./out-tsc/app",
- "types": ["node"]
- },
- "files": [
- "src/main.ts",
- "src/polyfills.ts"
- ],
- "include": [
- "src/**/*.d.ts"
- ]
+ "extends": "./tsconfig.json",
+ "compilerOptions": {
+ "outDir": "./out-tsc/app",
+ "types": ["node"]
+ },
+ "files": ["src/main.ts", "src/polyfills.ts"],
+ "include": ["src/**/*.d.ts"]
}
diff --git a/tsconfig.json b/tsconfig.json
index 1407cb6..d226e65 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,33 +1,30 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
- "compileOnSave": false,
- "compilerOptions": {
- "baseUrl": "./",
- "outDir": "./dist/out-tsc",
- "forceConsistentCasingInFileNames": true,
- "strict": true,
- "noImplicitOverride": true,
- "noPropertyAccessFromIndexSignature": true,
- "noImplicitReturns": true,
- "noFallthroughCasesInSwitch": true,
- "sourceMap": true,
- "declaration": false,
- "downlevelIteration": true,
- "experimentalDecorators": true,
- "moduleResolution": "node",
- "importHelpers": true,
- "target": "ES2022",
- "module": "es2020",
- "lib": [
- "es2020",
- "dom"
- ],
- "useDefineForClassFields": false
- },
- "angularCompilerOptions": {
- "enableI18nLegacyMessageIdFormat": false,
- "strictInjectionParameters": true,
- "strictInputAccessModifiers": true,
- "strictTemplates": true
- }
+ "compileOnSave": false,
+ "compilerOptions": {
+ "baseUrl": "./",
+ "outDir": "./dist/out-tsc",
+ "forceConsistentCasingInFileNames": true,
+ "strict": true,
+ "noImplicitOverride": true,
+ "noPropertyAccessFromIndexSignature": true,
+ "noImplicitReturns": true,
+ "noFallthroughCasesInSwitch": true,
+ "sourceMap": true,
+ "declaration": false,
+ "downlevelIteration": true,
+ "experimentalDecorators": true,
+ "moduleResolution": "node",
+ "importHelpers": true,
+ "target": "ES2022",
+ "module": "es2020",
+ "lib": ["es2020", "dom"],
+ "useDefineForClassFields": false
+ },
+ "angularCompilerOptions": {
+ "enableI18nLegacyMessageIdFormat": false,
+ "strictInjectionParameters": true,
+ "strictInputAccessModifiers": true,
+ "strictTemplates": true
+ }
}
diff --git a/tsconfig.spec.json b/tsconfig.spec.json
index 092345b..e6a5127 100644
--- a/tsconfig.spec.json
+++ b/tsconfig.spec.json
@@ -1,18 +1,10 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
- "extends": "./tsconfig.json",
- "compilerOptions": {
- "outDir": "./out-tsc/spec",
- "types": [
- "jasmine"
- ]
- },
- "files": [
- "src/test.ts",
- "src/polyfills.ts"
- ],
- "include": [
- "src/**/*.spec.ts",
- "src/**/*.d.ts"
- ]
+ "extends": "./tsconfig.json",
+ "compilerOptions": {
+ "outDir": "./out-tsc/spec",
+ "types": ["jasmine"]
+ },
+ "files": ["src/test.ts", "src/polyfills.ts"],
+ "include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
}