77 lines
1.8 KiB
TypeScript
77 lines
1.8 KiB
TypeScript
import {Component, HostListener, OnInit} from '@angular/core';
|
|
import {User} from '../../models/user';
|
|
import {StorageService} from '../../services/storage.service';
|
|
import {Router} from '@angular/router';
|
|
|
|
@Component({
|
|
selector: 'app-header',
|
|
templateUrl: './header.component.html',
|
|
styleUrls: ['./header.component.scss']
|
|
})
|
|
export class HeaderComponent implements OnInit {
|
|
|
|
showProfilePopOver: boolean = false;
|
|
user?: User;
|
|
initialClickMobileMenu : boolean = true
|
|
dropdownContentStyle! : CSSStyleDeclaration;
|
|
|
|
constructor(private router: Router) {
|
|
this.user = StorageService.getUserInfo();
|
|
}
|
|
|
|
ngOnInit(): void {
|
|
this.dropdownContentStyle = document.getElementById('menu-mobile-dropdown-content')!.style;
|
|
}
|
|
|
|
openProfile(): void {
|
|
this.showProfilePopOver = true;
|
|
}
|
|
|
|
closeProfile(): void {
|
|
this.showProfilePopOver = false;
|
|
}
|
|
|
|
|
|
|
|
|
|
getUserName(): string {
|
|
return this.user ? this.user.firstName : 'Logged out';
|
|
}
|
|
|
|
navigate(path: string): void {
|
|
this.initialClickMobileMenu = true;
|
|
this.router.navigate([path]);
|
|
}
|
|
|
|
openMobileDropdown() : void {
|
|
if (!this.isMobileDropdownOpen()) {
|
|
this.dropdownContentStyle.display = 'block';
|
|
this.initialClickMobileMenu = true;
|
|
}
|
|
}
|
|
|
|
closeMobileDropdown() : void {
|
|
this.dropdownContentStyle.display = 'none';
|
|
this.initialClickMobileMenu = true;
|
|
}
|
|
|
|
isMobileDropdownOpen() : Boolean {
|
|
return this.dropdownContentStyle.display == 'block';
|
|
}
|
|
|
|
@HostListener('document:click', ['$event'])
|
|
@HostListener('document:touchstart', ['$event'])
|
|
handleOutsideClick(event: any) {
|
|
if (!document.getElementById("menu-mobile-dropdown-content")!.contains(event.target)) {
|
|
if(this.isMobileDropdownOpen()) {
|
|
if(this.initialClickMobileMenu) {
|
|
this.initialClickMobileMenu = false;
|
|
} else {
|
|
this.closeMobileDropdown();
|
|
console.log("Zu gemacht!")
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|