Fix darkened video-texture-target

This commit fixes darkened video-texture-target problem
caused when upgrading our Three.js to r141.

Refer to "Fix darkened camera view" commit for the details
because the root issue is same.

The previous same purpose commit was reverted because
it didn't work correctly because of losing
material.onBeforeRender when cloning materials.
This commit resolves it by copying the function.

src/components/tools/pen-laser.js

@@ -21,6 +21,7 @@ AFRAME.registerComponent("pen-laser", {
     material = convertStandardMaterial(material, quality);
 
     const tipMaterial = material.clone();
+    tipMaterial.onBeforeRender = material.onBeforeRender;
 
     const lineCurve = new THREE.LineCurve3(new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, 2));
     const geometry = new THREE.TubeBufferGeometry(lineCurve, 2, 0.003, 8, true);

src/components/video-texture-target.js

@@ -153,9 +153,8 @@ AFRAME.registerComponent("video-texture-target", {
         const texture = videoTextureSource.renderTarget.texture;
         this.applyTexture(texture);
 
-        // Bit of a hack here to only update the renderTarget when the screens are in view
-        material.map.isVideoTexture = true;
-        material.map.update = () => {
+        // Only update the renderTarget when the screens are in view
+        material.onBeforeRender = () => {
           videoTextureSource.textureNeedsUpdate = true;
         };
       } else {

src/utils/material-utils.js

@@ -35,6 +35,7 @@ class HubsMeshBasicMaterial extends THREE.MeshBasicMaterial {
     const material = new HubsMeshBasicMaterial();
 
     THREE.Material.prototype.copy.call(material, source);
+    material.onBeforeRender = source.onBeforeRender;
 
     material.color.copy(source.color);
 
@@ -130,6 +131,7 @@ class HubsMeshPhongMaterial extends THREE.MeshPhongMaterial {
     const material = new HubsMeshPhongMaterial();
 
     THREE.Material.prototype.copy.call(material, source);
+    material.onBeforeRender = source.onBeforeRender;
 
     material.color.copy(source.color);
 

src/utils/media-utils.js

@@ -289,6 +289,7 @@ export function injectCustomShaderChunks(obj) {
         return material;
 
       const newMaterial = material.clone();
+      newMaterial.onBeforeRender = material.onBeforeRender;
       newMaterial.onBeforeCompile = (shader, renderer) => {
         if (shader.vertexShader.indexOf("#include <skinning_vertex>") == -1) return;