resolves #40

src/components/InteractiveObjects/ClassicPuzzle.js

@@ -1,4 +1,4 @@
-import { Color, Group, DoubleSide, RepeatWrapping } from "three"
+import { Color, Group, DoubleSide, RepeatWrapping, MeshStandardMaterial } from "three"
 import { EventManager } from '@/lib/EventManager';
 import { centerOrigin } from "@/lib/MeshUtils";
 
@@ -11,6 +11,11 @@ class ClassicPuzzle extends EventManager {
         return new Promise(async (resolve, reject)=>{
             let gltf = await engine.load(`puzzle-${data.dimension}.glb`, '/static/meshes/classic-puzzle/');
             let map = await engine.loadTexture(data.$go.asset.name);
+            map.wrapS = RepeatWrapping;
+            map.wrapT = RepeatWrapping;
+            map.flipY = false;
+            map.needsUpdate = true;
+            
             let dragZone = gltf.scene.getObjectByName('DragZone');
             dragZone.material.side = DoubleSide;
             let eventsFn= {
@@ -39,24 +44,22 @@ class ClassicPuzzle extends EventManager {
             }
             let pCount = 0;
             dragZone.visible = false;
+
+            let defaultMaterial = new MeshStandardMaterial({
+                map, emissiveIntensity: 0.05, lightMapIntensity: 10, side:DoubleSide, roughness: 1, metalness: 0,
+            })
+
             gltf.scene.children.forEach((o, i)=>{
                 if (o.name.startsWith(objPrefix)){
                     let pp = o.clone();
                     container.add(pp);
+                    defaultMaterial.emissiveMap ??= pp.material.emissiveMap;
+                    pp.material = defaultMaterial;
                     pp.position.set(2*Math.random()-1, 2*Math.random() - 1, 0.01*(i+1));
                     engine.draggable.add(pp, dragZone, eventsFn);
                     pCount++;
                 }
             });
-            let defaultMaterial = container.children[0].material;
-            map.wrapS = RepeatWrapping;
-            map.wrapT = RepeatWrapping;
-            map.flipY = false;
-            defaultMaterial.map = map;
-            map.needsUpdate = true;
-            defaultMaterial.emissiveIntensity=.05
-            defaultMaterial.lightMapIntensity=10;
-            console.log(defaultMaterial);
             let doneMaterial = defaultMaterial.clone();
             doneMaterial.emissive = new Color(10,114,10);
             defaultMaterial.emissive = new Color(114,10,10);