]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blobdiff - client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts
Federate entire description
[github/Chocobozzz/PeerTube.git] / client / src / app / +videos / +video-watch / shared / metadata / video-description.component.ts
index 23d00d31a09d7268473b683a38b6f8e5c761379e..d0108061103bee479febf21812dd1308796ab53f 100644 (file)
@@ -1,6 +1,7 @@
 import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core'
 import { MarkdownService, Notifier } from '@app/core'
 import { VideoDetails, VideoService } from '@app/shared/shared-main'
+import { logger } from '@root-helpers/logger'
 
 @Component({
   selector: 'my-video-description',
@@ -14,8 +15,10 @@ export class VideoDescriptionComponent implements OnChanges {
 
   descriptionLoading = false
   completeDescriptionShown = false
-  completeVideoDescription: string
-  shortVideoDescription: string
+
+  completeVideoDescriptionLoaded = false
+
+  videoHTMLTruncatedDescription = ''
   videoHTMLDescription = ''
 
   constructor (
@@ -27,22 +30,19 @@ export class VideoDescriptionComponent implements OnChanges {
   ngOnChanges () {
     this.descriptionLoading = false
     this.completeDescriptionShown = false
-    this.completeVideoDescription = undefined
 
     this.setVideoDescriptionHTML()
   }
 
   showMoreDescription () {
-    if (this.completeVideoDescription === undefined) {
+    if (!this.completeVideoDescriptionLoaded) {
       return this.loadCompleteDescription()
     }
 
-    this.updateVideoDescription(this.completeVideoDescription)
     this.completeDescriptionShown = true
   }
 
   showLessDescription () {
-    this.updateVideoDescription(this.shortVideoDescription)
     this.completeDescriptionShown = false
   }
 
@@ -50,36 +50,47 @@ export class VideoDescriptionComponent implements OnChanges {
     this.descriptionLoading = true
 
     this.videoService.loadCompleteDescription(this.video.descriptionPath)
-        .subscribe(
-          description => {
+        .subscribe({
+          next: description => {
             this.completeDescriptionShown = true
             this.descriptionLoading = false
 
-            this.shortVideoDescription = this.video.description
-            this.completeVideoDescription = description
+            this.video.description = description
 
-            this.updateVideoDescription(this.completeVideoDescription)
+            this.setVideoDescriptionHTML()
+              .catch(err => logger.error(err))
           },
 
-          error => {
+          error: err => {
             this.descriptionLoading = false
-            this.notifier.error(error.message)
+            this.notifier.error(err.message)
           }
-        )
+        })
   }
 
   onTimestampClicked (timestamp: number) {
     this.timestampClicked.emit(timestamp)
   }
 
-  private updateVideoDescription (description: string) {
-    this.video.description = description
-    this.setVideoDescriptionHTML()
-      .catch(err => console.error(err))
+  getHTMLDescription () {
+    if (this.completeDescriptionShown) {
+      return this.videoHTMLDescription
+    }
+
+    return this.videoHTMLTruncatedDescription
   }
 
   private async setVideoDescriptionHTML () {
-    const html = await this.markdownService.textMarkdownToHTML(this.video.description)
-    this.videoHTMLDescription = this.markdownService.processVideoTimestamps(html)
+    {
+      const html = await this.markdownService.textMarkdownToHTML({ markdown: this.video.description })
+
+      this.videoHTMLDescription = this.markdownService.processVideoTimestamps(this.video.shortUUID, html)
+    }
+
+    {
+      const html = await this.markdownService.textMarkdownToHTML({ markdown: this.video.truncatedDescription })
+
+      this.videoHTMLTruncatedDescription = this.markdownService.processVideoTimestamps(this.video.shortUUID, html)
+    }
   }
 }