edge and ghost material
This commit is contained in:
parent
b516de1b2f
commit
6f0a540bb3
@ -55,8 +55,8 @@ export class TetraGUI extends GUI {
|
||||
scene.vortex.colorFullTextureRotation = 0.006
|
||||
scene.vortex.colorFullMoveForward = 0.013
|
||||
|
||||
scene.ambientLight.intensity = 0.5
|
||||
scene.directionalLight.intensity = 6
|
||||
scene.ambientLight.intensity = 1
|
||||
scene.directionalLight.intensity = 5
|
||||
}
|
||||
break
|
||||
case "Espace":
|
||||
@ -142,28 +142,23 @@ export class TetraGUI extends GUI {
|
||||
directionalLightPosition.add(scene.directionalLight.position, "x")
|
||||
directionalLightPosition.add(scene.directionalLight.position, "y")
|
||||
directionalLightPosition.add(scene.directionalLight.position, "z")
|
||||
|
||||
let directionalLightTargetPosition = this.debug.addFolder("directionalLight.target").close()
|
||||
directionalLightTargetPosition.add(scene.directionalLight.target.position, "x")
|
||||
directionalLightTargetPosition.add(scene.directionalLight.target.position, "y")
|
||||
directionalLightTargetPosition.add(scene.directionalLight.target.position, "z")
|
||||
|
||||
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 material = this.debug.addFolder("minoes material").close()
|
||||
material.add(minoMaterial, "opacity").min(0).max(1)
|
||||
//material.add(minoMaterial, "reflectivity").min(0).max(1)
|
||||
material.add(minoMaterial, "roughness").min(0).max(1)
|
||||
material.add(minoMaterial, "metalness").min(0).max(1)
|
||||
//material.add(minoMaterial, "attenuationDistance").min(0).max(1).hide()
|
||||
//material.add(minoMaterial, "ior").min(1).max(2).hide()
|
||||
//material.add(minoMaterial, "sheen").min(0).max(1).hide()
|
||||
//material.add(minoMaterial, "sheenRoughness").min(0).max(1).hide()
|
||||
//material.add(minoMaterial, "specularIntensity").min(0).max(1).hide()
|
||||
//material.add(minoMaterial, "thickness").min(0).max(5).hide()
|
||||
//material.add(minoMaterial, "transmission").min(0).max(1).hide()
|
||||
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)
|
||||
if ("metalness" in minoMaterial) material.add(minoMaterial, "metalness").min(0).max(1)
|
||||
if ("attenuationDistance" in minoMaterial) material.add(minoMaterial, "attenuationDistance").min(0).max(1)
|
||||
if ("ior" in minoMaterial) material.add(minoMaterial, "ior").min(1).max(2)
|
||||
if ("sheen" in minoMaterial) material.add(minoMaterial, "sheen").min(0).max(1)
|
||||
if ("sheenRoughness" in minoMaterial) material.add(minoMaterial, "sheenRoughness").min(0).max(1)
|
||||
if ("specularIntensity" in minoMaterial) material.add(minoMaterial, "specularIntensity").min(0).max(1)
|
||||
if ("thickness" in minoMaterial) material.add(minoMaterial, "thickness").min(0).max(5)
|
||||
if ("transmission" in minoMaterial) material.add(minoMaterial, "transmission").min(0).max(1)
|
||||
|
||||
this.fps = new FPS.default()
|
||||
document.body.appendChild(this.fps.dom)
|
||||
|
@ -12,15 +12,12 @@ export class TetraScene extends THREE.Scene {
|
||||
this.vortex = new Vortex(loadingManager)
|
||||
this.add(this.vortex)
|
||||
|
||||
this.ambientLight = new THREE.AmbientLight(0xffffff, 0.5)
|
||||
this.ambientLight = new THREE.AmbientLight(0xffffff, 1)
|
||||
this.add(this.ambientLight)
|
||||
|
||||
this.directionalLight = new THREE.DirectionalLight(0xffffff, 6)
|
||||
this.directionalLight.position.set(5, -100, -20)
|
||||
this.directionalLight = new THREE.DirectionalLight(0xffffff, 5)
|
||||
this.directionalLight.position.set(5, 40, 20)
|
||||
this.add(this.directionalLight)
|
||||
this.directionalLight.target = new THREE.Object3D()
|
||||
this.directionalLight.target.position.set(5, 0, 0)
|
||||
this.add(this.directionalLight.target)
|
||||
|
||||
|
||||
/* Sounds */
|
||||
|
@ -6,7 +6,7 @@ Array.prototype.pick = function () { return this.splice(Math.floor(Math.random()
|
||||
|
||||
let P = (x, y, z = 0) => new THREE.Vector3(x, y, z)
|
||||
|
||||
const GRAVITY = -20
|
||||
const GRAVITY = -30
|
||||
|
||||
const COLORS = {
|
||||
I: 0xafeff9,
|
||||
@ -17,7 +17,8 @@ const COLORS = {
|
||||
T: 0xedb2ff,
|
||||
Z: 0xffb8c5,
|
||||
LOCKING: "white",
|
||||
GHOST: "white",
|
||||
GHOST: 0xc0c0c0,
|
||||
EDGE: 0x88abe0
|
||||
}
|
||||
|
||||
const TRANSLATION = {
|
||||
@ -47,6 +48,11 @@ const FACING = {
|
||||
}
|
||||
|
||||
|
||||
const ROWS = 24
|
||||
const SKYLINE = 20
|
||||
const COLUMNS = 10
|
||||
|
||||
|
||||
const envRenderTarget = new THREE.WebGLCubeRenderTarget(256)
|
||||
const environnement = envRenderTarget.texture
|
||||
environnement.type = THREE.HalfFloatType
|
||||
@ -120,7 +126,7 @@ class Mino extends THREE.Object3D {
|
||||
this.rotateOnWorldAxis(this.rotationAngle, delta * this.angularVelocity)
|
||||
this.updateMatrix()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
class Tetromino extends THREE.InstancedMesh {
|
||||
@ -211,13 +217,6 @@ class Tetromino extends THREE.InstancedMesh {
|
||||
get tSpin() {
|
||||
return T_SPIN.NONE
|
||||
}
|
||||
|
||||
copy(piece) {
|
||||
this.position.copy(piece.position)
|
||||
this.minoesPosition = piece.minoesPosition
|
||||
this.facing = piece.facing
|
||||
while (this.canMove(TRANSLATION.DOWN)) this.position.y--
|
||||
}
|
||||
}
|
||||
Tetromino.prototype.minoMaterial = minoMaterial
|
||||
Tetromino.prototype.lockingColor = new THREE.Color(COLORS.LOCKING)
|
||||
@ -232,14 +231,23 @@ Tetromino.prototype.srs = [
|
||||
Tetromino.prototype.lockDelay = 500
|
||||
|
||||
|
||||
class Ghost extends Tetromino {}
|
||||
Ghost.prototype.minoMaterial = new THREE.MeshBasicMaterial({
|
||||
class Ghost extends Tetromino {
|
||||
|
||||
copy(piece) {
|
||||
this.position.copy(piece.position)
|
||||
this.minoesPosition = piece.minoesPosition
|
||||
this.facing = piece.facing
|
||||
while (this.canMove(TRANSLATION.DOWN)) this.position.y--
|
||||
}
|
||||
|
||||
}
|
||||
/*Ghost.prototype.minoMaterial = new THREE.MeshBasicMaterial({
|
||||
envMap: environnement,
|
||||
reflectivity: 0.9,
|
||||
transparent: true,
|
||||
opacity: 0.15,
|
||||
side: THREE.DoubleSide,
|
||||
})
|
||||
})*/
|
||||
Ghost.prototype.freeColor = new THREE.Color(COLORS.GHOST)
|
||||
Ghost.prototype.minoesPosition = [
|
||||
[P(0, 0, 0), P(0, 0, 0), P(0, 0, 0), P(0, 0, 0)],
|
||||
@ -334,23 +342,18 @@ Z.prototype.minoesPosition = [
|
||||
Z.prototype.freeColor = new THREE.Color(COLORS.Z)
|
||||
|
||||
|
||||
const ROWS = 24
|
||||
const SKYLINE = 20
|
||||
const COLUMNS = 10
|
||||
|
||||
|
||||
class Playfield extends THREE.Group {
|
||||
constructor() {
|
||||
super()
|
||||
this.visible = false
|
||||
|
||||
const edgeMaterial = new THREE.MeshBasicMaterial({
|
||||
color: 0x88abe0,
|
||||
const edgeMaterial = new THREE.MeshStandardMaterial({
|
||||
color: COLORS.EDGE,
|
||||
envMap: environnement,
|
||||
transparent: true,
|
||||
opacity: 0.4,
|
||||
reflectivity: 0.9,
|
||||
refractionRatio: 0.5
|
||||
opacity: 0.2,
|
||||
roughness: 0.1,
|
||||
metallness: 0.9,
|
||||
})
|
||||
const edgeShape = new THREE.Shape()
|
||||
.moveTo(-.3, SKYLINE)
|
||||
@ -410,7 +413,7 @@ class Playfield extends THREE.Group {
|
||||
if (piece) {
|
||||
this.add(piece)
|
||||
piece.position.set(4, SKYLINE)
|
||||
this.ghost.color = piece.freeColor
|
||||
//this.ghost.color = piece.freeColor
|
||||
this.ghost.copy(piece)
|
||||
this.ghost.visible = true
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user