diff --git a/src/components/hover-visuals.js b/src/components/hover-visuals.js
index a65098b1a87daa149a08b2388208ac0c031ac102..fe0d24417838f1c00c313f14ee050fcdb1fa708c 100644
--- a/src/components/hover-visuals.js
+++ b/src/components/hover-visuals.js
@@ -1,3 +1,5 @@
+const interactorTransform = [];
+
/**
* Applies effects to a hoverer based on hover state.
* @namespace interactables
@@ -8,27 +10,30 @@ AFRAME.registerComponent("hover-visuals", {
hand: { type: "string" },
controller: { type: "selector" }
},
- init: function() {
+ init() {
// uniforms are set from the component responsible for loading the mesh.
this.uniforms = null;
- this.interactorTransform = [];
},
remove() {
- this.interactorTransform = null;
+ this.uniforms = null;
},
tick() {
- if (!this.uniforms) return;
+ if (!this.uniforms || !this.uniforms.size) return;
- this.el.object3D.matrixWorld.toArray(this.interactorTransform);
+ this.el.object3D.matrixWorld.toArray(interactorTransform);
const hovering = this.data.controller.components["super-hands"].state.has("hover-start");
- for (const uniform of this.uniforms) {
+ for (const uniform of this.uniforms.values()) {
if (this.data.hand === "left") {
uniform.hubs_HighlightInteractorOne.value = hovering;
- uniform.hubs_InteractorOneTransform.value = this.interactorTransform;
+ uniform.hubs_InteractorOnePos[0] = interactorTransform[12];
+ uniform.hubs_InteractorOnePos[1] = interactorTransform[13];
+ uniform.hubs_InteractorOnePos[2] = interactorTransform[14];
} else {
uniform.hubs_HighlightInteractorTwo.value = hovering;
- uniform.hubs_InteractorTwoTransform.value = this.interactorTransform;
+ uniform.hubs_InteractorTwoPos[0] = interactorTransform[12];
+ uniform.hubs_InteractorTwoPos[1] = interactorTransform[13];
+ uniform.hubs_InteractorTwoPos[2] = interactorTransform[14];
}
}
}
diff --git a/src/components/hoverable-visuals.js b/src/components/hoverable-visuals.js
index 028a6689f43cb8f23f57d4591c47c9182cc53871..60471dc613ee1430586058697603ba623d9014db 100644
--- a/src/components/hoverable-visuals.js
+++ b/src/components/hoverable-visuals.js
@@ -1,3 +1,6 @@
+const interactorOneTransform = [];
+const interactorTwoTransform = [];
+
/**
* Applies effects to a hoverable based on hover state.
* @namespace interactables
@@ -7,23 +10,19 @@ AFRAME.registerComponent("hoverable-visuals", {
schema: {
cursorController: { type: "selector" }
},
- init: function() {
+ init() {
// uniforms and boundingSphere are set from the component responsible for loading the mesh.
this.uniforms = null;
this.boundingSphere = new THREE.Sphere();
- this.interactorOneTransform = [];
- this.interactorTwoTransform = [];
- this.sweepParams = [];
+ this.sweepParams = [0, 0];
},
remove() {
this.uniforms = null;
this.boundingBox = null;
- this.interactorOneTransform = null;
- this.interactorTwoTransform = null;
},
tick(time) {
- if (!this.uniforms) return;
+ if (!this.uniforms || !this.uniforms.size) return;
const { hoverers } = this.el.components["hoverable"];
@@ -41,10 +40,10 @@ AFRAME.registerComponent("hoverable-visuals", {
}
if (interactorOne) {
- interactorOne.matrixWorld.toArray(this.interactorOneTransform);
+ interactorOne.matrixWorld.toArray(interactorOneTransform);
}
if (interactorTwo) {
- interactorTwo.matrixWorld.toArray(this.interactorTwoTransform);
+ interactorTwo.matrixWorld.toArray(interactorTwoTransform);
}
if (interactorOne || interactorTwo) {
@@ -54,14 +53,23 @@ AFRAME.registerComponent("hoverable-visuals", {
this.sweepParams[1] = worldY + scaledRadius;
}
- for (const uniform of this.uniforms) {
+ for (const uniform of this.uniforms.values()) {
uniform.hubs_EnableSweepingEffect.value = true;
uniform.hubs_SweepParams.value = this.sweepParams;
+
uniform.hubs_HighlightInteractorOne.value = !!interactorOne;
- uniform.hubs_InteractorOneTransform.value = this.interactorOneTransform;
+ uniform.hubs_InteractorOnePos.value[0] = interactorOneTransform[12];
+ uniform.hubs_InteractorOnePos.value[1] = interactorOneTransform[13];
+ uniform.hubs_InteractorOnePos.value[2] = interactorOneTransform[14];
+
uniform.hubs_HighlightInteractorTwo.value = !!interactorTwo;
- uniform.hubs_InteractorTwoTransform.value = this.interactorTwoTransform;
- uniform.hubs_Time.value = time;
+ uniform.hubs_InteractorTwoPos.value[0] = interactorTwoTransform[12];
+ uniform.hubs_InteractorTwoPos.value[1] = interactorTwoTransform[13];
+ uniform.hubs_InteractorTwoPos.value[2] = interactorTwoTransform[14];
+
+ if (interactorOne || interactorTwo) {
+ uniform.hubs_Time.value = time;
+ }
}
}
});
diff --git a/src/utils/media-highlight-frag.glsl b/src/utils/media-highlight-frag.glsl
index c953d39ab48c834b3c3f669bff977b1214e2a853..e6036b8eab78cf0bfebf5e1bd07566b706d6f48a 100644
--- a/src/utils/media-highlight-frag.glsl
+++ b/src/utils/media-highlight-frag.glsl
@@ -1,18 +1,12 @@
if (hubs_HighlightInteractorOne || hubs_HighlightInteractorTwo) {
- mat4 it;
- vec3 ip;
float dist1, dist2;
if (hubs_HighlightInteractorOne) {
- it = hubs_InteractorOneTransform;
- ip = vec3(it[3][0], it[3][1], it[3][2]);
- dist1 = distance(hubs_WorldPosition, ip);
+ dist1 = distance(hubs_WorldPosition, hubs_InteractorOnePos);
}
if (hubs_HighlightInteractorTwo) {
- it = hubs_InteractorTwoTransform;
- ip = vec3(it[3][0], it[3][1], it[3][2]);
- dist2 = distance(hubs_WorldPosition, ip);
+ dist2 = distance(hubs_WorldPosition, hubs_InteractorTwoPos);
}
float size = hubs_SweepParams.t - hubs_SweepParams.s;
diff --git a/src/utils/media-utils.js b/src/utils/media-utils.js
index a002e88681184eae87500acbf3d161eaadb96adb..4750ba603974604b892f68019f4c5c295a616532 100644
--- a/src/utils/media-utils.js
+++ b/src/utils/media-utils.js
@@ -144,8 +144,7 @@ export function injectCustomShaderChunks(obj) {
const fragRegex = /\bgl_FragColor\b/;
const validMaterials = ["MeshStandardMaterial", "MeshBasicMaterial", "MobileStandardMaterial"];
- const materialsSeen = new Set();
- const shaderUniforms = [];
+ const shaderUniforms = new Map();
obj.traverse(object => {
if (!object.material || !validMaterials.includes(object.material.type)) {
@@ -155,11 +154,10 @@ export function injectCustomShaderChunks(obj) {
object.material.onBeforeCompile = shader => {
if (!vertexRegex.test(shader.vertexShader)) return;
- shader.uniforms.hubs_InteractorOneTransform = { value: [] };
- shader.uniforms.hubs_InteractorTwoTransform = { value: [] };
- shader.uniforms.hubs_InteractorTwoPos = { value: [] };
shader.uniforms.hubs_EnableSweepingEffect = { value: false };
- shader.uniforms.hubs_SweepParams = { value: [] };
+ shader.uniforms.hubs_SweepParams = { value: [0, 0] };
+ shader.uniforms.hubs_InteractorOnePos = { value: [0, 0, 0] };
+ shader.uniforms.hubs_InteractorTwoPos = { value: [0, 0, 0] };
shader.uniforms.hubs_HighlightInteractorOne = { value: false };
shader.uniforms.hubs_HighlightInteractorTwo = { value: false };
shader.uniforms.hubs_Time = { value: 0 };
@@ -188,16 +186,13 @@ export function injectCustomShaderChunks(obj) {
flines.unshift("uniform bool hubs_EnableSweepingEffect;");
flines.unshift("uniform vec2 hubs_SweepParams;");
flines.unshift("uniform bool hubs_HighlightInteractorOne;");
- flines.unshift("uniform mat4 hubs_InteractorOneTransform;");
+ flines.unshift("uniform vec3 hubs_InteractorOnePos;");
flines.unshift("uniform bool hubs_HighlightInteractorTwo;");
- flines.unshift("uniform mat4 hubs_InteractorTwoTransform;");
+ flines.unshift("uniform vec3 hubs_InteractorTwoPos;");
flines.unshift("uniform float hubs_Time;");
shader.fragmentShader = flines.join("\n");
- if (!materialsSeen.has(object.material.uuid)) {
- shaderUniforms.push(shader.uniforms);
- materialsSeen.add(object.material.uuid);
- }
+ shaderUniforms.set(object.material.uuid, shader.uniforms);
};
object.material.needsUpdate = true;
});