1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
import { Component, EventEmitter, Inject, Input, LOCALE_ID, OnChanges, Output } from '@angular/core'
import { MarkdownService, Notifier } from '@app/core'
import { VideoDetails, VideoService } from '@app/shared/shared-main'
@Component({
selector: 'my-video-description',
templateUrl: './video-description.component.html',
styleUrls: [ './video-description.component.scss' ]
})
export class VideoDescriptionComponent implements OnChanges {
@Input() video: VideoDetails
@Output() timestampClicked = new EventEmitter<number>()
descriptionLoading = false
completeDescriptionShown = false
completeVideoDescription: string
shortVideoDescription: string
videoHTMLDescription = ''
constructor (
private videoService: VideoService,
private notifier: Notifier,
private markdownService: MarkdownService,
@Inject(LOCALE_ID) private localeId: string
) { }
ngOnChanges () {
this.descriptionLoading = false
this.completeDescriptionShown = false
this.completeVideoDescription = undefined
this.setVideoDescriptionHTML()
}
showMoreDescription () {
if (this.completeVideoDescription === undefined) {
return this.loadCompleteDescription()
}
this.updateVideoDescription(this.completeVideoDescription)
this.completeDescriptionShown = true
}
showLessDescription () {
this.updateVideoDescription(this.shortVideoDescription)
this.completeDescriptionShown = false
}
loadCompleteDescription () {
this.descriptionLoading = true
this.videoService.loadCompleteDescription(this.video.descriptionPath)
.subscribe(
description => {
this.completeDescriptionShown = true
this.descriptionLoading = false
this.shortVideoDescription = this.video.description
this.completeVideoDescription = description
this.updateVideoDescription(this.completeVideoDescription)
},
error => {
this.descriptionLoading = false
this.notifier.error(error.message)
}
)
}
onTimestampClicked (timestamp: number) {
this.timestampClicked.emit(timestamp)
}
private updateVideoDescription (description: string) {
this.video.description = description
this.setVideoDescriptionHTML()
.catch(err => console.error(err))
}
private async setVideoDescriptionHTML () {
const html = await this.markdownService.textMarkdownToHTML(this.video.description)
this.videoHTMLDescription = this.markdownService.processVideoTimestamps(html)
}
}
|
