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

refactor into scene

Browse Source
This commit is contained in:
Adrien MALINGREY
2026-01-25 22:49:42 +01:00
parent 83801a792f
commit 17a87bf16f
3 changed files with 74 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
jsm/Menu.js
View File

@@ -4,7 +4,7 @@ import { environment } from './Tetrominoes.js'
export class Menu extends GUI {
constructor(game, settings, stats, scene, minoes, playfield) {
constructor(game, settings, stats, scene) {
super({title: "ᵀᴱTᴿᴬ"})
this.startButton = this.add(game, "start").name("Jouer").hide()
@@ -28,14 +28,6 @@ export class Menu extends GUI {
this.settings.add(settings, "theme", ["Plasma", "Espace", "Rétro"]).name("Thème").onChange(theme => {
scene.theme = theme
minoes.theme = theme
if (theme == "Rétro") {
playfield.edge.visible = false
playfield.retroEdge.visible = true
} else {
playfield.edge.visible = true
playfield.retroEdge.visible = false
}
if (dev) changeMaterial()
})
@@ -76,10 +68,14 @@ export class Menu extends GUI {
function changeMaterial() {
material?.destroy()
material = dev.addFolder("minoes material").close()
material.add(minoes.material, "constructor", ["MeshBasicMaterial", "MeshStandardMaterial", "MeshPhysicalMaterial"]).listen().onChange(type => {
material.add(scene.minoes.material, "constructor", [
"MeshBasicMaterial",
"MeshStandardMaterial",
"MeshPhysicalMaterial"
]).listen().onChange(type => {
switch(type) {
case "MeshBasicMaterial":
minoes.material = new THREE.MeshBasicMaterial({
scene.minoes.material = new THREE.MeshBasicMaterial({
envMap: environment,
side: THREE.DoubleSide,
transparent: true,
@@ -88,7 +84,7 @@ export class Menu extends GUI {
})
break
case "MeshStandardMaterial":
minoes.material = new THREE.MeshStandardMaterial({
scene.minoes.material = new THREE.MeshStandardMaterial({
envMap: environment,
side: THREE.DoubleSide,
transparent: true,
@@ -98,7 +94,7 @@ export class Menu extends GUI {
})
break
case "MeshPhysicalMaterial":
minoes.material = new THREE.MeshPhysicalMaterial({
scene.minoes.material = new THREE.MeshPhysicalMaterial({
envMap: environment,
side: THREE.DoubleSide,
transparent: true,
@@ -110,11 +106,11 @@ export class Menu extends GUI {
})
break
}
minoes.update = minoes.updateColor
scene.minoes.update = scene.minoes.updateColor
changeMaterial()
})
let minoMaterial = minoes.material instanceof Array ? minoes.material[0] : minoes.material
let minoMaterial = scene.minoes.material instanceof Array ? scene.minoes.material[0] : scene.minoes.material
if ("opacity" in minoMaterial) material.add(minoMaterial, "opacity" ).min(0).max(1)
if ("reflectivity" in minoMaterial) material.add(minoMaterial, "reflectivity" ).min(0).max(1)
if ("roughness" in minoMaterial) material.add(minoMaterial, "roughness" ).min(0).max(1)
@@ -155,7 +151,7 @@ export class Menu extends GUI {
vortex.add(scene.vortex.darkCylinder.material, "opacity").name("dark").min(0).max(1).listen()
vortex.add(scene.vortex.colorFullCylinder.material, "opacity").name("colorFull").min(0).max(1).listen()
changeMaterial(minoes.material.constructor.name)
changeMaterial(scene.minoes.material.constructor.name)
let fog = dev.addFolder("fog").close()
fog.add(scene.fog, "near", 0, 200)

37
jsm/TetraScene.js
View File

@@ -1,13 +1,30 @@
import * as THREE from 'three'
import CameraControls from './CameraControls.js'
import { Vortex } from './Vortex.js'
import { Playfield, InstancedMino } from './Tetrominoes.js'
export class TetraScene extends THREE.Scene {
constructor(settings, loadingManager) {
super()
this.renderer = new THREE.WebGLRenderer({
powerPreference: "high-performance",
antialias: true,
stencil: false
})
this.renderer.setSize(window.innerWidth, window.innerHeight)
this.renderer.setClearColor(0x000000, 10)
this.renderer.toneMapping = THREE.ACESFilmicToneMapping
this.renderer.toneMappingExposure = .8
this.renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2))
document.body.appendChild(this.renderer.domElement)
this.renderer.domElement.tabIndex = 1
this.camera = new THREE.PerspectiveCamera(100, window.innerWidth / window.innerHeight, 0.1, 1000)
this.camera.position.set(5, 16, 12)
this.camera.position.set(5, 15, 12)
this.controls = new CameraControls(this.camera, this.renderer.domElement)
this.vortex = new Vortex(loadingManager)
this.add(this.vortex)
@@ -43,6 +60,12 @@ export class TetraScene extends THREE.Scene {
this.hardDropSound.setBuffer(buffer)
}.bind(this))
this.playfield = new Playfield(loadingManager)
this.add(this.playfield)
this.minoes = new InstancedMino()
this.add(this.minoes)
this.theme = settings.theme
}
@@ -54,6 +77,8 @@ export class TetraScene extends THREE.Scene {
this.directionalLight.position.set(5, -20, 20)
this.music.src = "audio/benevolence.m4a"
this.fog.color.set(0xffffff)
this.playfield.edge.visible = true
this.playfield.retroEdge.visible = false
break
case "Espace":
this.ambientLight.intensity = 7
@@ -61,6 +86,8 @@ export class TetraScene extends THREE.Scene {
this.directionalLight.position.set(2, -3, 20)
this.music.src = "audio/benevolence.m4a"
this.fog.color.set(0x000000)
this.playfield.edge.visible = true
this.playfield.retroEdge.visible = false
break
case "Rétro":
this.ambientLight.intensity = 1
@@ -68,9 +95,12 @@ export class TetraScene extends THREE.Scene {
this.directionalLight.position.set(19, 120, 200)
this.music.src = "audio/Tetris_MkVaffQuasi_Ultimix_OC_ReMix.mp3"
this.fog.color.set(0x000000)
this.playfield.edge.visible = false
this.playfield.retroEdge.visible = true
break
}
this.vortex.theme = theme
this.minoes.theme = theme
}
get fogColor() {
@@ -81,6 +111,11 @@ export class TetraScene extends THREE.Scene {
}
update(delta) {
this.controls.update()
this.updateMatrixWorld()
this.vortex.update(delta)
this.playfield.update(delta)
this.minoes.update(delta)
this.renderer.render(this, this.camera)
}
}