lazy load trace surface preview Fixes #111

benvanik · Mar 1, 2014 · b8c9846 · b8c9846
1 parent 8b16d41
commit b8c9846
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 14 deletions.
diff --git a/core/host/HostUI.js b/core/host/HostUI.js
@@ -7,6 +7,9 @@
                 var call = frame.calls[n];
                 call.info = gli.info.functions[call.name];
             }
+            if (!context.ui.tabs.trace.traceView.inspector) {
+              context.ui.tabs.trace.createInspector();
+            }
             context.frames.push(frame);
             if (context.ui) {
                 context.ui.appendFrame(frame);

diff --git a/core/replay/Controller.js b/core/replay/Controller.js
@@ -13,7 +13,7 @@
 
     Controller.prototype.setOutput = function (canvas) {
         this.output.canvas = canvas;
-        
+
         // TODO: pull attributes from source somehow?
         var gl = this.output.gl = gli.util.getWebGLContext(canvas, null, null);
         gli.info.initialize(gl);
@@ -33,14 +33,15 @@
     };
 
     Controller.prototype.getCurrentState = function () {
+        if (!this.output.gl) return null;
         return new gli.host.StateSnapshot(this.output.gl);
     };
 
     Controller.prototype.openFrame = function (frame, suppressEvents, force, useDepthShader) {
         var gl = this.output.gl;
 
         this.currentFrame = frame;
-        
+
         if (useDepthShader) {
             frame.switchMirrors();
         } else {

diff --git a/core/ui/tabs/trace/TraceTab.js b/core/ui/tabs/trace/TraceTab.js
@@ -2,19 +2,25 @@
     var ui = glinamespace("gli.ui");
     var Tab = ui.Tab;
 
+    var createInspector = function () {
+      var inspector = Tab.inspector();
+      inspector.classList.add("window-trace-inspector");
+      var right = document.getElementById("gliTraceInspector");
+      right.insertBefore(inspector, right.firstChild);
+      this.traceView.createInspector(right);
+    };
+
     var TraceTab = function (w) {
         var outer = Tab.divClass("window-right-outer");
         var right = Tab.divClass("window-right");
-        var inspector = Tab.inspector();
-        inspector.classList.add("window-trace-inspector");
+        right.id = "gliTraceInspector";
         var traceOuter = Tab.divClass("window-trace-outer");
         var trace = Tab.divClass("window-trace");
         var left = Tab.windowLeft({ listing: "frame list", toolbar: "toolbar" });
 
         trace.appendChild(Tab.divClass("trace-minibar", "minibar"));
         trace.appendChild(Tab.divClass("trace-listing", "call trace"));
         traceOuter.appendChild(trace);
-        right.appendChild(inspector);
         right.appendChild(traceOuter);
         outer.appendChild(right);
         outer.appendChild(left);
@@ -65,8 +71,10 @@
         }
 
         this.layout = function () {
-            this.traceView.layout();
+            if (this.traceView.layout) this.traceView.layout();
         };
+
+        this.createInspector = createInspector;
     };
 
     ui.TraceTab = TraceTab;

diff --git a/core/ui/tabs/trace/TraceView.js b/core/ui/tabs/trace/TraceView.js
@@ -250,10 +250,15 @@
         var context = w.context;
         this.window = w;
         this.elements = {};
-
         this.minibar = new TraceMinibar(this, w, elementRoot);
         this.traceListing = new gli.ui.TraceListing(this, w, elementRoot);
+        this.frame = null;
+    };
 
+    TraceView.prototype.createInspector = function (elementRoot) {
+        var w = this.window;
+        var context = w.context;
+        var self = this;
         this.inspectorElements = {
             "window-trace-outer": elementRoot.getElementsByClassName("window-trace-outer")[0],
             "window-trace": elementRoot.getElementsByClassName("window-trace")[0],
@@ -363,15 +368,13 @@
                 }
             }
         };
-        this.inspector.canvas.style.display = "";
 
+        var canvas = this.inspector.canvas;
+        canvas.style.display = "";
         w.controller.setOutput(this.inspector.canvas);
-
         // TODO: watch for parent canvas size changes and update
-        this.inspector.canvas.width = context.canvas.width;
-        this.inspector.canvas.height = context.canvas.height;
-
-        this.frame = null;
+        canvas.width = this.window.context.canvas.width;
+        canvas.height = this.window.context.canvas.height;
     };
 
     TraceView.prototype.setInspectorWidth = function (newWidth) {
@@ -387,7 +390,7 @@
     };
 
     TraceView.prototype.layout = function () {
-        this.inspector.layout();
+        if (this.inspector) this.inspector.layout();
     };
 
     TraceView.prototype.reset = function () {