diff options
author | Chocobozzz <me@florianbigard.com> | 2019-08-28 14:40:06 +0200 |
---|---|---|
committer | Chocobozzz <chocobozzz@cpy.re> | 2019-09-05 10:17:02 +0200 |
commit | 43d0ea7f4b88d52097172cc0c1831edd7e492503 (patch) | |
tree | d950f0a365bc1d7086992a686a06c335e14a9be9 /client/src/app/app.component.ts | |
parent | bc20aaed463b1fc6727a2a90a7d7c4a00b95142a (diff) | |
download | PeerTube-43d0ea7f4b88d52097172cc0c1831edd7e492503.tar.gz PeerTube-43d0ea7f4b88d52097172cc0c1831edd7e492503.tar.zst PeerTube-43d0ea7f4b88d52097172cc0c1831edd7e492503.zip |
Add welcome modal
Diffstat (limited to 'client/src/app/app.component.ts')
-rw-r--r-- | client/src/app/app.component.ts | 45 |
1 files changed, 43 insertions, 2 deletions
diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index 64bfb9671..f68641047 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts | |||
@@ -1,10 +1,10 @@ | |||
1 | import { Component, OnInit } from '@angular/core' | 1 | import { Component, OnInit, ViewChild } from '@angular/core' |
2 | import { DomSanitizer, SafeHtml } from '@angular/platform-browser' | 2 | import { DomSanitizer, SafeHtml } from '@angular/platform-browser' |
3 | import { Event, GuardsCheckStart, NavigationEnd, Router, Scroll } from '@angular/router' | 3 | import { Event, GuardsCheckStart, NavigationEnd, Router, Scroll } from '@angular/router' |
4 | import { AuthService, RedirectService, ServerService, ThemeService } from '@app/core' | 4 | import { AuthService, RedirectService, ServerService, ThemeService } from '@app/core' |
5 | import { is18nPath } from '../../../shared/models/i18n' | 5 | import { is18nPath } from '../../../shared/models/i18n' |
6 | import { ScreenService } from '@app/shared/misc/screen.service' | 6 | import { ScreenService } from '@app/shared/misc/screen.service' |
7 | import { debounceTime, filter, map, pairwise, skip } from 'rxjs/operators' | 7 | import { debounceTime, filter, map, pairwise, skip, switchMap } from 'rxjs/operators' |
8 | import { Hotkey, HotkeysService } from 'angular2-hotkeys' | 8 | import { Hotkey, HotkeysService } from 'angular2-hotkeys' |
9 | import { I18n } from '@ngx-translate/i18n-polyfill' | 9 | import { I18n } from '@ngx-translate/i18n-polyfill' |
10 | import { fromEvent } from 'rxjs' | 10 | import { fromEvent } from 'rxjs' |
@@ -13,6 +13,11 @@ import { PluginService } from '@app/core/plugins/plugin.service' | |||
13 | import { HooksService } from '@app/core/plugins/hooks.service' | 13 | import { HooksService } from '@app/core/plugins/hooks.service' |
14 | import { NgbModal } from '@ng-bootstrap/ng-bootstrap' | 14 | import { NgbModal } from '@ng-bootstrap/ng-bootstrap' |
15 | import { POP_STATE_MODAL_DISMISS } from '@app/shared/misc/constants' | 15 | import { POP_STATE_MODAL_DISMISS } from '@app/shared/misc/constants' |
16 | import { WelcomeModalComponent } from '@app/modal/welcome-modal.component' | ||
17 | import { InstanceConfigWarningModalComponent } from '@app/modal/instance-config-warning-modal.component' | ||
18 | import { UserRole } from '@shared/models' | ||
19 | import { User } from '@app/shared' | ||
20 | import { InstanceService } from '@app/shared/instance/instance.service' | ||
16 | 21 | ||
17 | @Component({ | 22 | @Component({ |
18 | selector: 'my-app', | 23 | selector: 'my-app', |
@@ -20,6 +25,9 @@ import { POP_STATE_MODAL_DISMISS } from '@app/shared/misc/constants' | |||
20 | styleUrls: [ './app.component.scss' ] | 25 | styleUrls: [ './app.component.scss' ] |
21 | }) | 26 | }) |
22 | export class AppComponent implements OnInit { | 27 | export class AppComponent implements OnInit { |
28 | @ViewChild('welcomeModal', { static: false }) welcomeModal: WelcomeModalComponent | ||
29 | @ViewChild('instanceConfigWarningModal', { static: false }) instanceConfigWarningModal: InstanceConfigWarningModalComponent | ||
30 | |||
23 | isMenuDisplayed = true | 31 | isMenuDisplayed = true |
24 | isMenuChangedByUser = false | 32 | isMenuChangedByUser = false |
25 | 33 | ||
@@ -32,6 +40,7 @@ export class AppComponent implements OnInit { | |||
32 | private authService: AuthService, | 40 | private authService: AuthService, |
33 | private serverService: ServerService, | 41 | private serverService: ServerService, |
34 | private pluginService: PluginService, | 42 | private pluginService: PluginService, |
43 | private instanceService: InstanceService, | ||
35 | private domSanitizer: DomSanitizer, | 44 | private domSanitizer: DomSanitizer, |
36 | private redirectService: RedirectService, | 45 | private redirectService: RedirectService, |
37 | private screenService: ScreenService, | 46 | private screenService: ScreenService, |
@@ -96,6 +105,8 @@ export class AppComponent implements OnInit { | |||
96 | .subscribe(() => this.onResize()) | 105 | .subscribe(() => this.onResize()) |
97 | 106 | ||
98 | this.location.onPopState(() => this.modalService.dismissAll(POP_STATE_MODAL_DISMISS)) | 107 | this.location.onPopState(() => this.modalService.dismissAll(POP_STATE_MODAL_DISMISS)) |
108 | |||
109 | this.openModalsIfNeeded() | ||
99 | } | 110 | } |
100 | 111 | ||
101 | isUserLoggedIn () { | 112 | isUserLoggedIn () { |
@@ -220,32 +231,62 @@ export class AppComponent implements OnInit { | |||
220 | this.hooks.runAction('action:application.init', 'common') | 231 | this.hooks.runAction('action:application.init', 'common') |
221 | } | 232 | } |
222 | 233 | ||
234 | private async openModalsIfNeeded () { | ||
235 | this.serverService.configLoaded | ||
236 | .pipe( | ||
237 | switchMap(() => this.authService.userInformationLoaded), | ||
238 | map(() => this.authService.getUser()), | ||
239 | filter(user => user.role === UserRole.ADMINISTRATOR) | ||
240 | ).subscribe(user => setTimeout(() => this.openAdminModals(user))) // setTimeout because of ngIf in template | ||
241 | } | ||
242 | |||
243 | private async openAdminModals (user: User) { | ||
244 | if (user.noWelcomeModal !== true) return this.welcomeModal.show() | ||
245 | |||
246 | const config = this.serverService.getConfig() | ||
247 | |||
248 | if (user.noInstanceConfigWarningModal !== true && config.signup.allowed && config.instance.name.toLowerCase() === 'peertube') { | ||
249 | this.instanceService.getAbout() | ||
250 | .subscribe(about => { | ||
251 | if (!about.instance.terms) { | ||
252 | this.instanceConfigWarningModal.show() | ||
253 | } | ||
254 | }) | ||
255 | } | ||
256 | } | ||
257 | |||
223 | private initHotkeys () { | 258 | private initHotkeys () { |
224 | this.hotkeysService.add([ | 259 | this.hotkeysService.add([ |
225 | new Hotkey(['/', 's'], (event: KeyboardEvent): boolean => { | 260 | new Hotkey(['/', 's'], (event: KeyboardEvent): boolean => { |
226 | document.getElementById('search-video').focus() | 261 | document.getElementById('search-video').focus() |
227 | return false | 262 | return false |
228 | }, undefined, this.i18n('Focus the search bar')), | 263 | }, undefined, this.i18n('Focus the search bar')), |
264 | |||
229 | new Hotkey('b', (event: KeyboardEvent): boolean => { | 265 | new Hotkey('b', (event: KeyboardEvent): boolean => { |
230 | this.toggleMenu() | 266 | this.toggleMenu() |
231 | return false | 267 | return false |
232 | }, undefined, this.i18n('Toggle the left menu')), | 268 | }, undefined, this.i18n('Toggle the left menu')), |
269 | |||
233 | new Hotkey('g o', (event: KeyboardEvent): boolean => { | 270 | new Hotkey('g o', (event: KeyboardEvent): boolean => { |
234 | this.router.navigate([ '/videos/overview' ]) | 271 | this.router.navigate([ '/videos/overview' ]) |
235 | return false | 272 | return false |
236 | }, undefined, this.i18n('Go to the discover videos page')), | 273 | }, undefined, this.i18n('Go to the discover videos page')), |
274 | |||
237 | new Hotkey('g t', (event: KeyboardEvent): boolean => { | 275 | new Hotkey('g t', (event: KeyboardEvent): boolean => { |
238 | this.router.navigate([ '/videos/trending' ]) | 276 | this.router.navigate([ '/videos/trending' ]) |
239 | return false | 277 | return false |
240 | }, undefined, this.i18n('Go to the trending videos page')), | 278 | }, undefined, this.i18n('Go to the trending videos page')), |
279 | |||
241 | new Hotkey('g r', (event: KeyboardEvent): boolean => { | 280 | new Hotkey('g r', (event: KeyboardEvent): boolean => { |
242 | this.router.navigate([ '/videos/recently-added' ]) | 281 | this.router.navigate([ '/videos/recently-added' ]) |
243 | return false | 282 | return false |
244 | }, undefined, this.i18n('Go to the recently added videos page')), | 283 | }, undefined, this.i18n('Go to the recently added videos page')), |
284 | |||
245 | new Hotkey('g l', (event: KeyboardEvent): boolean => { | 285 | new Hotkey('g l', (event: KeyboardEvent): boolean => { |
246 | this.router.navigate([ '/videos/local' ]) | 286 | this.router.navigate([ '/videos/local' ]) |
247 | return false | 287 | return false |
248 | }, undefined, this.i18n('Go to the local videos page')), | 288 | }, undefined, this.i18n('Go to the local videos page')), |
289 | |||
249 | new Hotkey('g u', (event: KeyboardEvent): boolean => { | 290 | new Hotkey('g u', (event: KeyboardEvent): boolean => { |
250 | this.router.navigate([ '/videos/upload' ]) | 291 | this.router.navigate([ '/videos/upload' ]) |
251 | return false | 292 | return false |