Export to .glb with embedded images.

src/components/components/CommonComponents.js

@@ -8,7 +8,7 @@ import Mixins from './Mixins';
 import {updateEntity, getClipboardRepresentation} from '../../actions/entity';
 import Events from '../../lib/Events';
 import Clipboard from 'clipboard';
-import {saveString} from '../../lib/utils';
+import {saveBlob} from '../../lib/utils';
 
 // @todo Take this out and use updateEntity?
 function changeId (componentName, value) {
@@ -68,10 +68,10 @@ export default class CommonComponents extends React.Component {
 
   exportToGLTF () {
     const entity = this.props.entity;
-    AFRAME.INSPECTOR.exporters.gltf.parse(entity.object3D, function (result) {
-      var output = JSON.stringify(result, null, 2);
-      saveString(output, (entity.id || 'entity') + '.gltf', 'application/json');
-    });
+    AFRAME.INSPECTOR.exporters.gltf.parse(entity.object3D, function (buffer) {
+      const blob = new Blob([buffer], {type: 'application/octet-stream'});
+      saveBlob(blob, (entity.id || 'entity') + '.glb');
+    }, {binary: true});
   }
 
   render () {

src/components/scenegraph/Toolbar.js

@@ -3,11 +3,17 @@ import React from 'react';
 import Clipboard from 'clipboard';
 import {getSceneName, generateHtml} from '../../lib/exporter';
 import Events from '../../lib/Events.js';
-import {saveString} from '../../lib/utils';
+import {saveBlob, saveString} from '../../lib/utils';
 import MotionCapture from './MotionCapture';
 
 const LOCALSTORAGE_MOCAP_UI = 'aframeinspectormocapuienabled';
 
+function filterHelpers (scene, visible) {
+  scene.traverse((o) => {
+    if (o.userData.source === 'INSPECTOR') { o.visible = visible; }
+  });
+}
+
 /**
  * Tools and actions.
  */
@@ -35,10 +41,14 @@ export default class Toolbar extends React.Component {
   }
   exportSceneToGLTF () {
     ga('send', 'event', 'SceneGraph', 'exportGLTF');
-    INSPECTOR.exporters.gltf.parse(AFRAME.scenes[0].object3D, function (result) {
-      var output = JSON.stringify(result, null, 2);
-      saveString(output, 'scene.gltf', 'application/json');
-    });
+    const sceneName = getSceneName(AFRAME.scenes[0]);
+    const scene = AFRAME.scenes[0].object3D;
+    filterHelpers(scene, false);
+    INSPECTOR.exporters.gltf.parse(scene, function (buffer) {
+      filterHelpers(scene, true);
+      const blob = new Blob([buffer], {type: 'application/octet-stream'});
+      saveBlob(blob, sceneName + '.glb');
+    }, {binary: true});
   }
 
   exportSceneToHTML () {

src/lib/inspector.js

@@ -100,6 +100,7 @@ Inspector.prototype = {
     this.scene = this.sceneEl.object3D;
     this.helpers = {};
     this.sceneHelpers = new THREE.Scene();
+    this.sceneHelpers.userData.source = 'INSPECTOR';
     this.sceneHelpers.visible = true; // false;
     this.inspectorActive = false;
 
@@ -178,8 +179,10 @@ Inspector.prototype = {
       var picker = new THREE.Mesh(geometry, material);
       picker.name = 'picker';
       picker.userData.object = object;
+      picker.userData.source = 'INSPECTOR';
       helper.add(picker);
       helper.fromObject = object;
+      helper.userData.source = 'INSPECTOR';
 
       this.sceneHelpers.add(helper);
       this.helpers[parentId][object.id] = helper;

src/lib/utils.js

@@ -84,17 +84,17 @@ function injectJS (url, onLoad, onError) {
 }
 
 function saveString (text, filename, mimeType) {
+  saveBlob(new Blob([ text ], { type: mimeType }), filename);
+}
+
+function saveBlob (blob, filename) {
   var link = document.createElement('a');
   link.style.display = 'none';
   document.body.appendChild(link);
-  function save (blob, filename) {
-    link.href = URL.createObjectURL(blob);
-    link.download = filename || 'ascene.html';
-    link.click();
-    // URL.revokeObjectURL(url); breaks Firefox...
-  }
-
-  save(new Blob([ text ], { type: mimeType }), filename);
+  link.href = URL.createObjectURL(blob);
+  link.download = filename || 'ascene.html';
+  link.click();
+  // URL.revokeObjectURL(url); breaks Firefox...
 }
 
 module.exports = {
@@ -105,5 +105,6 @@ module.exports = {
   os: getOS(),
   injectCSS: injectCSS,
   injectJS: injectJS,
-  saveString: saveString
+  saveString: saveString,
+  saveBlob: saveBlob,
 };