]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/app/shared/video/video-actions-dropdown.component.ts
Fix russian build
[github/Chocobozzz/PeerTube.git] / client / src / app / shared / video / video-actions-dropdown.component.ts
CommitLineData
72675ebe 1import { AfterViewInit, Component, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core'
3a0fb65c
C
2import { I18n } from '@ngx-translate/i18n-polyfill'
3import { DropdownAction, DropdownButtonSize, DropdownDirection } from '@app/shared/buttons/action-dropdown.component'
4import { AuthService, ConfirmService, Notifier, ServerService } from '@app/core'
5import { BlocklistService } from '@app/shared/blocklist'
6import { Video } from '@app/shared/video/video.model'
7import { VideoService } from '@app/shared/video/video.service'
8import { VideoDetails } from '@app/shared/video/video-details.model'
9import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
10import { VideoAddToPlaylistComponent } from '@app/shared/video-playlist/video-add-to-playlist.component'
11import { VideoDownloadComponent } from '@app/shared/video/modals/video-download.component'
12import { VideoReportComponent } from '@app/shared/video/modals/video-report.component'
13import { VideoBlacklistComponent } from '@app/shared/video/modals/video-blacklist.component'
14import { VideoBlacklistService } from '@app/shared/video-blacklist'
15import { ScreenService } from '@app/shared/misc/screen.service'
16
17export type VideoActionsDisplayType = {
18 playlist?: boolean
19 download?: boolean
20 update?: boolean
21 blacklist?: boolean
22 delete?: boolean
23 report?: boolean
24}
25
26@Component({
27 selector: 'my-video-actions-dropdown',
28 templateUrl: './video-actions-dropdown.component.html',
29 styleUrls: [ './video-actions-dropdown.component.scss' ]
30})
743f023c 31export class VideoActionsDropdownComponent implements AfterViewInit, OnChanges {
3a0fb65c
C
32 @ViewChild('playlistDropdown') playlistDropdown: NgbDropdown
33 @ViewChild('playlistAdd') playlistAdd: VideoAddToPlaylistComponent
34
35 @ViewChild('videoDownloadModal') videoDownloadModal: VideoDownloadComponent
36 @ViewChild('videoReportModal') videoReportModal: VideoReportComponent
37 @ViewChild('videoBlacklistModal') videoBlacklistModal: VideoBlacklistComponent
38
39 @Input() video: Video | VideoDetails
40
41 @Input() displayOptions: VideoActionsDisplayType = {
42 playlist: false,
43 download: true,
44 update: true,
45 blacklist: true,
46 delete: true,
47 report: true
48 }
8dfceec4 49 @Input() placement = 'left'
3a0fb65c
C
50
51 @Input() label: string
52
53 @Input() buttonStyled = false
54 @Input() buttonSize: DropdownButtonSize = 'normal'
55 @Input() buttonDirection: DropdownDirection = 'vertical'
56
57 @Output() videoRemoved = new EventEmitter()
58 @Output() videoUnblacklisted = new EventEmitter()
59 @Output() videoBlacklisted = new EventEmitter()
60
61 videoActions: DropdownAction<{ video: Video }>[][] = []
62
63 private loaded = false
64
65 constructor (
66 private authService: AuthService,
67 private notifier: Notifier,
68 private confirmService: ConfirmService,
69 private videoBlacklistService: VideoBlacklistService,
70 private serverService: ServerService,
71 private screenService: ScreenService,
72 private videoService: VideoService,
73 private blocklistService: BlocklistService,
74 private i18n: I18n
75 ) { }
76
77 get user () {
78 return this.authService.getUser()
79 }
80
743f023c
C
81 ngAfterViewInit () {
82 // We rely on mouseenter to lazy load actions
83 if (this.screenService.isInTouchScreen()) {
84 this.loadDropdownInformation()
85 }
86 }
87
3a0fb65c
C
88 ngOnChanges () {
89 this.buildActions()
90 }
91
92 isUserLoggedIn () {
93 return this.authService.isLoggedIn()
94 }
95
96 loadDropdownInformation () {
97 if (!this.isUserLoggedIn() || this.loaded === true) return
98
99 this.loaded = true
100
101 if (this.displayOptions.playlist) this.playlistAdd.load()
102 }
103
104 /* Show modals */
105
106 showDownloadModal () {
107 this.videoDownloadModal.show(this.video as VideoDetails)
108 }
109
110 showReportModal () {
111 this.videoReportModal.show()
112 }
113
114 showBlacklistModal () {
115 this.videoBlacklistModal.show()
116 }
117
118 /* Actions checker */
119
120 isVideoUpdatable () {
121 return this.video.isUpdatableBy(this.user)
122 }
123
124 isVideoRemovable () {
125 return this.video.isRemovableBy(this.user)
126 }
127
128 isVideoBlacklistable () {
129 return this.video.isBlackistableBy(this.user)
130 }
131
132 isVideoUnblacklistable () {
133 return this.video.isUnblacklistableBy(this.user)
134 }
135
72675ebe
C
136 isVideoDownloadable () {
137 return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled
138 }
139
3a0fb65c
C
140 /* Action handlers */
141
142 async unblacklistVideo () {
143 const confirmMessage = this.i18n(
144 'Do you really want to remove this video from the blacklist? It will be available again in the videos list.'
145 )
146
147 const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblacklist'))
148 if (res === false) return
149
150 this.videoBlacklistService.removeVideoFromBlacklist(this.video.id).subscribe(
151 () => {
152 this.notifier.success(this.i18n('Video {{name}} removed from the blacklist.', { name: this.video.name }))
153
154 this.video.blacklisted = false
155 this.video.blacklistedReason = null
156
157 this.videoUnblacklisted.emit()
158 },
159
160 err => this.notifier.error(err.message)
161 )
162 }
163
164 async removeVideo () {
165 const res = await this.confirmService.confirm(this.i18n('Do you really want to delete this video?'), this.i18n('Delete'))
166 if (res === false) return
167
168 this.videoService.removeVideo(this.video.id)
169 .subscribe(
170 () => {
171 this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }))
172
173 this.videoRemoved.emit()
174 },
175
176 error => this.notifier.error(error.message)
177 )
178 }
179
180 onVideoBlacklisted () {
181 this.videoBlacklisted.emit()
182 }
183
184 getPlaylistDropdownPlacement () {
185 if (this.screenService.isInSmallView()) {
186 return 'bottom-right'
187 }
188
189 return 'bottom-left bottom-right'
190 }
191
192 private buildActions () {
193 this.videoActions = []
194
195 if (this.authService.isLoggedIn()) {
196 this.videoActions.push([
197 {
198 label: this.i18n('Save to playlist'),
199 handler: () => this.playlistDropdown.toggle(),
200 isDisplayed: () => this.displayOptions.playlist,
201 iconName: 'playlist-add'
202 }
203 ])
204
205 this.videoActions.push([
206 {
207 label: this.i18n('Download'),
208 handler: () => this.showDownloadModal(),
72675ebe 209 isDisplayed: () => this.displayOptions.download && this.isVideoDownloadable(),
3a0fb65c
C
210 iconName: 'download'
211 },
212 {
213 label: this.i18n('Update'),
214 linkBuilder: ({ video }) => [ '/videos/update', video.uuid ],
215 iconName: 'edit',
216 isDisplayed: () => this.displayOptions.update && this.isVideoUpdatable()
217 },
218 {
219 label: this.i18n('Blacklist'),
220 handler: () => this.showBlacklistModal(),
221 iconName: 'no',
222 isDisplayed: () => this.displayOptions.blacklist && this.isVideoBlacklistable()
223 },
224 {
225 label: this.i18n('Unblacklist'),
226 handler: () => this.unblacklistVideo(),
227 iconName: 'undo',
228 isDisplayed: () => this.displayOptions.blacklist && this.isVideoUnblacklistable()
229 },
230 {
231 label: this.i18n('Delete'),
232 handler: () => this.removeVideo(),
233 isDisplayed: () => this.displayOptions.delete && this.isVideoRemovable(),
234 iconName: 'delete'
235 }
236 ])
237
238 this.videoActions.push([
239 {
240 label: this.i18n('Report'),
241 handler: () => this.showReportModal(),
242 isDisplayed: () => this.displayOptions.report,
243 iconName: 'alert'
244 }
245 ])
246 }
247 }
248}