rewrite puzzle 1 to support NxM

src/components/InteractiveObjects/PuzzleGame1.js

@@ -7,27 +7,10 @@ class PuzzleGame1 {
             let w = data.w, h = data.h, wh = w*h;
             this.object = new Group();
             const aq = new MotionEngine();
-            const pr = [[0, -1], [0, 1], [1, 0], [-1, 0], [0, 0], [0, 2]];
+            const pr = [[0, 2], [0, -1], [0, 1], [1, 0], [-1, 0], [0, 0]];
             let d = 1.2;
 
             let bm = new BoxGeometry(1, 1, 1);
-            let uv = bm.getAttribute('uv');
-
-            for (let i = 0; i < wh; i++) {
-                let s = [(i % w) / w, Math.trunc(i / w) / h];
-                //top left
-                uv.array[8 * i] = s[0];
-                uv.array[8 * i + 1] = s[1] + 1 / h;
-                //top right
-                uv.array[8 * i + 2] = s[0] + 1 / w;
-                uv.array[8 * i + 3] = s[1] + 1 / h;
-                //bottom left
-                uv.array[8 * i + 4] = s[0];
-                uv.array[8 * i + 5] = s[1];
-                //bottom right
-                uv.array[8 * i + 6] = s[0] + 1 / w;
-                uv.array[8 * i + 7] = s[1];
-            }
 
             let material = new MeshBasicMaterial({
                 map: await engine.loadTexture(data.$go.asset.name)
@@ -36,14 +19,37 @@ class PuzzleGame1 {
 
             for (let i = 0; i < wh; i++) {
                 let b = bm.clone();
+                let uv = b.getAttribute('uv');
+
+                //0-8->R, 8-16->L, 16-24->Top, 24-32->Bottom, 32-40->Front, 40-48->Back
+                let x = i % w, y = Math.trunc(i / w);
+                let idxs = [(i+1) % wh, (i+2)%wh, (i+3)%wh, (i+4)%wh, i, y*w + w - x -1]
+                for (let i = 0; i < 6; i++) {
+                    let idx = idxs[i];
+                    let x = idx % w, y = Math.trunc(idx / w)
+                    let s = [x / w, y / h];
+                    //top left
+                    uv.array[8 * i] = s[0];
+                    uv.array[8 * i + 1] = s[1] + 1 / h;
+                    //top right
+                    uv.array[8 * i + 2] = s[0] + 1 / w;
+                    uv.array[8 * i + 3] = s[1] + 1 / h;
+                    //bottom left
+                    uv.array[8 * i + 4] = s[0];
+                    uv.array[8 * i + 5] = s[1];
+                    //bottom right
+                    uv.array[8 * i + 6] = s[0] + 1 / w;
+                    uv.array[8 * i + 7] = s[1];
+                }
+
                 let mesh = new Mesh(b, material);
                 mesh.position.set((i % w) * d, (Math.trunc(i / w)) * d, 0);
-                let ri;
-                do {
-                    ri = Math.floor(Math.random() * 6);
-                } while (ri == this.object.children.length);
+                let ri = Math.floor(Math.random() * 5);
                 mesh.rotation.set(pr[ri][0] * Math.PI / 2, pr[ri][1] * Math.PI / 2, 0);
                 mesh._ri = ri;
+                if (idxs[4] == idxs[5]){
+                    mesh._dd = true;
+                }
                 this.object.add(mesh);
             }
 
@@ -52,13 +58,11 @@ class PuzzleGame1 {
             };
 
             var check = () => {
-                if (!this.object.children.length) return false;
                 let i = 0;
-                for (let c of this.object.children) {
-                    if (Math.abs(c.rotation.x - pr[i][0] * Math.PI / 2) > 0.0001 || Math.abs(c.rotation.y - pr[i][1] * Math.PI / 2) > 0.0001) return false;
-                    i++;
-                }
-                return true;
+                this.object.children.forEach(o=>{
+                    if (o._ri == 5 || o._dd && o._ri == 0) i++;
+                })
+                return i == wh;
             };
 
             let clickFn = (i) => {