material debug: fps :((
This commit is contained in:
parent
8279b1188f
commit
69b2b77fe9
3
app.js
3
app.js
@ -43,7 +43,6 @@ let game = {
|
||||
|
||||
renderer.domElement.tabIndex = 1
|
||||
gui.domElement.tabIndex = 1
|
||||
gui.domElement.onfocus = game.pause
|
||||
|
||||
nextQueue.init()
|
||||
|
||||
@ -55,7 +54,7 @@ let game = {
|
||||
document.onkeydown = onkeydown
|
||||
document.onkeyup = onkeyup
|
||||
window.onblur = game.pause
|
||||
gui.domElement.onfocus = game.pause
|
||||
if (!gui.debug) gui.domElement.onfocus = game.pause
|
||||
|
||||
document.body.classList.remove("pause")
|
||||
gui.resumeButton.hide()
|
||||
|
||||
BIN
audio/Tetris_T-Spin_OC_ReMix.mp3
Normal file
BIN
audio/Tetris_T-Spin_OC_ReMix.mp3
Normal file
Binary file not shown.
143
jsm/TetraGUI.js
143
jsm/TetraGUI.js
@ -1,7 +1,7 @@
|
||||
import * as THREE from 'three'
|
||||
import { GUI } from 'three/addons/libs/lil-gui.module.min.js'
|
||||
import * as FPS from 'three/addons/libs/stats.module.js'
|
||||
import { I, J, L, O, S, T, Z } from './gamelogic.js'
|
||||
import { COLORS, environnement, I, J, L, O, S, T, Z } from './gamelogic.js'
|
||||
|
||||
|
||||
class TetraGUI extends GUI {
|
||||
@ -126,32 +126,145 @@ class TetraGUI extends GUI {
|
||||
scene.hardDropSound.setVolume(volume/100)
|
||||
})
|
||||
|
||||
if (window.location.search.includes("debug")) {
|
||||
this.debug = window.location.search.includes("debug")
|
||||
if (this.debug) {
|
||||
this.debug = this.addFolder("debug")
|
||||
let cameraPosition = this.debug.addFolder("camera.position")
|
||||
let cameraPosition = this.debug.addFolder("camera.position").close()
|
||||
cameraPosition.add(scene.camera.position, "x")
|
||||
cameraPosition.add(scene.camera.position, "y")
|
||||
cameraPosition.add(scene.camera.position, "z")
|
||||
|
||||
let directionalLightPosition = this.debug.addFolder("directionalLight.position")
|
||||
let directionalLightPosition = this.debug.addFolder("directionalLight.position").close()
|
||||
directionalLightPosition.add(scene.directionalLight.position, "x")
|
||||
directionalLightPosition.add(scene.directionalLight.position, "y")
|
||||
directionalLightPosition.add(scene.directionalLight.position, "z")
|
||||
|
||||
let light = this.debug.addFolder("lights intensity")
|
||||
let light = this.debug.addFolder("lights intensity").close()
|
||||
light.add(scene.ambientLight, "intensity").name("ambient").min(0).max(20)
|
||||
light.add(scene.directionalLight, "intensity").name("directional").min(0).max(20)
|
||||
|
||||
let materials = this.debug.addFolder("materials opacity")
|
||||
materials.add(scene.vortex.darkCylinder.material, "opacity").name("dark").min(0).max(1)
|
||||
materials.add(scene.vortex.colorFullCylinder.material, "opacity").name("colorFull").min(0).max(1)
|
||||
materials.add(I.prototype.material, "reflectivity").min(0).max(2).onChange(() => {
|
||||
J.prototype.material.reflectivity = I.prototype.material.reflectivity
|
||||
L.prototype.material.reflectivity = I.prototype.material.reflectivity
|
||||
O.prototype.material.reflectivity = I.prototype.material.reflectivity
|
||||
S.prototype.material.reflectivity = I.prototype.material.reflectivity
|
||||
T.prototype.material.reflectivity = I.prototype.material.reflectivity
|
||||
Z.prototype.material.reflectivity = I.prototype.material.reflectivity
|
||||
let vortex = this.debug.addFolder("vortex opacity").close()
|
||||
vortex.add(scene.vortex.darkCylinder.material, "opacity").name("dark").min(0).max(1)
|
||||
vortex.add(scene.vortex.colorFullCylinder.material, "opacity").name("colorFull").min(0).max(1)
|
||||
|
||||
let materialParams = {
|
||||
type: "MeshBasicMaterial",
|
||||
opacity: 0.95,
|
||||
reflectivity: 0.8,
|
||||
roughness: 0.1,
|
||||
metalness: 0.5,
|
||||
attenuationDistance: 0.5,
|
||||
ior: 2,
|
||||
sheen: 0,
|
||||
sheenRoughness: 1,
|
||||
specularIntensity: 1,
|
||||
thickness: 5,
|
||||
transmission: 1,
|
||||
}
|
||||
let material = this.debug.addFolder("minoes material").close()
|
||||
let type = material.add(materialParams, "type", ["MeshBasicMaterial", "MeshStandardMaterial", "MeshPhysicalMaterial"])
|
||||
let opacity = material.add(materialParams, "opacity").min(0).max(1)
|
||||
let reflectivity = material.add(materialParams, "reflectivity").min(0).max(1)
|
||||
let roughness = material.add(materialParams, "roughness").min(0).max(1).hide()
|
||||
let metalness = material.add(materialParams, "metalness").min(0).max(1).hide()
|
||||
let attenuationDistance = material.add(materialParams, "attenuationDistance").min(0).max(1).hide()
|
||||
let ior = material.add(materialParams, "ior").min(1).max(2).hide()
|
||||
let sheen = material.add(materialParams, "sheen").min(0).max(1).hide()
|
||||
let sheenRoughness = material.add(materialParams, "sheenRoughness").min(0).max(1).hide()
|
||||
let specularIntensity = material.add(materialParams, "specularIntensity").min(0).max(1).hide()
|
||||
let thickness = material.add(materialParams, "thickness").min(0).max(5).hide()
|
||||
let transmission = material.add(materialParams, "transmission").min(0).max(1).hide()
|
||||
type.onChange(type => {
|
||||
switch(type) {
|
||||
case "MeshBasicMaterial":
|
||||
reflectivity.show()
|
||||
roughness.hide()
|
||||
metalness.hide()
|
||||
attenuationDistance.hide()
|
||||
ior.hide()
|
||||
sheen.hide()
|
||||
sheenRoughness.hide()
|
||||
specularIntensity.hide()
|
||||
thickness.hide()
|
||||
transmission.hide()
|
||||
break
|
||||
case "MeshStandardMaterial":
|
||||
reflectivity.hide()
|
||||
roughness.show()
|
||||
metalness.show()
|
||||
attenuationDistance.hide()
|
||||
ior.hide()
|
||||
sheen.hide()
|
||||
sheenRoughness.hide()
|
||||
specularIntensity.hide()
|
||||
thickness.hide()
|
||||
transmission.hide()
|
||||
break
|
||||
case "MeshPhysicalMaterial":
|
||||
reflectivity.hide()
|
||||
roughness.show()
|
||||
metalness.show()
|
||||
attenuationDistance.show()
|
||||
ior.show()
|
||||
sheen.show()
|
||||
sheenRoughness.show()
|
||||
specularIntensity.show()
|
||||
thickness.show()
|
||||
transmission.show()
|
||||
break
|
||||
}
|
||||
})
|
||||
material.onChange(() => {
|
||||
let minoMaterialFactory
|
||||
switch(materialParams.type) {
|
||||
case "MeshBasicMaterial":
|
||||
minoMaterialFactory = color => new THREE.MeshBasicMaterial({
|
||||
color : color,
|
||||
envMap : environnement,
|
||||
reflectivity: materialParams.reflectivity,
|
||||
transparent : true,
|
||||
opacity : materialParams.opacity,
|
||||
side : THREE.DoubleSide,
|
||||
})
|
||||
break
|
||||
case "MeshStandardMaterial":
|
||||
minoMaterialFactory = color => new THREE.MeshStandardMaterial({
|
||||
color : color,
|
||||
envMap : environnement,
|
||||
transparent: true,
|
||||
opacity : materialParams.opacity,
|
||||
side : THREE.DoubleSide,
|
||||
roughness : materialParams.roughness,
|
||||
metalness : materialParams.metalness,
|
||||
})
|
||||
break
|
||||
case "MeshPhysicalMaterial":
|
||||
minoMaterialFactory = color => new THREE.MeshStandardMaterial({
|
||||
color : "white",
|
||||
envMap : environnement,
|
||||
transparent : true,
|
||||
opacity : materialParams.opacity,
|
||||
side : THREE.DoubleSide,
|
||||
roughness : materialParams.roughness,
|
||||
metalness : materialParams.metalness,
|
||||
attenuationColor : color,
|
||||
attenuationDistance: materialParams.attenuationDistance,
|
||||
ior : materialParams.ior,
|
||||
sheen : materialParams.sheen,
|
||||
sheenRoughness : materialParams.sheenRoughness,
|
||||
specularIntensity : materialParams.specularIntensity,
|
||||
thickness : materialParams.thickness,
|
||||
transmission : materialParams.transmission,
|
||||
})
|
||||
break
|
||||
}
|
||||
I.prototype.material = minoMaterialFactory(COLORS.I)
|
||||
J.prototype.material = minoMaterialFactory(COLORS.J)
|
||||
L.prototype.material = minoMaterialFactory(COLORS.L)
|
||||
O.prototype.material = minoMaterialFactory(COLORS.O)
|
||||
S.prototype.material = minoMaterialFactory(COLORS.S)
|
||||
T.prototype.material = minoMaterialFactory(COLORS.T)
|
||||
Z.prototype.material = minoMaterialFactory(COLORS.Z)
|
||||
})
|
||||
|
||||
this.fps = new FPS.default()
|
||||
|
||||
@ -16,7 +16,7 @@ class TetraScene extends THREE.Scene {
|
||||
this.add(this.ambientLight)
|
||||
|
||||
this.directionalLight = new THREE.DirectionalLight(0xffffff, 20)
|
||||
this.directionalLight.position.set(5, 100, -10)
|
||||
this.directionalLight.position.set(5, -9, -20)
|
||||
this.add(this.directionalLight)
|
||||
|
||||
|
||||
@ -27,7 +27,7 @@ class TetraScene extends THREE.Scene {
|
||||
const audioLoader = new THREE.AudioLoader(loadingManager)
|
||||
|
||||
this.music = new THREE.Audio(listener)
|
||||
audioLoader.load('audio/Tetris_CheDDer_OC_ReMix.mp3', function( buffer ) {
|
||||
audioLoader.load('audio/Tetris_T-Spin_OC_ReMix.mp3', function( buffer ) {
|
||||
this.music.setBuffer(buffer)
|
||||
this.music.setLoop(true)
|
||||
this.music.setVolume(settings.musicVolume/100)
|
||||
|
||||
@ -89,7 +89,7 @@ class MinoMaterial extends THREE.MeshBasicMaterial {
|
||||
super({
|
||||
color: color,
|
||||
envMap: environnement,
|
||||
reflectivity: 0.95,
|
||||
reflectivity: 0.9,
|
||||
transparent: true,
|
||||
opacity: 0.95,
|
||||
side: THREE.DoubleSide,
|
||||
@ -499,4 +499,4 @@ class NextQueue extends THREE.Group {
|
||||
NextQueue.prototype.positions = [P(0, 0), P(0, -3), P(0, -6), P(0, -9), P(0, -12), P(0, -15), P(0, -18)]
|
||||
|
||||
|
||||
export { T_SPIN, FACING, TRANSLATION, ROTATION, environnement, Tetromino, I, J, L, O, S, T, Z, Matrix, HoldQueue, NextQueue }
|
||||
export { T_SPIN, FACING, TRANSLATION, ROTATION, COLORS, environnement, Tetromino, I, J, L, O, S, T, Z, Matrix, HoldQueue, NextQueue }
|
||||
Loading…
x
Reference in New Issue
Block a user