]>
Commit | Line | Data |
---|---|---|
7f5f4152 | 1 | import { Observable } from 'rxjs' |
5c20a455 | 2 | import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core' |
a9bfa85d | 3 | import { AuthService, Notifier, User, UserService } from '@app/core' |
67ed6552 C |
4 | import { Video } from '@app/shared/shared-main' |
5 | import { MiniatureDisplayOptions } from '@app/shared/shared-video-miniature' | |
6 | import { VideoPlaylist } from '@app/shared/shared-video-playlist' | |
67ed6552 C |
7 | import { RecommendationInfo } from './recommendation-info.model' |
8 | import { RecommendedVideosStore } from './recommended-videos.store' | |
7f5f4152 BJ |
9 | |
10 | @Component({ | |
11 | selector: 'my-recommended-videos', | |
d816f3a0 RK |
12 | templateUrl: './recommended-videos.component.html', |
13 | styleUrls: [ './recommended-videos.component.scss' ] | |
7f5f4152 | 14 | }) |
5c20a455 | 15 | export class RecommendedVideosComponent implements OnInit, OnChanges { |
b0c36821 | 16 | @Input() inputRecommendation: RecommendationInfo |
bee29df8 | 17 | @Input() playlist: VideoPlaylist |
0f7407d9 C |
18 | @Input() displayAsRow: boolean |
19 | ||
6aa54148 | 20 | @Output() gotRecommendations = new EventEmitter<Video[]>() |
7f5f4152 | 21 | |
8adc5ddb | 22 | autoPlayNextVideo: boolean |
5def76eb | 23 | autoPlayNextVideoTooltip: string |
8adc5ddb | 24 | |
c2caa99b RK |
25 | displayOptions: MiniatureDisplayOptions = { |
26 | date: true, | |
27 | views: true, | |
28 | by: true, | |
29 | avatar: true | |
30 | } | |
31 | ||
5c20a455 C |
32 | userMiniature: User |
33 | ||
7f5f4152 BJ |
34 | readonly hasVideos$: Observable<boolean> |
35 | readonly videos$: Observable<Video[]> | |
36 | ||
37 | constructor ( | |
d816f3a0 RK |
38 | private userService: UserService, |
39 | private authService: AuthService, | |
40 | private notifier: Notifier, | |
a9bfa85d | 41 | private store: RecommendedVideosStore |
7f5f4152 BJ |
42 | ) { |
43 | this.videos$ = this.store.recommendations$ | |
44 | this.hasVideos$ = this.store.hasRecommendations$ | |
6aa54148 | 45 | this.videos$.subscribe(videos => this.gotRecommendations.emit(videos)) |
d816f3a0 | 46 | |
a9bfa85d C |
47 | this.userService.getAnonymousOrLoggedUser() |
48 | .subscribe(user => this.autoPlayNextVideo = user.autoPlayNextVideo) | |
5def76eb | 49 | |
66357162 | 50 | this.autoPlayNextVideoTooltip = $localize`When active, the next video is automatically played after the current one.` |
7f5f4152 BJ |
51 | } |
52 | ||
5c20a455 C |
53 | ngOnInit () { |
54 | this.userService.getAnonymousOrLoggedUser() | |
55 | .subscribe(user => this.userMiniature = user) | |
56 | } | |
57 | ||
58 | ngOnChanges () { | |
b0c36821 J |
59 | if (this.inputRecommendation) { |
60 | this.store.requestNewRecommendations(this.inputRecommendation) | |
7f5f4152 BJ |
61 | } |
62 | } | |
63 | ||
0a57bbff C |
64 | onVideoRemoved () { |
65 | this.store.requestNewRecommendations(this.inputRecommendation) | |
66 | } | |
d816f3a0 RK |
67 | |
68 | switchAutoPlayNextVideo () { | |
a9bfa85d | 69 | const details = { autoPlayNextVideo: this.autoPlayNextVideo } |
d816f3a0 RK |
70 | |
71 | if (this.authService.isLoggedIn()) { | |
1378c0d3 C |
72 | this.userService.updateMyProfile(details) |
73 | .subscribe({ | |
74 | next: () => { | |
75 | this.authService.refreshUserInformation() | |
76 | }, | |
77 | ||
78 | error: err => this.notifier.error(err.message) | |
79 | }) | |
a9bfa85d C |
80 | } else { |
81 | this.userService.updateMyAnonymousProfile(details) | |
d816f3a0 RK |
82 | } |
83 | } | |
7f5f4152 | 84 | } |