adrien/teTra
adrien/teTra
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

textured mino edge

Browse Source
This commit is contained in:
Adrien MALINGREY 2024-10-01 11:35:41 +02:00
parent 74bf8521fb
commit 1e42c2160f
2 changed files with 20 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
images/edges.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

34
jsm/Tetrominoes.js
View File

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