3 files changed, 28 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)
+    }
   }
 }
diff --git a/client/src/app/shared/shared-main/video/video.model.ts b/client/src/app/shared/shared-main/video/video.model.ts
index c9c6b979c..6fdffb394 100644
--- a/client/src/app/shared/shared-main/video/video.model.ts
+++ b/client/src/app/shared/shared-main/video/video.model.ts
@@ -34,6 +34,7 @@ export class Video implements VideoServerModel {
   language: VideoConstant<string>
   privacy: VideoConstant<VideoPrivacy>
 
+  truncatedDescription: string
   description: string
 
   duration: number
@@ -134,6 +135,8 @@ export class Video implements VideoServerModel {
     this.privacy = hash.privacy
     this.waitTranscoding = hash.waitTranscoding
     this.state = hash.state
+
+    this.truncatedDescription = hash.truncatedDescription
     this.description = hash.description
 
     this.isLive = hash.isLive