]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/app/shared/menu/top-menu-dropdown.component.ts
Don't log error on actor delete signature error
[github/Chocobozzz/PeerTube.git] / client / src / app / shared / menu / top-menu-dropdown.component.ts
CommitLineData
ddb83e49
C
1import { Component, Input, OnDestroy, OnInit } from '@angular/core'
2import { filter, take } from 'rxjs/operators'
80bfd33c 3import { NavigationEnd, Router } from '@angular/router'
ddb83e49
C
4import { Subscription } from 'rxjs'
5import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
a55052c9 6import { GlobalIconName } from '@app/shared/images/global-icon.component'
64545a83 7import { ScreenService } from '@app/shared/misc/screen.service'
ddb83e49
C
8
9export type TopMenuDropdownParam = {
10 label: string
11 routerLink?: string
12
13 children?: {
14 label: string
15 routerLink: string
a55052c9
C
16
17 iconName?: GlobalIconName
ddb83e49
C
18 }[]
19}
20
21@Component({
22 selector: 'my-top-menu-dropdown',
23 templateUrl: './top-menu-dropdown.component.html',
24 styleUrls: [ './top-menu-dropdown.component.scss' ]
25})
26export class TopMenuDropdownComponent implements OnInit, OnDestroy {
27 @Input() menuEntries: TopMenuDropdownParam[] = []
28
29 suffixLabels: { [ parentLabel: string ]: string }
a55052c9 30 hasIcons = false
64545a83 31 container: undefined | 'body' = undefined
ddb83e49
C
32
33 private openedOnHover = false
34 private routeSub: Subscription
35
64545a83
C
36 constructor (
37 private router: Router,
38 private screen: ScreenService
39 ) {}
ddb83e49
C
40
41 ngOnInit () {
42 this.updateChildLabels(window.location.pathname)
43
44 this.routeSub = this.router.events
80bfd33c 45 .pipe(filter(event => event instanceof NavigationEnd))
ddb83e49 46 .subscribe(() => this.updateChildLabels(window.location.pathname))
a55052c9
C
47
48 this.hasIcons = this.menuEntries.some(
49 e => e.children && e.children.some(c => !!c.iconName)
50 )
64545a83
C
51
52 // FIXME: We have to set body for the container to avoid because of scroll overflow on mobile view
53 // But this break our hovering system
54 if (this.screen.isInMobileView()) {
55 this.container = 'body'
56 }
ddb83e49
C
57 }
58
59 ngOnDestroy () {
60 if (this.routeSub) this.routeSub.unsubscribe()
61 }
62
63 openDropdownOnHover (dropdown: NgbDropdown) {
64 this.openedOnHover = true
65 dropdown.open()
66
67 // Menu was closed
68 dropdown.openChange
69 .pipe(take(1))
a55052c9 70 .subscribe(() => this.openedOnHover = false)
ddb83e49
C
71 }
72
80bfd33c
C
73 dropdownAnchorClicked (dropdown: NgbDropdown) {
74 if (this.openedOnHover) {
75 this.openedOnHover = false
76 return
77 }
78
79 return dropdown.toggle()
80 }
81
ddb83e49
C
82 closeDropdownIfHovered (dropdown: NgbDropdown) {
83 if (this.openedOnHover === false) return
84
85 dropdown.close()
86 this.openedOnHover = false
87 }
88
89 private updateChildLabels (path: string) {
90 this.suffixLabels = {}
91
92 for (const entry of this.menuEntries) {
93 if (!entry.children) continue
94
95 for (const child of entry.children) {
96 if (path.startsWith(child.routerLink)) {
97 this.suffixLabels[entry.label] = child.label
98 }
99 }
100 }
101 }
102}