import { finalize } from 'rxjs/operators'
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
import { AuthService, Notifier } from '@app/core'
-import { Video, VideoService } from '../../shared-main'
+import { FindInBulkService } from '@app/shared/shared-search'
+import { Video } from '../../shared-main'
import { MiniatureDisplayOptions } from '../../shared-video-miniature'
import { CustomMarkupComponent } from './shared'
@Component({
selector: 'my-video-miniature-markup',
templateUrl: 'video-miniature-markup.component.html',
- styleUrls: [ 'video-miniature-markup.component.scss' ]
+ styleUrls: [ 'video-miniature-markup.component.scss' ],
+ changeDetection: ChangeDetectionStrategy.OnPush
})
export class VideoMiniatureMarkupComponent implements CustomMarkupComponent, OnInit {
@Input() uuid: string
@Input() onlyDisplayTitle: boolean
+ @Input() video: Video
@Output() loaded = new EventEmitter<boolean>()
- video: Video
-
displayOptions: MiniatureDisplayOptions = {
date: true,
views: true,
constructor (
private auth: AuthService,
- private videoService: VideoService,
- private notifier: Notifier
+ private findInBulk: FindInBulkService,
+ private notifier: Notifier,
+ private cd: ChangeDetectorRef
) { }
getUser () {
}
}
- this.videoService.getVideo({ videoId: this.uuid })
+ if (this.video) return
+
+ this.findInBulk.getVideo(this.uuid)
.pipe(finalize(() => this.loaded.emit(true)))
- .subscribe(
- video => this.video = video,
+ .subscribe({
+ next: video => {
+ this.video = video
+ this.cd.markForCheck()
+ },
- err => this.notifier.error('Error in video miniature component: ' + err.message)
- )
+ error: err => this.notifier.error($localize`Error in video miniature component: ${err.message}`)
+ })
}
}