title: Theejs - Change texture on collada element with uses ShaderMaterial
body: <p>So I have this Collada (dae) export from a 3d model application for creating packaging.</p>
  
  <p>I've managed to import this model in my scene with</p>
  
  <pre><code>var loader = new THREE.ColladaLoader();
     loader.load("model.dae", collada =&gt; {
  
     this.scene.add(collada.dae);
  });
  </code></pre>
  
  <p>This works. Animations do also work.</p>
  
  <p>However this dae file has some references to external textures. And I want to programmaticly replace some of them.</p>
  
  <p>The dea from an export uses <code>ShaderMaterial</code> elements and I have no idea to apply a new texture to it. Everything I do will make it black or does nothing.</p>
  
  <p><strong>What I tried</strong></p>
  
  <p>I know the name of the image texture that is beeing used that I want to replace. The name is <code>TextureResource129.png</code>.</p>
  
  <p>So what I do:</p>
  
  <ul>
  <li>Load the new texture</li>
  <li>Loop through all nodes/children in the <code>dea</code> that is in the scene.</li>
  <li>I check if the node has a <code>material object</code> and <code>is a mesh</code></li>
  <li>I clone the material</li>
  <li>I replace everywhere the old texture image is in the object tree by the new texture image. The export has them on 4 possible locations.</li>
  <li>Then I add the adjusted material again.</li>
  <li>Then the object turns black in the scene</li>
  </ul>
  
  <p>The code:</p>
  
  <pre><code>var loader = new THREE.TextureLoader();
  loader.load("/assets/images/texture2/TextureResource129.png", texture =&gt; {
    this.dae.traverse(node =&gt; {
      if (node.material &amp;&amp; node.isMesh) {
        if (
          node.material.uniforms.EnvDiff0 &amp;&amp;
          node.material.uniforms.EnvDiff0.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1 ||
          node.material.uniforms.paperBump1 &amp;&amp;
          node.material.uniforms.paperBump1.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1 ||
          node.material.uniforms.matDiff1 &amp;&amp;
          node.material.uniforms.matDiff1.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1 ||
          node.material.uniforms.matDiff2 &amp;&amp;
          node.material.uniforms.matDiff2.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1
        ) {
          var material = node.material.clone();
          if(material.uniforms.EnvDiff0) material.uniforms.EnvDiff0.image = texture;
          if(material.uniforms.paperBump1) material.uniforms.paperBump1.image = texture;
          if(material.uniforms.matDiff1) material.uniforms.matDiff1.image = texture;
          if(material.uniforms.matDiff2) material.uniforms.matDiff2.image = texture;
          node.material = material;
        }
      }
    });
  });
  </code></pre>
  
  <p>This makes the object black. So <code>I tried only cloning the material and attaching it again to the same node</code>, without changes.
  But even then it also turns black again:</p>
  
  <pre><code>var loader = new THREE.TextureLoader();
  loader.load("/assets/images/texture2/TextureResource129.png", texture =&gt; {
    this.dae.traverse(node =&gt; {
      if (node.material &amp;&amp; node.isMesh) {
        if (
          node.material.uniforms.EnvDiff0 &amp;&amp;
          node.material.uniforms.EnvDiff0.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1 ||
          node.material.uniforms.paperBump1 &amp;&amp;
          node.material.uniforms.paperBump1.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1 ||
          node.material.uniforms.matDiff1 &amp;&amp;
          node.material.uniforms.matDiff1.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1 ||
          node.material.uniforms.matDiff2 &amp;&amp;
          node.material.uniforms.matDiff2.value.image.currentSrc.indexOf("TextureResource129.png") &gt; -1
        ) {
          var material = node.material.clone();
          node.material = material;
        }
      }
    });
  });
  </code></pre>
  
  <p>So the question is:</p>
  
  <p><strong><em>How can I change the texture of a collada (.dea) file programatic when it is in the scene?</em></strong></p>