initialize properly for sidebar previews

Signed-off-by: Robin Appelman <robin@icewind.nl>

2 files changed, 21 insertions, 4 deletions

diff --git a/js/PreviewPlugin.ts b/js/PreviewPlugin.ts
index 9f95d56..0b91ae1 100644
--- a/js/PreviewPlugin.ts
+++ b/js/PreviewPlugin.ts
@@ -4,11 +4,24 @@ import {UnderscoreStatic} from "underscore";
 declare const _: UnderscoreStatic;
 
 export class PreviewPlugin {
-    renderer: Renderer = new Renderer();
+    renderer: Renderer;
 
-    init() {
+    initPromise: JQueryPromise<void> | null = null;
 
+    init() {
+        if (!this.initPromise) {
+            const deferred = $.Deferred();
+            require.ensure(['./Renderer'], () => {
+                const {Renderer} = require('./Renderer');
+                this.renderer = new Renderer();
+                deferred.resolve();
+            });
+            this.initPromise = deferred.promise();
+        }
+        return this.initPromise;
     }
 
-    preview = _.throttle(this.renderer.renderText.bind(this.renderer), 500);
+    preview = _.throttle((text: string, element) => {
+        this.renderer.renderText(text, element);
+    }, 500);
 }
\ No newline at end of file
diff --git a/js/SidebarPreview.ts b/js/SidebarPreview.ts
index 1ba887e..aefa8f7 100644
--- a/js/SidebarPreview.ts
+++ b/js/SidebarPreview.ts
@@ -15,7 +15,11 @@ export class SidebarPreview implements SidebarPreviewPlugin {
         const previewWidth = ($thumbnailContainer.parent().width() as number) + 50;  // 50px for negative margins
         const previewHeight = previewWidth / (16 / 9);
 
-        this.getFileContent(model.getFullPath()).then(content => {
+        $.when(
+            this.getFileContent(model.getFullPath()),
+            this.previewPlugin.init()
+        ).then(([content]) => {
+            console.log(content);
             $thumbnailDiv.removeClass('icon-loading icon-32');
             $thumbnailContainer.addClass('large');
             $thumbnailContainer.addClass('text');