aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-09-05 14:42:59 +0200
committerChocobozzz <me@florianbigard.com>2018-09-05 14:42:59 +0200
commit4c8e4e04d1b3f0f207e9155df393ceeb23dc2172 (patch)
treee873838b8547576f73390b14606feb7f5080a293 /client
parentc182527a6c6e01bd5cd32b212026c3176ecbe63d (diff)
downloadPeerTube-4c8e4e04d1b3f0f207e9155df393ceeb23dc2172.tar.gz
PeerTube-4c8e4e04d1b3f0f207e9155df393ceeb23dc2172.tar.zst
PeerTube-4c8e4e04d1b3f0f207e9155df393ceeb23dc2172.zip
Use dropdown in my account -> "my library"
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+my-account/my-account.component.html17
-rw-r--r--client/src/app/+my-account/my-account.component.scss14
-rw-r--r--client/src/app/+my-account/my-account.component.ts41
3 files changed, 64 insertions, 8 deletions
diff --git a/client/src/app/+my-account/my-account.component.html b/client/src/app/+my-account/my-account.component.html
index b79e61bef..b602fd69f 100644
--- a/client/src/app/+my-account/my-account.component.html
+++ b/client/src/app/+my-account/my-account.component.html
@@ -2,13 +2,22 @@
2 <div class="sub-menu"> 2 <div class="sub-menu">
3 <a i18n routerLink="/my-account/settings" routerLinkActive="active" class="title-page">My settings</a> 3 <a i18n routerLink="/my-account/settings" routerLinkActive="active" class="title-page">My settings</a>
4 4
5 <a i18n routerLink="/my-account/video-channels" routerLinkActive="active" class="title-page">My channels</a> 5 <div ngbDropdown class="my-library">
6 <span role="button" class="title-page" [ngClass]="{ active: libraryLabel !== '' }" ngbDropdownToggle>
7 <ng-container i18n>My library</ng-container>
8 <ng-container *ngIf="libraryLabel"> - {{ libraryLabel }}</ng-container>
9 </span>
6 10
7 <a i18n routerLink="/my-account/videos" routerLinkActive="active" class="title-page">My videos</a> 11 <div ngbDropdownMenu>
12 <a class="dropdown-item" i18n routerLink="/my-account/video-channels">My channels</a>
8 13
9 <a i18n routerLink="/my-account/subscriptions" routerLinkActive="active" class="title-page">My subscriptions</a> 14 <a class="dropdown-item" i18n routerLink="/my-account/videos">My videos</a>
10 15
11 <a *ngIf="isVideoImportEnabled()" i18n routerLink="/my-account/video-imports" routerLinkActive="active" class="title-page">My imports</a> 16 <a class="dropdown-item" i18n routerLink="/my-account/subscriptions">My subscriptions</a>
17
18 <a class="dropdown-item" *ngIf="isVideoImportEnabled()" i18n routerLink="/my-account/video-imports">My imports</a>
19 </div>
20 </div>
12 21
13 <a i18n routerLink="/my-account/ownership" routerLinkActive="active" class="title-page">Ownership changes</a> 22 <a i18n routerLink="/my-account/ownership" routerLinkActive="active" class="title-page">Ownership changes</a>
14 </div> 23 </div>
diff --git a/client/src/app/+my-account/my-account.component.scss b/client/src/app/+my-account/my-account.component.scss
new file mode 100644
index 000000000..20b2639b5
--- /dev/null
+++ b/client/src/app/+my-account/my-account.component.scss
@@ -0,0 +1,14 @@
1.my-library {
2 span[role=button] {
3 cursor: pointer;
4 }
5
6 a {
7 display: block;
8 }
9}
10
11/deep/ .dropdown-toggle::after {
12 position: relative;
13 top: 2px;
14} \ No newline at end of file
diff --git a/client/src/app/+my-account/my-account.component.ts b/client/src/app/+my-account/my-account.component.ts
index 6e29cdd83..548f6a1c0 100644
--- a/client/src/app/+my-account/my-account.component.ts
+++ b/client/src/app/+my-account/my-account.component.ts
@@ -1,17 +1,50 @@
1import { Component } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { ServerService } from '@app/core' 2import { ServerService } from '@app/core'
3import { NavigationStart, Router } from '@angular/router'
4import { filter } from 'rxjs/operators'
5import { I18n } from '@ngx-translate/i18n-polyfill'
3 6
4@Component({ 7@Component({
5 selector: 'my-my-account', 8 selector: 'my-my-account',
6 templateUrl: './my-account.component.html' 9 templateUrl: './my-account.component.html',
10 styleUrls: [ './my-account.component.scss' ]
7}) 11})
8export class MyAccountComponent { 12export class MyAccountComponent implements OnInit {
13
14 libraryLabel = ''
9 15
10 constructor ( 16 constructor (
11 private serverService: ServerService 17 private serverService: ServerService,
18 private router: Router,
19 private i18n: I18n
12 ) {} 20 ) {}
13 21
22 ngOnInit () {
23 console.log(this.router.url)
24 this.updateLibraryLabel(this.router.url)
25
26 this.router.events
27 .pipe(filter(event => event instanceof NavigationStart))
28 .subscribe((event: NavigationStart) => this.updateLibraryLabel(event.url))
29 }
30
14 isVideoImportEnabled () { 31 isVideoImportEnabled () {
15 return this.serverService.getConfig().import.videos.http.enabled 32 return this.serverService.getConfig().import.videos.http.enabled
16 } 33 }
34
35 private updateLibraryLabel (url: string) {
36 const [ path ] = url.split('?')
37
38 if (path === '/my-account/video-channels') {
39 this.libraryLabel = this.i18n('Channels')
40 } else if (path === '/my-account/videos') {
41 this.libraryLabel = this.i18n('Videos')
42 } else if (path === '/my-account/subscriptions') {
43 this.libraryLabel = this.i18n('Subscriptions')
44 } else if (path === '/my-account/video-imports') {
45 this.libraryLabel = this.i18n('Video imports')
46 } else {
47 this.libraryLabel = ''
48 }
49 }
17} 50}