Federate entire description

Introduce an explicit field truncatedDescription
description in video list is deprecated
description in video get will contain the entire description

2 files changed, 25 insertions, 16 deletions

diff --git a/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.html b/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.html
index fa4dbb3ca..d847daff7 100644
--- a/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.html
+++ b/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.html
@@ -1,7 +1,7 @@
 <div class="video-info-description">
   <div
     class="video-info-description-html"
-    [innerHTML]="videoHTMLDescription"
+    [innerHTML]="getHTMLDescription()"
     (timestampClicked)="onTimestampClicked($event)"
     myTimestampRouteTransformer
   ></div>
diff --git a/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts b/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts
index 72b09a274..d01080611 100644
--- a/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts
+++ b/client/src/app/+videos/+video-watch/shared/metadata/video-description.component.ts
@@ -15,8 +15,10 @@ export class VideoDescriptionComponent implements OnChanges {
 
   descriptionLoading = false
   completeDescriptionShown = false
-  completeVideoDescription: string
-  shortVideoDescription: string
+
+  completeVideoDescriptionLoaded = false
+
+  videoHTMLTruncatedDescription = ''
   videoHTMLDescription = ''
 
   constructor (
@@ -28,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
   }
 
@@ -56,10 +55,10 @@ export class VideoDescriptionComponent implements OnChanges {
             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: err => {
@@ -73,15 +72,25 @@ export class VideoDescriptionComponent implements OnChanges {
     this.timestampClicked.emit(timestamp)
   }
 
-  private updateVideoDescription (description: string) {
-    this.video.description = description
-    this.setVideoDescriptionHTML()
-      .catch(err => logger.error(err))
+  getHTMLDescription () {
+    if (this.completeDescriptionShown) {
+      return this.videoHTMLDescription
+    }
+
+    return this.videoHTMLTruncatedDescription
   }
 
   private async setVideoDescriptionHTML () {
-    const html = await this.markdownService.textMarkdownToHTML({ markdown: this.video.description })
+    {
+      const html = await this.markdownService.textMarkdownToHTML({ markdown: this.video.description })
 
-    this.videoHTMLDescription = this.markdownService.processVideoTimestamps(this.video.shortUUID, html)
+      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)
+    }
   }
 }