From 1e42c2160f3397d79689fa8f9482f2c93b674527 Mon Sep 17 00:00:00 2001
From: adrien <adrien@malingrey.fr>
Date: Tue, 1 Oct 2024 11:35:41 +0200
Subject: [PATCH] textured mino edge

---
 images/edges.png   | Bin 0 -> 5075 bytes
 jsm/Tetrominoes.js |  34 ++++++++++++++++++++--------------
 2 files changed, 20 insertions(+), 14 deletions(-)
 create mode 100644 images/edges.png

diff --git a/images/edges.png b/images/edges.png
new file mode 100644
index 0000000000000000000000000000000000000000..da2cab71c9b0730919bd6c6dd0dbc9cd05ae594b
GIT binary patch
literal 5075
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
Z<~gU=UyI!{j{_%KSa76x+n5>i{{zv9V!QwV

literal 0
HcmV?d00001

diff --git a/jsm/Tetrominoes.js b/jsm/Tetrominoes.js
index d9d26e8..618c2db 100644
--- a/jsm/Tetrominoes.js
+++ b/jsm/Tetrominoes.js
@@ -20,7 +20,7 @@ const COLORS = {
     LOCKING: 0xffffff,
     GHOST: 0x99a9b2,
     EDGE: 0x88abe0,
-    RETRO: 0xffffff,
+    RETRO: 0xd0d4c1,
 }
 
 const TRANSLATION = {
@@ -92,15 +92,11 @@ class InstancedMino extends THREE.InstancedMesh {
 
     set theme(theme) {
         this._theme = theme
-        if(Mino.materials[theme]) Mino.meshes.material = Mino.materials[theme]
+        Mino.meshes.material = Mino.materials[theme]
         if (theme == "Rétro") {
-            this.geometry = Mino.retroGeometry
-            this.position.set(.5, .5, .5)
             this.resetColor()
             this.update = Mino.meshes.updateOffset
         } else {
-            this.geometry = Mino.geometry
-            this.position.set(0, 0, 0)
             this.update = Mino.meshes.updateColor
         }
     }
@@ -167,12 +163,13 @@ class Mino extends THREE.Object3D {
             opacity:   0.8,
             roughness: 0.1,
             metalness: 0.99,
-        })
+        }),
+        Rétro: [sideMaterial, sideMaterial, sideMaterial, sideMaterial, sideMaterial, sideMaterial]
     }
     static {
         new THREE.TextureLoader().load("images/sprites.png", (texture) => {
-            this.materials.Rétro = new TileMaterial({
-                color: 0xd0d4c1,
+            this.materials.Rétro[0] = this.materials.Rétro[2] = new TileMaterial({
+                color: COLORS.RETRO,
                 map: texture,
                 bumpMap: texture,
                 bumpScale: 2,
@@ -180,7 +177,17 @@ class Mino extends THREE.Object3D {
                 metalness: 0.8,
                 transparent: true,
             }, 8, 8)
-            if (this.meshes.theme == "Rétro") this.meshes.material = this.materials.Rétro
+        })
+        new THREE.TextureLoader().load("images/edges.png", (texture) => {
+            this.materials.Rétro[1] = this.materials.Rétro[3] =this.materials.Rétro[4] = this.materials.Rétro[4] = new TileMaterial({
+                color: COLORS.RETRO,
+                map: texture,
+                bumpMap: texture,
+                bumpScale: 2,
+                roughness: 0.25,
+                metalness: 0.8,
+                transparent: true,
+            }, 1, 1)
         })
     }
     static meshes
@@ -200,9 +207,8 @@ class Mino extends THREE.Object3D {
             bevelOffset: 0,
             bevelSegments: 1
         }
-        this.geometry = new THREE.ExtrudeGeometry(minoFaceShape, minoExtrudeSettings)
-        this.retroGeometry = new THREE.BoxGeometry()
-        this.meshes = new InstancedMino(this.geometry, this.materials.Plasma, 2*ROWS*COLUMNS)
+        const geometry = new THREE.ExtrudeGeometry(minoFaceShape, minoExtrudeSettings)
+        this.meshes = new InstancedMino(geometry, this.materials.Plasma, 2*ROWS*COLUMNS)
     }
 
     constructor(color, offset) {
@@ -498,7 +504,7 @@ class Playfield extends THREE.Group {
             texture.wrapT = THREE.RepeatWrapping
         })
         const retroEdgeMaterial = new THREE.MeshStandardMaterial({
-            color: 0xd0d4c1,
+            color: COLORS.RETRO,
             map: retroEdgeTexture,
             bumpMap: retroEdgeTexture,
             bumpScale: 0.3,