From 5b058a58b3829ae4d9768b335e5bb3ea52c5b2b8 Mon Sep 17 00:00:00 2001 From: adrien Date: Wed, 2 Oct 2024 22:38:37 +0200 Subject: [PATCH] load mino retro texture if needed --- jsm/Menu.js | 1 - jsm/Tetrominoes.js | 62 ++++++++++++++++++++++------------------------ 2 files changed, 30 insertions(+), 33 deletions(-) diff --git a/jsm/Menu.js b/jsm/Menu.js index e45f19f..c645df8 100644 --- a/jsm/Menu.js +++ b/jsm/Menu.js @@ -114,7 +114,6 @@ export class Menu extends GUI { Mino.meshes.update = Mino.meshes.updateColor changeMaterial() }) - console.log("lnlnl") let minoMaterial = Mino.meshes.material instanceof Array ? Mino.meshes.material[0] : Mino.meshes.material if ("opacity" in minoMaterial) material.add(minoMaterial, "opacity" ).min(0).max(1) diff --git a/jsm/Tetrominoes.js b/jsm/Tetrominoes.js index 8a489e9..b7fc47a 100644 --- a/jsm/Tetrominoes.js +++ b/jsm/Tetrominoes.js @@ -91,20 +91,43 @@ class InstancedMino extends THREE.InstancedMesh { } set theme(theme) { - this._theme = theme - this.material = Mino.materials[theme] if (theme == "Rétro") { this.resetColor() this.update = this.updateOffset + if (Mino.materials["Rétro"]) { + this.material = Mino.materials["Rétro"] + } else { + Mino.materials["Rétro"] = [] + const loadingManager = new THREE.LoadingManager(() => InstancedMino.material = Mino.materials["Rétro"]) + new THREE.TextureLoader(loadingManager).load("images/sprites.png", (texture) => { + Mino.materials.Rétro[0] = Mino.materials.Rétro[2] = new TileMaterial({ + color: COLORS.RETRO, + map: texture, + bumpMap: texture, + bumpScale: 1.5, + roughness: 0.25, + metalness: 0.9, + transparent: true, + }, 8, 8) + }) + new THREE.TextureLoader(loadingManager).load("images/edges.png", (texture) => { + Mino.materials.Rétro[1] = Mino.materials.Rétro[3] = Mino.materials.Rétro[4] = Mino.materials.Rétro[5] = new TileMaterial({ + color: COLORS.RETRO, + map: texture, + bumpMap: texture, + bumpScale: 1.5, + roughness: 0.25, + metalness: 0.9, + transparent: true, + }, 1, 1) + }) + } } else { this.update = this.updateColor + this.material = Mino.materials[theme] } } - get theme() { - return this._theme - } - setOffsetAt(index, offset) { this.offsets[2*index] = offset.x this.offsets[2*index + 1] = offset.y @@ -163,31 +186,6 @@ 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[0] = this.materials.Rétro[2] = new TileMaterial({ - color: COLORS.RETRO, - map: texture, - bumpMap: texture, - bumpScale: 1.5, - roughness: 0.25, - metalness: 0.9, - transparent: true, - }, 8, 8) - }) - 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: 1.5, - roughness: 0.25, - metalness: 0.9, - transparent: true, - }, 1, 1) }) } static meshes @@ -208,7 +206,7 @@ class Mino extends THREE.Object3D { bevelSegments: 1 } const geometry = new THREE.ExtrudeGeometry(minoFaceShape, minoExtrudeSettings) - this.meshes = new InstancedMino(geometry, this.materials.Plasma, 2*ROWS*COLUMNS) + this.meshes = new InstancedMino(geometry, undefined, 2*ROWS*COLUMNS) } constructor(color, offset) {