Refactor video links builders

[github/Chocobozzz/PeerTube.git] / client / src / app / shared / shared-custom-markup / custom-markup-container.component.ts

diff --git a/client/src/app/shared/shared-custom-markup/custom-markup-container.component.ts b/client/src/app/shared/shared-custom-markup/custom-markup-container.component.ts
index 2ecdc0243dbe5833e11f3f55ab0f969722956a0a..4e802b14dd0f20795294922dd20fc25d2645a460 100644 (file)
--- a/client/src/app/shared/shared-custom-markup/custom-markup-container.component.ts
+++ b/client/src/app/shared/shared-custom-markup/custom-markup-container.component.ts
@@ -3,14 +3,15 @@ import { CustomMarkupService } from './custom-markup.service'
 
 @Component({
   selector: 'my-custom-markup-container',
-  templateUrl: './custom-markup-container.component.html',
-  styleUrls: [ './custom-markup-container.component.scss' ]
+  templateUrl: './custom-markup-container.component.html'
 })
 export class CustomMarkupContainerComponent implements OnChanges {
   @ViewChild('contentWrapper') contentWrapper: ElementRef<HTMLInputElement>
 
   @Input() content: string
 
+  displayed = false
+
   constructor (
     private customMarkupService: CustomMarkupService
   ) { }
@@ -20,8 +21,13 @@ export class CustomMarkupContainerComponent implements OnChanges {
   }
 
   private async buildElement () {
-    const element = await this.customMarkupService.buildElement(this.content)
-    this.contentWrapper.nativeElement.appendChild(element)
-  }
+    if (!this.content) return
+
+    const { rootElement, componentsLoaded } = await this.customMarkupService.buildElement(this.content)
+    this.contentWrapper.nativeElement.appendChild(rootElement)
 
+    await componentsLoaded
+
+    this.displayed = true
+  }
 }