1 import { Component, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core'
2 import { AuthService, ConfirmService, Notifier, ScreenService } from '@app/core'
3 import { VideoBlockComponent, VideoBlockService, VideoReportComponent, BlocklistService } from '@app/shared/shared-moderation'
4 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
5 import { I18n } from '@ngx-translate/i18n-polyfill'
6 import { VideoCaption } from '@shared/models'
7 import { DropdownAction, DropdownButtonSize, DropdownDirection, RedundancyService, Video, VideoDetails, VideoService, Actor } from '../shared-main'
8 import { VideoAddToPlaylistComponent } from '../shared-video-playlist'
9 import { VideoDownloadComponent } from './video-download.component'
11 export type VideoActionsDisplayType = {
23 selector: 'my-video-actions-dropdown',
24 templateUrl: './video-actions-dropdown.component.html',
25 styleUrls: [ './video-actions-dropdown.component.scss' ]
27 export class VideoActionsDropdownComponent implements OnChanges {
28 @ViewChild('playlistDropdown') playlistDropdown: NgbDropdown
29 @ViewChild('playlistAdd') playlistAdd: VideoAddToPlaylistComponent
31 @ViewChild('videoDownloadModal') videoDownloadModal: VideoDownloadComponent
32 @ViewChild('videoReportModal') videoReportModal: VideoReportComponent
33 @ViewChild('videoBlockModal') videoBlockModal: VideoBlockComponent
35 @Input() video: Video | VideoDetails
36 @Input() videoCaptions: VideoCaption[] = []
38 @Input() displayOptions: VideoActionsDisplayType = {
48 @Input() placement = 'left'
50 @Input() label: string
52 @Input() buttonStyled = false
53 @Input() buttonSize: DropdownButtonSize = 'normal'
54 @Input() buttonDirection: DropdownDirection = 'vertical'
56 @Output() videoRemoved = new EventEmitter()
57 @Output() videoUnblocked = new EventEmitter()
58 @Output() videoBlocked = new EventEmitter()
59 @Output() videoAccountMuted = new EventEmitter()
60 @Output() modalOpened = new EventEmitter()
62 videoActions: DropdownAction<{ video: Video }>[][] = []
64 private loaded = false
67 private authService: AuthService,
68 private notifier: Notifier,
69 private confirmService: ConfirmService,
70 private blocklistService: BlocklistService,
71 private videoBlocklistService: VideoBlockService,
72 private screenService: ScreenService,
73 private videoService: VideoService,
74 private redundancyService: RedundancyService,
79 return this.authService.getUser()
85 this.playlistAdd.reload()
92 return this.authService.isLoggedIn()
95 loadDropdownInformation () {
96 if (!this.isUserLoggedIn() || this.loaded === true) return
100 if (this.displayOptions.playlist) this.playlistAdd.load()
105 showDownloadModal () {
106 this.modalOpened.emit()
108 this.videoDownloadModal.show(this.video as VideoDetails, this.videoCaptions)
112 this.modalOpened.emit()
114 this.videoReportModal.show()
118 this.modalOpened.emit()
120 this.videoBlockModal.show()
123 /* Actions checker */
125 isVideoUpdatable () {
126 return this.video.isUpdatableBy(this.user)
129 isVideoRemovable () {
130 return this.video.isRemovableBy(this.user)
133 isVideoBlockable () {
134 return this.video.isBlockableBy(this.user)
137 isVideoUnblockable () {
138 return this.video.isUnblockableBy(this.user)
141 isVideoDownloadable () {
142 return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled
145 canVideoBeDuplicated () {
146 return this.video.canBeDuplicatedBy(this.user)
149 isVideoAccountMutable () {
150 return this.video.account.id !== this.user.account.id
153 /* Action handlers */
155 async unblockVideo () {
156 const confirmMessage = this.i18n(
157 'Do you really want to unblock this video? It will be available again in the videos list.'
160 const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblock'))
161 if (res === false) return
163 this.videoBlocklistService.unblockVideo(this.video.id)
166 this.notifier.success(this.i18n('Video {{name}} unblocked.', { name: this.video.name }))
168 this.video.blacklisted = false
169 this.video.blockedReason = null
171 this.videoUnblocked.emit()
174 err => this.notifier.error(err.message)
178 async removeVideo () {
179 this.modalOpened.emit()
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
184 this.videoService.removeVideo(this.video.id)
187 this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }))
189 this.videoRemoved.emit()
192 error => this.notifier.error(error.message)
197 this.redundancyService.addVideoRedundancy(this.video)
200 const message = this.i18n('This video will be duplicated by your instance.')
201 this.notifier.success(message)
204 err => this.notifier.error(err.message)
208 muteVideoAccount () {
209 const params = { nameWithHost: Actor.CREATE_BY_STRING(this.video.account.name, this.video.account.host) }
211 this.blocklistService.blockAccountByUser(params)
214 this.notifier.success(this.i18n('Account {{nameWithHost}} muted.', params))
216 this.videoAccountMuted.emit()
219 err => this.notifier.error(err.message)
224 this.videoBlocked.emit()
227 getPlaylistDropdownPlacement () {
228 if (this.screenService.isInSmallView()) {
229 return 'bottom-right'
232 return 'bottom-left bottom-right'
235 private buildActions () {
236 this.videoActions = [
239 label: this.i18n('Save to playlist'),
240 handler: () => this.playlistDropdown.toggle(),
241 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.playlist,
242 iconName: 'playlist-add'
245 [ // actions regarding the video
247 label: this.i18n('Download'),
248 handler: () => this.showDownloadModal(),
249 isDisplayed: () => this.displayOptions.download && this.isVideoDownloadable(),
253 label: this.i18n('Update'),
254 linkBuilder: ({ video }) => [ '/videos/update', video.uuid ],
256 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.update && this.isVideoUpdatable()
259 label: this.i18n('Block'),
260 handler: () => this.showBlockModal(),
262 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoBlockable()
265 label: this.i18n('Unblock'),
266 handler: () => this.unblockVideo(),
268 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoUnblockable()
271 label: this.i18n('Mirror'),
272 handler: () => this.duplicateVideo(),
273 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.duplicate && this.canVideoBeDuplicated(),
274 iconName: 'cloud-download'
277 label: this.i18n('Delete'),
278 handler: () => this.removeVideo(),
279 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.delete && this.isVideoRemovable(),
283 label: this.i18n('Report'),
284 handler: () => this.showReportModal(),
285 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.report,
289 [ // actions regarding the account/its server
291 label: this.i18n('Mute account'),
292 handler: () => this.muteVideoAccount(),
293 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.mute && this.isVideoAccountMutable(),