Wait globe to load world.jpg before display it

renotes · Mar 18, 2016 · a3bba8c · a3bba8c
1 parent 5af32f2
commit a3bba8c
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 40 deletions.
diff --git a/plugins/Sidebar/media/Sidebar.coffee b/plugins/Sidebar/media/Sidebar.coffee
@@ -351,22 +351,25 @@ class Sidebar extends Class
 
 
 	displayGlobe: =>
-		wrapper.ws.cmd "sidebarGetPeers", [], (globe_data) =>
-			if @globe
-				@globe.scene.remove(@globe.points)
-				@globe.addData( globe_data, {format: 'magnitude', name: "hello", animated: false} )
-				@globe.createPoints()
-			else
-				try
-					@globe = new DAT.Globe( @tag.find(".globe")[0], {"imgDir": "/uimedia/globe/"} )
-					@globe.addData( globe_data, {format: 'magnitude', name: "hello"} )
+		img = new Image();
+		img.src = "/uimedia/globe/world.jpg";
+		img.onload = =>
+			wrapper.ws.cmd "sidebarGetPeers", [], (globe_data) =>
+				if @globe
+					@globe.scene.remove(@globe.points)
+					@globe.addData( globe_data, {format: 'magnitude', name: "hello", animated: false} )
 					@globe.createPoints()
-					@globe.animate()
-				catch e
-					console.log "WebGL error", e
-					@tag.find(".globe").addClass("error").text("WebGL not supported")
-
-			@tag.find(".globe").removeClass("loading")
+				else
+					try
+						@globe = new DAT.Globe( @tag.find(".globe")[0], {"imgDir": "/uimedia/globe/"} )
+						@globe.addData( globe_data, {format: 'magnitude', name: "hello"} )
+						@globe.createPoints()
+						@globe.animate()
+					catch e
+						console.log "WebGL error", e
+						@tag.find(".globe").addClass("error").text("WebGL not supported")
+
+				@tag.find(".globe").removeClass("loading")
 
 
 	unloadGlobe: =>

diff --git a/plugins/Sidebar/media/all.js b/plugins/Sidebar/media/all.js
@@ -601,37 +601,42 @@ window.initScrollable = function () {
     };
 
     Sidebar.prototype.displayGlobe = function() {
-      return wrapper.ws.cmd("sidebarGetPeers", [], (function(_this) {
-        return function(globe_data) {
-          var e;
-          if (_this.globe) {
-            _this.globe.scene.remove(_this.globe.points);
-            _this.globe.addData(globe_data, {
-              format: 'magnitude',
-              name: "hello",
-              animated: false
-            });
-            _this.globe.createPoints();
-          } else {
-            try {
-              _this.globe = new DAT.Globe(_this.tag.find(".globe")[0], {
-                "imgDir": "/uimedia/globe/"
-              });
+      var img;
+      img = new Image();
+      img.src = "/uimedia/globe/world.jpg";
+      return img.onload = (function(_this) {
+        return function() {
+          return wrapper.ws.cmd("sidebarGetPeers", [], function(globe_data) {
+            var e;
+            if (_this.globe) {
+              _this.globe.scene.remove(_this.globe.points);
               _this.globe.addData(globe_data, {
                 format: 'magnitude',
-                name: "hello"
+                name: "hello",
+                animated: false
               });
               _this.globe.createPoints();
-              _this.globe.animate();
-            } catch (_error) {
-              e = _error;
-              console.log("WebGL error", e);
-              _this.tag.find(".globe").addClass("error").text("WebGL not supported");
+            } else {
+              try {
+                _this.globe = new DAT.Globe(_this.tag.find(".globe")[0], {
+                  "imgDir": "/uimedia/globe/"
+                });
+                _this.globe.addData(globe_data, {
+                  format: 'magnitude',
+                  name: "hello"
+                });
+                _this.globe.createPoints();
+                _this.globe.animate();
+              } catch (_error) {
+                e = _error;
+                console.log("WebGL error", e);
+                _this.tag.find(".globe").addClass("error").text("WebGL not supported");
+              }
             }
-          }
-          return _this.tag.find(".globe").removeClass("loading");
+            return _this.tag.find(".globe").removeClass("loading");
+          });
         };
-      })(this));
+      })(this);
     };
 
     Sidebar.prototype.unloadGlobe = function() {