aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-06-18 11:19:10 +0200
committerChocobozzz <me@florianbigard.com>2018-06-18 11:19:10 +0200
commit53055a1124cbc2eaeeeeef21b19b0b46e96f23c5 (patch)
treed761c9928d2568937fad9a2316f7ad2b8b223f07
parent4d089429fe91ab7793b9b05010acb483d61345de (diff)
downloadPeerTube-53055a1124cbc2eaeeeeef21b19b0b46e96f23c5.tar.gz
PeerTube-53055a1124cbc2eaeeeeef21b19b0b46e96f23c5.tar.zst
PeerTube-53055a1124cbc2eaeeeeef21b19b0b46e96f23c5.zip
Handle markdown in account/video channel pages
-rw-r--r--client/src/app/+accounts/account-about/account-about.component.html2
-rw-r--r--client/src/app/+accounts/account-about/account-about.component.ts12
-rw-r--r--client/src/app/+video-channels/video-channel-about/video-channel-about.component.html6
-rw-r--r--client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts15
-rw-r--r--client/src/app/videos/+video-watch/modal/video-support.component.ts6
-rw-r--r--client/src/app/videos/+video-watch/video-watch.component.ts5
-rw-r--r--client/src/app/videos/shared/markdown.service.ts6
7 files changed, 30 insertions, 22 deletions
diff --git a/client/src/app/+accounts/account-about/account-about.component.html b/client/src/app/+accounts/account-about/account-about.component.html
index b178f5cc8..f857e5a52 100644
--- a/client/src/app/+accounts/account-about/account-about.component.html
+++ b/client/src/app/+accounts/account-about/account-about.component.html
@@ -1,7 +1,7 @@
1<div *ngIf="account" class="row"> 1<div *ngIf="account" class="row">
2 <div class="block col-md-6 col-sm-12"> 2 <div class="block col-md-6 col-sm-12">
3 <div i18n class="small-title">Description</div> 3 <div i18n class="small-title">Description</div>
4 <div class="content">{{ getAccountDescription() }}</div> 4 <div class="content" [innerHtml]="getAccountDescription()"></div>
5 </div> 5 </div>
6 6
7 <div class="block col-md-6 col-sm-12"> 7 <div class="block col-md-6 col-sm-12">
diff --git a/client/src/app/+accounts/account-about/account-about.component.ts b/client/src/app/+accounts/account-about/account-about.component.ts
index c0e793754..2acf67a59 100644
--- a/client/src/app/+accounts/account-about/account-about.component.ts
+++ b/client/src/app/+accounts/account-about/account-about.component.ts
@@ -4,6 +4,7 @@ import { Account } from '@app/shared/account/account.model'
4import { AccountService } from '@app/shared/account/account.service' 4import { AccountService } from '@app/shared/account/account.service'
5import { I18n } from '@ngx-translate/i18n-polyfill' 5import { I18n } from '@ngx-translate/i18n-polyfill'
6import { Subscription } from 'rxjs' 6import { Subscription } from 'rxjs'
7import { MarkdownService } from '@app/videos/shared'
7 8
8@Component({ 9@Component({
9 selector: 'my-account-about', 10 selector: 'my-account-about',
@@ -12,19 +13,24 @@ import { Subscription } from 'rxjs'
12}) 13})
13export class AccountAboutComponent implements OnInit, OnDestroy { 14export class AccountAboutComponent implements OnInit, OnDestroy {
14 account: Account 15 account: Account
16 descriptionHTML = ''
15 17
16 private accountSub: Subscription 18 private accountSub: Subscription
17 19
18 constructor ( 20 constructor (
19 private route: ActivatedRoute, 21 private route: ActivatedRoute,
20 private i18n: I18n, 22 private i18n: I18n,
21 private accountService: AccountService 23 private accountService: AccountService,
24 private markdownService: MarkdownService
22 ) { } 25 ) { }
23 26
24 ngOnInit () { 27 ngOnInit () {
25 // Parent get the account for us 28 // Parent get the account for us
26 this.accountSub = this.accountService.accountLoaded 29 this.accountSub = this.accountService.accountLoaded
27 .subscribe(account => this.account = account) 30 .subscribe(account => {
31 this.account = account
32 this.descriptionHTML = this.markdownService.textMarkdownToHTML(this.account.description)
33 })
28 } 34 }
29 35
30 ngOnDestroy () { 36 ngOnDestroy () {
@@ -32,7 +38,7 @@ export class AccountAboutComponent implements OnInit, OnDestroy {
32 } 38 }
33 39
34 getAccountDescription () { 40 getAccountDescription () {
35 if (this.account.description) return this.account.description 41 if (this.descriptionHTML) return this.descriptionHTML
36 42
37 return this.i18n('No description') 43 return this.i18n('No description')
38 } 44 }
diff --git a/client/src/app/+video-channels/video-channel-about/video-channel-about.component.html b/client/src/app/+video-channels/video-channel-about/video-channel-about.component.html
index b7125ff71..9655668d7 100644
--- a/client/src/app/+video-channels/video-channel-about/video-channel-about.component.html
+++ b/client/src/app/+video-channels/video-channel-about/video-channel-about.component.html
@@ -2,12 +2,12 @@
2 <div class="description col-md-6 col-sm-12"> 2 <div class="description col-md-6 col-sm-12">
3 <div class="block"> 3 <div class="block">
4 <div i18n class="small-title">Description</div> 4 <div i18n class="small-title">Description</div>
5 <div class="content">{{ getVideoChannelDescription() }}</div> 5 <div class="content" [innerHtml]="getVideoChannelDescription()"></div>
6 </div> 6 </div>
7 7
8 <div class="block" *ngIf="videoChannel.support"> 8 <div class="block" *ngIf="supportHTML">
9 <div i18n class="small-title">Support this channel</div> 9 <div i18n class="small-title">Support this channel</div>
10 <div class="content">{{ videoChannel.support }}</div> 10 <div class="content" [innerHtml]="supportHTML"></div>
11 </div> 11 </div>
12 </div> 12 </div>
13 13
diff --git a/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts b/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts
index dc0893962..901c91de9 100644
--- a/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts
+++ b/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts
@@ -4,6 +4,7 @@ import { VideoChannelService } from '@app/shared/video-channel/video-channel.ser
4import { VideoChannel } from '@app/shared/video-channel/video-channel.model' 4import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
5import { I18n } from '@ngx-translate/i18n-polyfill' 5import { I18n } from '@ngx-translate/i18n-polyfill'
6import { Subscription } from 'rxjs' 6import { Subscription } from 'rxjs'
7import { MarkdownService } from '@app/videos/shared'
7 8
8@Component({ 9@Component({
9 selector: 'my-video-channel-about', 10 selector: 'my-video-channel-about',
@@ -12,19 +13,27 @@ import { Subscription } from 'rxjs'
12}) 13})
13export class VideoChannelAboutComponent implements OnInit, OnDestroy { 14export class VideoChannelAboutComponent implements OnInit, OnDestroy {
14 videoChannel: VideoChannel 15 videoChannel: VideoChannel
16 descriptionHTML = ''
17 supportHTML = ''
15 18
16 private videoChannelSub: Subscription 19 private videoChannelSub: Subscription
17 20
18 constructor ( 21 constructor (
19 private route: ActivatedRoute, 22 private route: ActivatedRoute,
20 private i18n: I18n, 23 private i18n: I18n,
21 private videoChannelService: VideoChannelService 24 private videoChannelService: VideoChannelService,
25 private markdownService: MarkdownService
22 ) { } 26 ) { }
23 27
24 ngOnInit () { 28 ngOnInit () {
25 // Parent get the video channel for us 29 // Parent get the video channel for us
26 this.videoChannelSub = this.videoChannelService.videoChannelLoaded 30 this.videoChannelSub = this.videoChannelService.videoChannelLoaded
27 .subscribe(videoChannel => this.videoChannel = videoChannel) 31 .subscribe(videoChannel => {
32 this.videoChannel = videoChannel
33
34 this.descriptionHTML = this.markdownService.textMarkdownToHTML(this.videoChannel.description)
35 this.supportHTML = this.markdownService.enhancedMarkdownToHTML(this.videoChannel.support)
36 })
28 } 37 }
29 38
30 ngOnDestroy () { 39 ngOnDestroy () {
@@ -32,7 +41,7 @@ export class VideoChannelAboutComponent implements OnInit, OnDestroy {
32 } 41 }
33 42
34 getVideoChannelDescription () { 43 getVideoChannelDescription () {
35 if (this.videoChannel.description) return this.videoChannel.description 44 if (this.descriptionHTML) return this.descriptionHTML
36 45
37 return this.i18n('No description') 46 return this.i18n('No description')
38 } 47 }
diff --git a/client/src/app/videos/+video-watch/modal/video-support.component.ts b/client/src/app/videos/+video-watch/modal/video-support.component.ts
index f805215b9..c515298a0 100644
--- a/client/src/app/videos/+video-watch/modal/video-support.component.ts
+++ b/client/src/app/videos/+video-watch/modal/video-support.component.ts
@@ -23,11 +23,7 @@ export class VideoSupportComponent {
23 show () { 23 show () {
24 this.modal.show() 24 this.modal.show()
25 25
26 if (this.video.support) { 26 this.videoHTMLSupport = this.markdownService.enhancedMarkdownToHTML(this.video.support)
27 this.videoHTMLSupport = this.markdownService.enhancedMarkdownToHTML(this.video.support)
28 } else {
29 this.videoHTMLSupport = ''
30 }
31 } 27 }
32 28
33 hide () { 29 hide () {
diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts
index 6f6bd4e5d..8adf97d48 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -290,11 +290,6 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
290 } 290 }
291 291
292 private setVideoDescriptionHTML () { 292 private setVideoDescriptionHTML () {
293 if (!this.video.description) {
294 this.videoHTMLDescription = ''
295 return
296 }
297
298 this.videoHTMLDescription = this.markdownService.textMarkdownToHTML(this.video.description) 293 this.videoHTMLDescription = this.markdownService.textMarkdownToHTML(this.video.description)
299 } 294 }
300 295
diff --git a/client/src/app/videos/shared/markdown.service.ts b/client/src/app/videos/shared/markdown.service.ts
index 681140087..14eeba777 100644
--- a/client/src/app/videos/shared/markdown.service.ts
+++ b/client/src/app/videos/shared/markdown.service.ts
@@ -23,14 +23,16 @@ export class MarkdownService {
23 } 23 }
24 24
25 textMarkdownToHTML (markdown: string) { 25 textMarkdownToHTML (markdown: string) {
26 const html = this.textMarkdownIt.render(markdown) 26 if (!markdown) return ''
27 27
28 const html = this.textMarkdownIt.render(markdown)
28 return this.avoidTruncatedLinks(html) 29 return this.avoidTruncatedLinks(html)
29 } 30 }
30 31
31 enhancedMarkdownToHTML (markdown: string) { 32 enhancedMarkdownToHTML (markdown: string) {
32 const html = this.enhancedMarkdownIt.render(markdown) 33 if (!markdown) return ''
33 34
35 const html = this.enhancedMarkdownIt.render(markdown)
34 return this.avoidTruncatedLinks(html) 36 return this.avoidTruncatedLinks(html)
35 } 37 }
36 38