]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blame - client/src/app/shared/shared-video-miniature/video-actions-dropdown.component.ts
Fix issues with external links in search page
[github/Chocobozzz/PeerTube.git] / client / src / app / shared / shared-video-miniature / video-actions-dropdown.component.ts
CommitLineData
54e78847 1import { Component, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core'
67ed6552 2import { AuthService, ConfirmService, Notifier, ScreenService } from '@app/core'
d473fd94 3import { VideoBlockComponent, VideoBlockService, VideoReportComponent, BlocklistService } from '@app/shared/shared-moderation'
3a0fb65c 4import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
67ed6552 5import { I18n } from '@ngx-translate/i18n-polyfill'
8ba9c205 6import { VideoCaption } from '@shared/models'
d473fd94 7import { DropdownAction, DropdownButtonSize, DropdownDirection, RedundancyService, Video, VideoDetails, VideoService, Actor } from '../shared-main'
67ed6552
C
8import { VideoAddToPlaylistComponent } from '../shared-video-playlist'
9import { VideoDownloadComponent } from './video-download.component'
3a0fb65c
C
10
11export type VideoActionsDisplayType = {
12 playlist?: boolean
13 download?: boolean
14 update?: boolean
15 blacklist?: boolean
16 delete?: boolean
17 report?: boolean
b764380a 18 duplicate?: boolean
d473fd94 19 mute?: boolean
3a0fb65c
C
20}
21
22@Component({
23 selector: 'my-video-actions-dropdown',
24 templateUrl: './video-actions-dropdown.component.html',
25 styleUrls: [ './video-actions-dropdown.component.scss' ]
26})
4da22f64 27export class VideoActionsDropdownComponent implements OnChanges {
2f5d2ec5
C
28 @ViewChild('playlistDropdown') playlistDropdown: NgbDropdown
29 @ViewChild('playlistAdd') playlistAdd: VideoAddToPlaylistComponent
3a0fb65c 30
2f5d2ec5
C
31 @ViewChild('videoDownloadModal') videoDownloadModal: VideoDownloadComponent
32 @ViewChild('videoReportModal') videoReportModal: VideoReportComponent
5baee5fc 33 @ViewChild('videoBlockModal') videoBlockModal: VideoBlockComponent
3a0fb65c
C
34
35 @Input() video: Video | VideoDetails
8ba9c205 36 @Input() videoCaptions: VideoCaption[] = []
3a0fb65c
C
37
38 @Input() displayOptions: VideoActionsDisplayType = {
39 playlist: false,
40 download: true,
41 update: true,
42 blacklist: true,
43 delete: true,
b764380a 44 report: true,
d473fd94
RK
45 duplicate: true,
46 mute: true
3a0fb65c 47 }
8dfceec4 48 @Input() placement = 'left'
3a0fb65c
C
49
50 @Input() label: string
51
52 @Input() buttonStyled = false
53 @Input() buttonSize: DropdownButtonSize = 'normal'
54 @Input() buttonDirection: DropdownDirection = 'vertical'
55
56 @Output() videoRemoved = new EventEmitter()
5baee5fc
RK
57 @Output() videoUnblocked = new EventEmitter()
58 @Output() videoBlocked = new EventEmitter()
d473fd94 59 @Output() videoAccountMuted = new EventEmitter()
689a4f69 60 @Output() modalOpened = new EventEmitter()
3a0fb65c
C
61
62 videoActions: DropdownAction<{ video: Video }>[][] = []
63
64 private loaded = false
65
66 constructor (
67 private authService: AuthService,
68 private notifier: Notifier,
69 private confirmService: ConfirmService,
d473fd94 70 private blocklistService: BlocklistService,
5baee5fc 71 private videoBlocklistService: VideoBlockService,
3a0fb65c
C
72 private screenService: ScreenService,
73 private videoService: VideoService,
b764380a 74 private redundancyService: RedundancyService,
3a0fb65c
C
75 private i18n: I18n
76 ) { }
77
78 get user () {
79 return this.authService.getUser()
80 }
81
82 ngOnChanges () {
1c8ddbfa
C
83 if (this.loaded) {
84 this.loaded = false
78d60e63 85 this.playlistAdd.reload()
1c8ddbfa
C
86 }
87
3a0fb65c
C
88 this.buildActions()
89 }
90
91 isUserLoggedIn () {
92 return this.authService.isLoggedIn()
93 }
94
95 loadDropdownInformation () {
96 if (!this.isUserLoggedIn() || this.loaded === true) return
97
98 this.loaded = true
99
100 if (this.displayOptions.playlist) this.playlistAdd.load()
101 }
102
103 /* Show modals */
104
105 showDownloadModal () {
689a4f69
C
106 this.modalOpened.emit()
107
8ba9c205 108 this.videoDownloadModal.show(this.video as VideoDetails, this.videoCaptions)
3a0fb65c
C
109 }
110
111 showReportModal () {
689a4f69
C
112 this.modalOpened.emit()
113
3a0fb65c
C
114 this.videoReportModal.show()
115 }
116
5baee5fc 117 showBlockModal () {
689a4f69
C
118 this.modalOpened.emit()
119
5baee5fc 120 this.videoBlockModal.show()
3a0fb65c
C
121 }
122
123 /* Actions checker */
124
125 isVideoUpdatable () {
126 return this.video.isUpdatableBy(this.user)
127 }
128
129 isVideoRemovable () {
130 return this.video.isRemovableBy(this.user)
131 }
132
5baee5fc
RK
133 isVideoBlockable () {
134 return this.video.isBlockableBy(this.user)
3a0fb65c
C
135 }
136
5baee5fc
RK
137 isVideoUnblockable () {
138 return this.video.isUnblockableBy(this.user)
3a0fb65c
C
139 }
140
72675ebe
C
141 isVideoDownloadable () {
142 return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled
143 }
144
b764380a
C
145 canVideoBeDuplicated () {
146 return this.video.canBeDuplicatedBy(this.user)
147 }
148
d473fd94
RK
149 isVideoAccountMutable () {
150 return this.video.account.id !== this.user.account.id
151 }
152
3a0fb65c
C
153 /* Action handlers */
154
5baee5fc 155 async unblockVideo () {
3a0fb65c 156 const confirmMessage = this.i18n(
5baee5fc 157 'Do you really want to unblock this video? It will be available again in the videos list.'
3a0fb65c
C
158 )
159
5baee5fc 160 const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblock'))
3a0fb65c
C
161 if (res === false) return
162
d473fd94
RK
163 this.videoBlocklistService.unblockVideo(this.video.id)
164 .subscribe(
165 () => {
166 this.notifier.success(this.i18n('Video {{name}} unblocked.', { name: this.video.name }))
3a0fb65c 167
d473fd94
RK
168 this.video.blacklisted = false
169 this.video.blockedReason = null
3a0fb65c 170
d473fd94
RK
171 this.videoUnblocked.emit()
172 },
3a0fb65c 173
d473fd94
RK
174 err => this.notifier.error(err.message)
175 )
3a0fb65c
C
176 }
177
178 async removeVideo () {
689a4f69
C
179 this.modalOpened.emit()
180
3a0fb65c
C
181 const res = await this.confirmService.confirm(this.i18n('Do you really want to delete this video?'), this.i18n('Delete'))
182 if (res === false) return
183
184 this.videoService.removeVideo(this.video.id)
185 .subscribe(
186 () => {
187 this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }))
188
189 this.videoRemoved.emit()
190 },
191
192 error => this.notifier.error(error.message)
193 )
194 }
195
b764380a
C
196 duplicateVideo () {
197 this.redundancyService.addVideoRedundancy(this.video)
d473fd94
RK
198 .subscribe(
199 () => {
200 const message = this.i18n('This video will be duplicated by your instance.')
201 this.notifier.success(message)
202 },
b764380a 203
d473fd94
RK
204 err => this.notifier.error(err.message)
205 )
206 }
207
208 muteVideoAccount () {
209 const params = { nameWithHost: Actor.CREATE_BY_STRING(this.video.account.name, this.video.account.host) }
210
211 this.blocklistService.blockAccountByUser(params)
212 .subscribe(
213 () => {
214 this.notifier.success(this.i18n('Account {{nameWithHost}} muted.', params))
215
216 this.videoAccountMuted.emit()
217 },
218
219 err => this.notifier.error(err.message)
220 )
b764380a
C
221 }
222
5baee5fc
RK
223 onVideoBlocked () {
224 this.videoBlocked.emit()
3a0fb65c
C
225 }
226
227 getPlaylistDropdownPlacement () {
228 if (this.screenService.isInSmallView()) {
229 return 'bottom-right'
230 }
231
232 return 'bottom-left bottom-right'
233 }
234
235 private buildActions () {
f238aec5
C
236 this.videoActions = [
237 [
3a0fb65c
C
238 {
239 label: this.i18n('Save to playlist'),
240 handler: () => this.playlistDropdown.toggle(),
f238aec5 241 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.playlist,
3a0fb65c
C
242 iconName: 'playlist-add'
243 }
f238aec5 244 ],
d473fd94 245 [ // actions regarding the video
3a0fb65c
C
246 {
247 label: this.i18n('Download'),
248 handler: () => this.showDownloadModal(),
72675ebe 249 isDisplayed: () => this.displayOptions.download && this.isVideoDownloadable(),
3a0fb65c
C
250 iconName: 'download'
251 },
252 {
253 label: this.i18n('Update'),
254 linkBuilder: ({ video }) => [ '/videos/update', video.uuid ],
255 iconName: 'edit',
f238aec5 256 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.update && this.isVideoUpdatable()
3a0fb65c
C
257 },
258 {
5baee5fc
RK
259 label: this.i18n('Block'),
260 handler: () => this.showBlockModal(),
3a0fb65c 261 iconName: 'no',
5baee5fc 262 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoBlockable()
3a0fb65c
C
263 },
264 {
5baee5fc
RK
265 label: this.i18n('Unblock'),
266 handler: () => this.unblockVideo(),
3a0fb65c 267 iconName: 'undo',
5baee5fc 268 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoUnblockable()
3a0fb65c 269 },
b764380a 270 {
988af781 271 label: this.i18n('Mirror'),
b764380a
C
272 handler: () => this.duplicateVideo(),
273 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.duplicate && this.canVideoBeDuplicated(),
274 iconName: 'cloud-download'
275 },
3a0fb65c
C
276 {
277 label: this.i18n('Delete'),
278 handler: () => this.removeVideo(),
f238aec5 279 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.delete && this.isVideoRemovable(),
3a0fb65c 280 iconName: 'delete'
d473fd94 281 },
3a0fb65c
C
282 {
283 label: this.i18n('Report'),
284 handler: () => this.showReportModal(),
f238aec5 285 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.report,
c41c0e28 286 iconName: 'flag'
3a0fb65c 287 }
d473fd94
RK
288 ],
289 [ // actions regarding the account/its server
290 {
291 label: this.i18n('Mute account'),
292 handler: () => this.muteVideoAccount(),
293 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.mute && this.isVideoAccountMutable(),
294 iconName: 'no'
295 }
f238aec5
C
296 ]
297 ]
3a0fb65c
C
298 }
299}