From f2ed8d90bbae43a54feed2adfd13dadcf207094b Mon Sep 17 00:00:00 2001
From: Robert Long <robert@robertlong.me>
Date: Mon, 23 Apr 2018 14:16:40 -0700
Subject: [PATCH] Update nav-mesh component and inflator to support precomputed
nav-mesh
---
package.json | 2 +-
src/components/gltf-model-plus.js | 24 +++++++-----------------
src/gltf-component-mappings.js | 9 ++++++++-
src/utils/resolveURL.js | 17 +++++++++++++++++
yarn.lock | 6 +++---
5 files changed, 36 insertions(+), 22 deletions(-)
create mode 100644 src/utils/resolveURL.js
diff --git a/package.json b/package.json
index 0d9ed6b57..9d5901905 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
"@fortawesome/fontawesome-free-solid": "^5.0.9",
"@fortawesome/react-fontawesome": "^0.0.18",
"aframe-billboard-component": "^1.0.0",
- "aframe-extras": "^4.0.0",
+ "aframe-extras": "https://github.com/MozillaReality/aframe-extras#feature/precompute-nav-mesh",
"aframe-input-mapping-component": "https://github.com/johnshaughnessy/aframe-input-mapping-component#feature/map-to-array",
"aframe-physics-extras": "https://github.com/infinitelee/aframe-physics-extras#fix/physics-collider-crash",
"aframe-physics-system": "https://github.com/infinitelee/aframe-physics-system#feature/shape-component",
diff --git a/src/components/gltf-model-plus.js b/src/components/gltf-model-plus.js
index 41b6b5020..be581a9a5 100644
--- a/src/components/gltf-model-plus.js
+++ b/src/components/gltf-model-plus.js
@@ -1,7 +1,7 @@
const GLTFCache = {};
AFRAME.GLTFModelPlus = {
- defaultInflator(el, componentName, componentData) {
+ defaultInflator(el, componentName, componentData, gltfPath) {
if (!AFRAME.components[componentName]) {
throw new Error(`Inflator failed. "${componentName}" component does not exist.`);
}
@@ -73,7 +73,7 @@ function cloneGltf(gltf) {
return clone;
}
-const inflateEntities = function(parentEl, node) {
+const inflateEntities = function(parentEl, node, gltfPath) {
// setObject3D mutates the node's parent, so we have to copy
const children = node.children.slice(0);
@@ -131,14 +131,14 @@ const inflateEntities = function(parentEl, node) {
const { inflator, componentName } = AFRAME.GLTFModelPlus.components[prop];
if (inflator) {
- inflator(el, componentName, entityComponents[prop]);
+ inflator(el, componentName, entityComponents[prop], gltfPath);
}
}
}
}
children.forEach(childNode => {
- inflateEntities(el, childNode);
+ inflateEntities(el, childNode, gltfPath);
});
return el;
@@ -223,18 +223,7 @@ AFRAME.registerComponent("gltf-model-plus", {
// If the src attribute is a selector, get the url from the asset item.
if (src && src.charAt(0) === "#") {
const assetEl = document.getElementById(src.substring(1));
-
- const fallbackSrc = assetEl.getAttribute("src");
- const highSrc = assetEl.getAttribute("high-src");
- const lowSrc = assetEl.getAttribute("low-src");
-
- if (highSrc && window.APP.quality === "high") {
- src = highSrc;
- } else if (lowSrc && window.APP.quality === "low") {
- src = lowSrc;
- } else {
- src = fallbackSrc;
- }
+ src = assetEl.getAttribute("src");
}
if (src === this.lastSrc) return;
@@ -248,6 +237,7 @@ AFRAME.registerComponent("gltf-model-plus", {
return;
}
+ const gltfPath = THREE.LoaderUtils.extractUrlBase(src);
const model = await cachedLoadGLTF(src, this.data.preferredTechnique);
// If we started loading something else already
@@ -263,7 +253,7 @@ AFRAME.registerComponent("gltf-model-plus", {
this.el.setObject3D("mesh", this.model);
if (this.data.inflate) {
- this.inflatedEl = inflateEntities(this.el, this.model);
+ this.inflatedEl = inflateEntities(this.el, this.model, gltfPath);
// TODO: Still don't fully understand the lifecycle here and how it differs between browsers, we should dig in more
// Wait one tick for the appended custom elements to be connected before attaching templates
await nextTick();
diff --git a/src/gltf-component-mappings.js b/src/gltf-component-mappings.js
index 2166e7a62..e2177fb25 100644
--- a/src/gltf-component-mappings.js
+++ b/src/gltf-component-mappings.js
@@ -1,7 +1,14 @@
import "./components/gltf-model-plus";
+import { resolveURL } from "./utils/resolveURL";
AFRAME.GLTFModelPlus.registerComponent("scale-audio-feedback", "scale-audio-feedback");
AFRAME.GLTFModelPlus.registerComponent("loop-animation", "loop-animation");
AFRAME.GLTFModelPlus.registerComponent("shape", "shape");
AFRAME.GLTFModelPlus.registerComponent("visible", "visible");
-AFRAME.GLTFModelPlus.registerComponent("nav-mesh", "nav-mesh");
+AFRAME.GLTFModelPlus.registerComponent("nav-mesh", "nav-mesh", (el, componentName, componentData, gltfPath) => {
+ if (componentData.src) {
+ componentData.src = resolveURL(componentData.src, gltfPath);
+ }
+
+ el.setAttribute(componentName, componentData);
+});
diff --git a/src/utils/resolveURL.js b/src/utils/resolveURL.js
new file mode 100644
index 000000000..ddc6c8680
--- /dev/null
+++ b/src/utils/resolveURL.js
@@ -0,0 +1,17 @@
+// From THREE.GLTFLoader https://github.com/mrdoob/three.js/blob/dev/examples/js/loaders/GLTFLoader.js#L1117
+export function resolveURL(url, path) {
+ // Invalid URL
+ if (typeof url !== "string" || url === "") return "";
+
+ // Absolute URL http://,https://,//
+ if (/^(https?:)?\/\//i.test(url)) return url;
+
+ // Data URI
+ if (/^data:.*,.*$/i.test(url)) return url;
+
+ // Blob URL
+ if (/^blob:.*$/i.test(url)) return url;
+
+ // Relative URL
+ return path + url;
+}
diff --git a/yarn.lock b/yarn.lock
index 6ae1ce2d8..ed9587475 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -160,9 +160,9 @@ aframe-billboard-component@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/aframe-billboard-component/-/aframe-billboard-component-1.0.0.tgz#10ce2482729eef7386c5844d65917581a62d3adc"
-aframe-extras@^4.0.0:
- version "4.0.0"
- resolved "https://registry.yarnpkg.com/aframe-extras/-/aframe-extras-4.0.0.tgz#fc851e2a1312c30a4d4addc3e0fa2dbf3e723ead"
+"aframe-extras@https://github.com/MozillaReality/aframe-extras#feature/precompute-nav-mesh":
+ version "4.0.2"
+ resolved "https://github.com/MozillaReality/aframe-extras#c4451b03ca0fe39a5517f81b153b3f801ccaa711"
dependencies:
three-pathfinding "^0.5.5"
--
GitLab