-import { Component, Input, OnInit } from '@angular/core'
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core'
import { VideoPlaylistService } from '@app/shared/video-playlist/video-playlist.service'
import { AuthService, Notifier } from '@app/core'
import { forkJoin } from 'rxjs'
@Component({
selector: 'my-video-add-to-playlist',
styleUrls: [ './video-add-to-playlist.component.scss' ],
- templateUrl: './video-add-to-playlist.component.html'
+ templateUrl: './video-add-to-playlist.component.html',
+ changeDetection: ChangeDetectionStrategy.OnPush
})
-export class VideoAddToPlaylistComponent extends FormReactive implements OnInit {
+export class VideoAddToPlaylistComponent extends FormReactive implements OnInit, OnChanges {
@Input() video: Video
@Input() currentVideoTimestamp: number
+ @Input() lazyLoad = false
isNewPlaylistBlockOpened = false
videoPlaylists: PlaylistSummary[] = []
private notifier: Notifier,
private i18n: I18n,
private videoPlaylistService: VideoPlaylistService,
- private videoPlaylistValidatorsService: VideoPlaylistValidatorsService
+ private videoPlaylistValidatorsService: VideoPlaylistValidatorsService,
+ private cd: ChangeDetectorRef
) {
super()
}
}
ngOnInit () {
- this.resetOptions(true)
-
this.buildForm({
displayName: this.videoPlaylistValidatorsService.VIDEO_PLAYLIST_DISPLAY_NAME
})
+ }
+
+ ngOnChanges (simpleChanges: SimpleChanges) {
+ if (simpleChanges['video']) {
+ this.reload()
+ }
+ }
+
+ init () {
+ this.resetOptions(true)
+
+ if (this.lazyLoad !== true) this.load()
+ }
+
+ reload () {
+ this.videoPlaylists = []
+
+ this.init()
+ this.cd.markForCheck()
+ }
+
+ load () {
forkJoin([
this.videoPlaylistService.listAccountPlaylists(this.user.account, '-updatedAt'),
this.videoPlaylistService.doesVideoExistInPlaylist(this.video.id)
stopTimestamp: existingPlaylist ? existingPlaylist.stopTimestamp : undefined
})
}
+
+ this.cd.markForCheck()
}
)
}
playlist.inPlaylist = !playlist.inPlaylist
this.resetOptions()
+
+ this.cd.markForCheck()
}
createPlaylist () {
})
this.isNewPlaylistBlockOpened = false
+
+ this.cd.markForCheck()
},
err => this.notifier.error(err.message)
this.notifier.error(err.message)
playlist.inPlaylist = true
- }
+ },
+
+ () => this.cd.markForCheck()
)
}
this.notifier.error(err.message)
playlist.inPlaylist = false
- }
+ },
+
+ () => this.cd.markForCheck()
)
}
}