1 import { Component, EventEmitter, Input, OnChanges, Output, ViewChild } from '@angular/core'
2 import { I18n } from '@ngx-translate/i18n-polyfill'
3 import { DropdownAction, DropdownButtonSize, DropdownDirection } from '@app/shared/buttons/action-dropdown.component'
4 import { AuthService, ConfirmService, Notifier } from '@app/core'
5 import { Video } from '@app/shared/video/video.model'
6 import { VideoService } from '@app/shared/video/video.service'
7 import { VideoDetails } from '@app/shared/video/video-details.model'
8 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
9 import { VideoAddToPlaylistComponent } from '@app/shared/video-playlist/video-add-to-playlist.component'
10 import { VideoDownloadComponent } from '@app/shared/video/modals/video-download.component'
11 import { VideoReportComponent } from '@app/shared/video/modals/video-report.component'
12 import { VideoBlockComponent } from '@app/shared/video/modals/video-block.component'
13 import { VideoBlockService } from '@app/shared/video-block'
14 import { ScreenService } from '@app/shared/misc/screen.service'
15 import { VideoCaption } from '@shared/models'
16 import { RedundancyService } from '@app/shared/video/redundancy.service'
18 export type VideoActionsDisplayType = {
29 selector: 'my-video-actions-dropdown',
30 templateUrl: './video-actions-dropdown.component.html',
31 styleUrls: [ './video-actions-dropdown.component.scss' ]
33 export class VideoActionsDropdownComponent implements OnChanges {
34 @ViewChild('playlistDropdown') playlistDropdown: NgbDropdown
35 @ViewChild('playlistAdd') playlistAdd: VideoAddToPlaylistComponent
37 @ViewChild('videoDownloadModal') videoDownloadModal: VideoDownloadComponent
38 @ViewChild('videoReportModal') videoReportModal: VideoReportComponent
39 @ViewChild('videoBlockModal') videoBlockModal: VideoBlockComponent
41 @Input() video: Video | VideoDetails
42 @Input() videoCaptions: VideoCaption[] = []
44 @Input() displayOptions: VideoActionsDisplayType = {
53 @Input() placement = 'left'
55 @Input() label: string
57 @Input() buttonStyled = false
58 @Input() buttonSize: DropdownButtonSize = 'normal'
59 @Input() buttonDirection: DropdownDirection = 'vertical'
61 @Output() videoRemoved = new EventEmitter()
62 @Output() videoUnblocked = new EventEmitter()
63 @Output() videoBlocked = new EventEmitter()
64 @Output() modalOpened = new EventEmitter()
66 videoActions: DropdownAction<{ video: Video }>[][] = []
68 private loaded = false
71 private authService: AuthService,
72 private notifier: Notifier,
73 private confirmService: ConfirmService,
74 private videoBlocklistService: VideoBlockService,
75 private screenService: ScreenService,
76 private videoService: VideoService,
77 private redundancyService: RedundancyService,
82 return this.authService.getUser()
88 this.playlistAdd.reload()
95 return this.authService.isLoggedIn()
98 loadDropdownInformation () {
99 if (!this.isUserLoggedIn() || this.loaded === true) return
103 if (this.displayOptions.playlist) this.playlistAdd.load()
108 showDownloadModal () {
109 this.modalOpened.emit()
111 this.videoDownloadModal.show(this.video as VideoDetails, this.videoCaptions)
115 this.modalOpened.emit()
117 this.videoReportModal.show()
121 this.modalOpened.emit()
123 this.videoBlockModal.show()
126 /* Actions checker */
128 isVideoUpdatable () {
129 return this.video.isUpdatableBy(this.user)
132 isVideoRemovable () {
133 return this.video.isRemovableBy(this.user)
136 isVideoBlockable () {
137 return this.video.isBlockableBy(this.user)
140 isVideoUnblockable () {
141 return this.video.isUnblockableBy(this.user)
144 isVideoDownloadable () {
145 return this.video && this.video instanceof VideoDetails && this.video.downloadEnabled
148 canVideoBeDuplicated () {
149 return this.video.canBeDuplicatedBy(this.user)
152 /* Action handlers */
154 async unblockVideo () {
155 const confirmMessage = this.i18n(
156 'Do you really want to unblock this video? It will be available again in the videos list.'
159 const res = await this.confirmService.confirm(confirmMessage, this.i18n('Unblock'))
160 if (res === false) return
162 this.videoBlocklistService.unblockVideo(this.video.id).subscribe(
164 this.notifier.success(this.i18n('Video {{name}} unblocked.', { name: this.video.name }))
166 this.video.blacklisted = false
167 this.video.blockedReason = null
169 this.videoUnblocked.emit()
172 err => this.notifier.error(err.message)
176 async removeVideo () {
177 this.modalOpened.emit()
179 const res = await this.confirmService.confirm(this.i18n('Do you really want to delete this video?'), this.i18n('Delete'))
180 if (res === false) return
182 this.videoService.removeVideo(this.video.id)
185 this.notifier.success(this.i18n('Video {{videoName}} deleted.', { videoName: this.video.name }))
187 this.videoRemoved.emit()
190 error => this.notifier.error(error.message)
195 this.redundancyService.addVideoRedundancy(this.video)
198 const message = this.i18n('This video will be duplicated by your instance.')
199 this.notifier.success(message)
202 err => this.notifier.error(err.message)
207 this.videoBlocked.emit()
210 getPlaylistDropdownPlacement () {
211 if (this.screenService.isInSmallView()) {
212 return 'bottom-right'
215 return 'bottom-left bottom-right'
218 private buildActions () {
219 this.videoActions = [
222 label: this.i18n('Save to playlist'),
223 handler: () => this.playlistDropdown.toggle(),
224 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.playlist,
225 iconName: 'playlist-add'
230 label: this.i18n('Download'),
231 handler: () => this.showDownloadModal(),
232 isDisplayed: () => this.displayOptions.download && this.isVideoDownloadable(),
236 label: this.i18n('Update'),
237 linkBuilder: ({ video }) => [ '/videos/update', video.uuid ],
239 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.update && this.isVideoUpdatable()
242 label: this.i18n('Block'),
243 handler: () => this.showBlockModal(),
245 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoBlockable()
248 label: this.i18n('Unblock'),
249 handler: () => this.unblockVideo(),
251 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.blacklist && this.isVideoUnblockable()
254 label: this.i18n('Mirror'),
255 handler: () => this.duplicateVideo(),
256 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.duplicate && this.canVideoBeDuplicated(),
257 iconName: 'cloud-download'
260 label: this.i18n('Delete'),
261 handler: () => this.removeVideo(),
262 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.delete && this.isVideoRemovable(),
268 label: this.i18n('Report'),
269 handler: () => this.showReportModal(),
270 isDisplayed: () => this.authService.isLoggedIn() && this.displayOptions.report,