client/src/app/shared/video/video-miniature.component.ts

   1 import { ChangeDetectionStrategy, Component, EventEmitter, Inject, Input, LOCALE_ID, OnInit, Output } from '@angular/core'
   2 import { User } from '../users'
   3 import { Video } from './video.model'
   4 import { ServerService } from '@app/core'
   5 import { VideoPrivacy, VideoState } from '../../../../../shared'
   6 import { I18n } from '@ngx-translate/i18n-polyfill'
   7 import { VideoActionsDisplayType } from '@app/shared/video/video-actions-dropdown.component'
   8 import { ScreenService } from '@app/shared/misc/screen.service'
   9
  10 export type OwnerDisplayType = 'account' | 'videoChannel' | 'auto'
  11 export type MiniatureDisplayOptions = {
  12   date?: boolean
  13   views?: boolean
  14   by?: boolean
  15   privacyLabel?: boolean
  16   privacyText?: boolean
  17   state?: boolean
  18   blacklistInfo?: boolean
  19   nsfw?: boolean
  20 }
  21
  22 @Component({
  23   selector: 'my-video-miniature',
  24   styleUrls: [ './video-miniature.component.scss' ],
  25   templateUrl: './video-miniature.component.html',
  26   changeDetection: ChangeDetectionStrategy.OnPush
  27 })
  28 export class VideoMiniatureComponent implements OnInit {
  29   @Input() user: User
  30   @Input() video: Video
  31
  32   @Input() ownerDisplayType: OwnerDisplayType = 'account'
  33   @Input() displayOptions: MiniatureDisplayOptions = {
  34     date: true,
  35     views: true,
  36     by: true,
  37     privacyLabel: false,
  38     privacyText: false,
  39     state: false,
  40     blacklistInfo: false
  41   }
  42   @Input() displayAsRow = false
  43   @Input() displayVideoActions = true
  44
  45   @Output() videoBlacklisted = new EventEmitter()
  46   @Output() videoUnblacklisted = new EventEmitter()
  47   @Output() videoRemoved = new EventEmitter()
  48
  49   videoActionsDisplayOptions: VideoActionsDisplayType = {
  50     playlist: true,
  51     download: false,
  52     update: true,
  53     blacklist: true,
  54     delete: true,
  55     report: true
  56   }
  57   showActions = false
  58
  59   private ownerDisplayTypeChosen: 'account' | 'videoChannel'
  60
  61   constructor (
  62     private screenService: ScreenService,
  63     private serverService: ServerService,
  64     private i18n: I18n,
  65     @Inject(LOCALE_ID) private localeId: string
  66   ) { }
  67
  68   get isVideoBlur () {
  69     return this.video.isVideoNSFWForUser(this.user, this.serverService.getConfig())
  70   }
  71
  72   ngOnInit () {
  73     this.setUpBy()
  74
  75     // We rely on mouseenter to lazy load actions
  76     if (this.screenService.isInTouchScreen()) {
  77       this.loadActions()
  78     }
  79   }
  80
  81   displayOwnerAccount () {
  82     return this.ownerDisplayTypeChosen === 'account'
  83   }
  84
  85   displayOwnerVideoChannel () {
  86     return this.ownerDisplayTypeChosen === 'videoChannel'
  87   }
  88
  89   isUnlistedVideo () {
  90     return this.video.privacy.id === VideoPrivacy.UNLISTED
  91   }
  92
  93   isPrivateVideo () {
  94     return this.video.privacy.id === VideoPrivacy.PRIVATE
  95   }
  96
  97   getStateLabel (video: Video) {
  98     if (!video.state) return ''
  99
 100     if (video.privacy.id !== VideoPrivacy.PRIVATE && video.state.id === VideoState.PUBLISHED) {
 101       return this.i18n('Published')
 102     }
 103
 104     if (video.scheduledUpdate) {
 105       const updateAt = new Date(video.scheduledUpdate.updateAt.toString()).toLocaleString(this.localeId)
 106       return this.i18n('Publication scheduled on ') + updateAt
 107     }
 108
 109     if (video.state.id === VideoState.TO_TRANSCODE && video.waitTranscoding === true) {
 110       return this.i18n('Waiting transcoding')
 111     }
 112
 113     if (video.state.id === VideoState.TO_TRANSCODE) {
 114       return this.i18n('To transcode')
 115     }
 116
 117     if (video.state.id === VideoState.TO_IMPORT) {
 118       return this.i18n('To import')
 119     }
 120
 121     return ''
 122   }
 123
 124   loadActions () {
 125     if (this.displayVideoActions) this.showActions = true
 126   }
 127
 128   onVideoBlacklisted () {
 129     this.videoBlacklisted.emit()
 130   }
 131
 132   onVideoUnblacklisted () {
 133     this.videoUnblacklisted.emit()
 134   }
 135
 136   onVideoRemoved () {
 137     this.videoRemoved.emit()
 138   }
 139
 140   private setUpBy () {
 141     if (this.ownerDisplayType === 'account' || this.ownerDisplayType === 'videoChannel') {
 142       this.ownerDisplayTypeChosen = this.ownerDisplayType
 143       return
 144     }
 145
 146     // If the video channel name an UUID (not really displayable, we changed this behaviour in v1.0.0-beta.12)
 147     // -> Use the account name
 148     if (
 149       this.video.channel.name === `${this.video.account.name}_channel` ||
 150       this.video.channel.name.match(/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/)
 151     ) {
 152       this.ownerDisplayTypeChosen = 'account'
 153     } else {
 154       this.ownerDisplayTypeChosen = 'videoChannel'
 155     }
 156   }
 157 }