]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blob - client/src/app/menu/menu.component.ts
Translated using Weblate (Russian)
[github/Chocobozzz/PeerTube.git] / client / src / app / menu / menu.component.ts
1 import { HotkeysService } from 'angular2-hotkeys'
2 import * as debug from 'debug'
3 import { switchMap } from 'rxjs/operators'
4 import { ViewportScroller } from '@angular/common'
5 import { Component, OnInit, ViewChild } from '@angular/core'
6 import { Router } from '@angular/router'
7 import {
8 AuthService,
9 AuthStatus,
10 AuthUser,
11 HooksService,
12 MenuSection,
13 MenuService,
14 RedirectService,
15 ScreenService,
16 ServerService,
17 UserService
18 } from '@app/core'
19 import { scrollToTop } from '@app/helpers'
20 import { LanguageChooserComponent } from '@app/menu/language-chooser.component'
21 import { QuickSettingsModalComponent } from '@app/modal/quick-settings-modal.component'
22 import { PeertubeModalService } from '@app/shared/shared-main/peertube-modal/peertube-modal.service'
23 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
24 import { HTMLServerConfig, ServerConfig, UserRight, VideoConstant } from '@shared/models'
25
26 const logger = debug('peertube:menu:MenuComponent')
27
28 @Component({
29 selector: 'my-menu',
30 templateUrl: './menu.component.html',
31 styleUrls: [ './menu.component.scss' ]
32 })
33 export class MenuComponent implements OnInit {
34 @ViewChild('languageChooserModal', { static: true }) languageChooserModal: LanguageChooserComponent
35 @ViewChild('quickSettingsModal', { static: true }) quickSettingsModal: QuickSettingsModalComponent
36 @ViewChild('dropdown') dropdown: NgbDropdown
37
38 user: AuthUser
39 isLoggedIn: boolean
40
41 userHasAdminAccess = false
42 helpVisible = false
43
44 videoLanguages: string[] = []
45 nsfwPolicy: string
46
47 currentInterfaceLanguage: string
48
49 menuSections: MenuSection[] = []
50
51 private languages: VideoConstant<string>[] = []
52
53 private htmlServerConfig: HTMLServerConfig
54 private serverConfig: ServerConfig
55
56 private routesPerRight: { [role in UserRight]?: string } = {
57 [UserRight.MANAGE_USERS]: '/admin/users',
58 [UserRight.MANAGE_SERVER_FOLLOW]: '/admin/friends',
59 [UserRight.MANAGE_ABUSES]: '/admin/moderation/abuses',
60 [UserRight.MANAGE_VIDEO_BLACKLIST]: '/admin/moderation/video-blocks',
61 [UserRight.MANAGE_JOBS]: '/admin/jobs',
62 [UserRight.MANAGE_CONFIGURATION]: '/admin/config'
63 }
64
65 constructor (
66 private viewportScroller: ViewportScroller,
67 private authService: AuthService,
68 private userService: UserService,
69 private serverService: ServerService,
70 private redirectService: RedirectService,
71 private hotkeysService: HotkeysService,
72 private screenService: ScreenService,
73 private menuService: MenuService,
74 private modalService: PeertubeModalService,
75 private router: Router,
76 private hooks: HooksService
77 ) { }
78
79 get isInMobileView () {
80 return this.screenService.isInMobileView()
81 }
82
83 get dropdownContainer () {
84 if (this.isInMobileView) return null
85
86 return 'body' as 'body'
87 }
88
89 get language () {
90 return this.languageChooserModal.getCurrentLanguage()
91 }
92
93 ngOnInit () {
94 this.htmlServerConfig = this.serverService.getHTMLConfig()
95 this.currentInterfaceLanguage = this.languageChooserModal.getCurrentLanguage()
96
97 this.isLoggedIn = this.authService.isLoggedIn()
98 this.updateUserState()
99 this.buildMenuSections()
100
101 this.authService.loginChangedSource.subscribe(
102 status => {
103 if (status === AuthStatus.LoggedIn) {
104 this.isLoggedIn = true
105 } else if (status === AuthStatus.LoggedOut) {
106 this.isLoggedIn = false
107 }
108
109 this.updateUserState()
110 this.buildMenuSections()
111 }
112 )
113
114 this.hotkeysService.cheatSheetToggle
115 .subscribe(isOpen => this.helpVisible = isOpen)
116
117 this.serverService.getVideoLanguages()
118 .subscribe(languages => {
119 this.languages = languages
120
121 this.authService.userInformationLoaded
122 .subscribe(() => this.buildUserLanguages())
123 })
124
125 this.serverService.getConfig()
126 .subscribe(config => this.serverConfig = config)
127
128 this.modalService.openQuickSettingsSubject
129 .subscribe(() => this.openQuickSettings())
130 }
131
132 isRegistrationAllowed () {
133 if (!this.serverConfig) return false
134
135 return this.serverConfig.signup.allowed &&
136 this.serverConfig.signup.allowedForCurrentIP
137 }
138
139 getFirstAdminRightAvailable () {
140 const user = this.authService.getUser()
141 if (!user) return undefined
142
143 const adminRights = [
144 UserRight.MANAGE_USERS,
145 UserRight.MANAGE_SERVER_FOLLOW,
146 UserRight.MANAGE_ABUSES,
147 UserRight.MANAGE_VIDEO_BLACKLIST,
148 UserRight.MANAGE_JOBS,
149 UserRight.MANAGE_CONFIGURATION
150 ]
151
152 for (const adminRight of adminRights) {
153 if (user.hasRight(adminRight)) {
154 return adminRight
155 }
156 }
157
158 return undefined
159 }
160
161 getFirstAdminRouteAvailable () {
162 const right = this.getFirstAdminRightAvailable()
163
164 return this.routesPerRight[right]
165 }
166
167 logout (event: Event) {
168 event.preventDefault()
169
170 this.authService.logout()
171 // Redirect to home page
172 this.redirectService.redirectToHomepage()
173 }
174
175 openLanguageChooser () {
176 this.languageChooserModal.show()
177 }
178
179 openHotkeysCheatSheet () {
180 this.hotkeysService.cheatSheetToggle.next(!this.helpVisible)
181 }
182
183 openQuickSettings () {
184 this.quickSettingsModal.show()
185 }
186
187 toggleUseP2P () {
188 if (!this.user) return
189 this.user.webTorrentEnabled = !this.user.webTorrentEnabled
190
191 this.userService.updateMyProfile({ webTorrentEnabled: this.user.webTorrentEnabled })
192 .subscribe(() => this.authService.refreshUserInformation())
193 }
194
195 langForLocale (localeId: string) {
196 if (localeId === '_unknown') return $localize`Unknown`
197
198 return this.languages.find(lang => lang.id === localeId).label
199 }
200
201 onActiveLinkScrollToAnchor (link: HTMLAnchorElement) {
202 const linkURL = link.getAttribute('href')
203 const linkHash = link.getAttribute('fragment')
204
205 // On same url without fragment restore top scroll position
206 if (!linkHash && this.router.url.includes(linkURL)) {
207 scrollToTop('smooth')
208 }
209
210 // On same url with fragment restore anchor scroll position
211 if (linkHash && this.router.url === linkURL) {
212 this.viewportScroller.scrollToAnchor(linkHash)
213 }
214
215 if (this.screenService.isInSmallView()) {
216 this.menuService.toggleMenu()
217 }
218 }
219
220 // Lock menu scroll when menu scroll to avoid fleeing / detached dropdown
221 onMenuScrollEvent () {
222 document.querySelector('menu').scrollTo(0, 0)
223 }
224
225 onDropdownOpenChange (opened: boolean) {
226 if (this.screenService.isInMobileView()) return
227
228 // Close dropdown when window scroll to avoid dropdown quick jump for re-position
229 const onWindowScroll = () => {
230 this.dropdown?.close()
231 window.removeEventListener('scroll', onWindowScroll)
232 }
233
234 if (opened) {
235 window.addEventListener('scroll', onWindowScroll)
236 document.querySelector('menu').scrollTo(0, 0) // Reset menu scroll to easy lock
237 document.querySelector('menu').addEventListener('scroll', this.onMenuScrollEvent)
238 } else {
239 document.querySelector('menu').removeEventListener('scroll', this.onMenuScrollEvent)
240 }
241 }
242
243 private async buildMenuSections () {
244 const menuSections = []
245
246 if (this.isLoggedIn) {
247 menuSections.push(
248 this.menuService.buildLibraryLinks(this.user?.canSeeVideosLink)
249 )
250 }
251
252 menuSections.push(
253 this.menuService.buildCommonLinks(this.htmlServerConfig)
254 )
255
256 this.menuSections = await this.hooks.wrapObject(menuSections, 'common', 'filter:left-menu.links.create.result')
257 }
258
259 private buildUserLanguages () {
260 if (!this.user) {
261 this.videoLanguages = []
262 return
263 }
264
265 if (!this.user.videoLanguages) {
266 this.videoLanguages = [ $localize`any language` ]
267 return
268 }
269
270 this.videoLanguages = this.user.videoLanguages
271 .map(locale => this.langForLocale(locale))
272 .map(value => value === undefined ? '?' : value)
273 }
274
275 private computeAdminAccess () {
276 const right = this.getFirstAdminRightAvailable()
277
278 this.userHasAdminAccess = right !== undefined
279 }
280
281 private computeVideosLink () {
282 if (!this.isLoggedIn) return
283
284 this.authService.userInformationLoaded
285 .pipe(
286 switchMap(() => this.user.computeCanSeeVideosLink(this.userService.getMyVideoQuotaUsed()))
287 ).subscribe(res => {
288 if (res === true) logger('User can see videos link.')
289 else logger('User cannot see videos link.')
290 })
291 }
292
293 private computeNSFWPolicy () {
294 if (!this.user) {
295 this.nsfwPolicy = null
296 return
297 }
298
299 switch (this.user.nsfwPolicy) {
300 case 'do_not_list':
301 this.nsfwPolicy = $localize`hide`
302 break
303
304 case 'blur':
305 this.nsfwPolicy = $localize`blur`
306 break
307
308 case 'display':
309 this.nsfwPolicy = $localize`display`
310 break
311 }
312 }
313
314 private updateUserState () {
315 this.user = this.isLoggedIn
316 ? this.authService.getUser()
317 : undefined
318
319 this.computeAdminAccess()
320 this.computeNSFWPolicy()
321 this.computeVideosLink()
322 }
323 }