Skip to content

Commit 2331baf

Browse files
ProcStackProcStack
committed
Instance Sizing & Rebuild FieldEnv
-Instance-to-Meshes can have `MaxScale` and `MinScale` -Use vertex attribute `color.r` to drive your 0-1% instance scale -If `MinScale` & `MaxScale` set as user detail parameters in CGI program, will fit your `color.r` to that min-max range for Instance scale -Enums has render order `RENDER_LAYER` Enum now -Updated geo, textures, vertex colors -Updated pxlNav "vapor" sky shader -Better fox mixing in FieldEnv, needs to be adopted pxlNav wide
1 parent a762901 commit 2331baf

31 files changed

+1357
-120
lines changed

‎Public/images/ProcStack_sm.png‎

-44.9 KB
Binary file not shown.

‎Public/images/ProcStack_th.png‎

-802 KB
Binary file not shown.

‎Public/images/pxlNav_FieldEnv.jpg‎

211 KB
Loading

‎Source/js/pxlNav.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,8 +144,10 @@ class pxlNav{
144144
pxlRoomRoot = options["pxlRoomRoot"];
145145
}
146146

147-
// Option Checks & Defaults
147+
// Enums object
148+
this.pxlEnums = pxlEnums;
148149

150+
// Option Checks & Defaults
149151
this.options = {
150152
loadList : ["Cloud3d", "SoftNoise", "SmoothNoise", "WarpAnimTexture"],
151153
// TODO : Get these to be pxlNav options pre-boot

‎Source/js/pxlNav/Environment.js‎

Lines changed: 11 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,7 @@ export class Environment{
106106
this.currentAudioZone=0;
107107

108108
this.pxlUtils=null;
109+
this.pxlEnums=null;
109110
this.pxlTimer=null;
110111
this.pxlAnim=null;
111112
this.pxlColliders=null;
@@ -121,13 +122,6 @@ export class Environment{
121122
this.pxlGuiDraws=null;
122123

123124

124-
this.renderLayerEnum = {
125-
"SCENE": 0,
126-
"PARTICLES": 1,
127-
"GLOW": 2,
128-
"SKY": 3
129-
}
130-
131125
this.cloud3dTexture=null;
132126
this.softNoiseTexture=null;
133127
this.detailNoiseTexture=null;
@@ -270,6 +264,7 @@ export class Environment{
270264
setDependencies( pxlNav ){
271265
this.scene=pxlNav.scene;
272266
this.pxlUtils=pxlNav.pxlUtils;
267+
this.pxlEnums=pxlNav.pxlEnums;
273268
this.pxlTimer=pxlNav.pxlTimer;
274269
this.pxlAnim=pxlNav.pxlAnim;
275270
this.pxlColliders=pxlNav.pxlColliders;
@@ -1565,13 +1560,12 @@ export class Environment{
15651560
let curRoom=this.roomSceneList[this.currentRoom];
15661561
if(curRoom && curRoom.booted){
15671562
curRoom.step();
1568-
1569-
curRoom.camera.layers.disable( this.renderLayerEnum.SKY );
1563+
curRoom.camera.layers.disable( this.pxlEnums.RENDER_LAYER.SKY );
15701564
this.engine.setRenderTarget(curRoom.scene.renderTarget);
15711565
this.engine.clear();
15721566
this.engine.render( curRoom.scene, curRoom.camera);
15731567
this.engine.setRenderTarget(null);
1574-
curRoom.camera.layers.enable( this.renderLayerEnum.SKY );
1568+
curRoom.camera.layers.enable( this.pxlEnums.RENDER_LAYER.SKY );
15751569

15761570
if( false && this.pxlQuality.settings.fog>0 ){
15771571
this.pxlCamera.camera.layers.disable( 1 );
@@ -1628,10 +1622,10 @@ export class Environment{
16281622
}
16291623
}
16301624

1631-
//this.pxlEnv.renderLayerEnum SCENE PARTICLES GLOW
1632-
camera.layers.disable( this.renderLayerEnum.SCENE );
1633-
camera.layers.disable( this.renderLayerEnum.PARTICLES );
1634-
camera.layers.disable( this.renderLayerEnum.SKY );
1625+
//this.pxlEnv.pxlEnums.RENDER_LAYER SCENE PARTICLES GLOW
1626+
camera.layers.disable( this.pxlEnums.RENDER_LAYER.SCENE );
1627+
camera.layers.disable( this.pxlEnums.RENDER_LAYER.PARTICLES );
1628+
camera.layers.disable( this.pxlEnums.RENDER_LAYER.SKY );
16351629

16361630
this.engine.setRenderTarget(target);
16371631
let bgCd=0x000000;
@@ -1645,9 +1639,9 @@ export class Environment{
16451639
scene.background.g=curgb.g;
16461640
scene.background.b=curgb.b;
16471641

1648-
camera.layers.enable( this.renderLayerEnum.SCENE );
1649-
camera.layers.enable( this.renderLayerEnum.PARTICLES );
1650-
camera.layers.enable( this.renderLayerEnum.SKY );
1642+
camera.layers.enable( this.pxlEnums.RENDER_LAYER.SCENE );
1643+
camera.layers.enable( this.pxlEnums.RENDER_LAYER.PARTICLES );
1644+
camera.layers.enable( this.pxlEnums.RENDER_LAYER.SKY );
16511645
this.engine.setRenderTarget(null);
16521646

16531647
if(curRoom.geoList["GlowPass"]){

‎Source/js/pxlNav/RoomClass.js‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ import {
3232
} from "../libs/three/three.module.min.js";
3333
import { pxlPrincipledVert, pxlPrincipledFrag } from "./shaders/objects/PxlPrincipled.js";
3434

35-
import { COLLIDER_TYPE } from "./core/Enums.js";
35+
import { RENDER_LAYER, COLLIDER_TYPE } from "./core/Enums.js";
3636

3737
class RoomEnvironment{
3838
constructor( roomName='CampfireEnvironment', assetPath=null, msRunner=null, camera=null, scene=null, cloud3dTexture=null ){
@@ -604,9 +604,9 @@ class RoomEnvironment{
604604

605605
if(this.geoList.hasOwnProperty('GlowPass') && this.geoList['GlowPass'].length > 0){
606606
this.geoList['GlowPass'].forEach((g)=>{
607-
//g.layers.set( this.pxlEnv.renderLayerEnum.SCENE )
608-
//g.layers.toggle( this.pxlEnv.renderLayerEnum.GLOW )
609-
g.layers.set( this.pxlEnv.renderLayerEnum.GLOW )
607+
//g.layers.set( RENDER_LAYER.SCENE )
608+
//g.layers.toggle( RENDER_LAYER.GLOW )
609+
g.layers.set( RENDER_LAYER.GLOW )
610610
})
611611
}
612612

‎Source/js/pxlNav/core/Colliders.js‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,7 @@ import { VERBOSE_LEVEL, COLLIDER_TYPE, GEOMETRY_SIDE } from "./Enums.js";
8383
export class Colliders{
8484
constructor( verbose=false, hashGridSizing = 100, colliderBoundsReference = 500.0 ){
8585
this.pxlEnv = null;
86+
this.pxlUtils = null;
8687
this.verbose = verbose;
8788

8889
this.delimiter = ',';
@@ -105,6 +106,7 @@ export class Colliders{
105106
}
106107
setDependencies( pxlEnv ){
107108
this.pxlEnv = pxlEnv;
109+
this.pxlUtils = pxlEnv.pxlUtils;
108110
}
109111
log( msg ){
110112
if( this.verbose >= VERBOSE_LEVEL.INFO ){
@@ -495,14 +497,9 @@ export class Colliders{
495497

496498
// Flatten Vector3 to a string
497499
flattenVector3( vec ){
498-
return this.getGridKey( this.toNearestStr(vec.x), this.toNearestStr(vec.y), this.toNearestStr(vec.z) );
500+
return this.getGridKey( this.pxlUtils.toNearestStr(vec.x), this.pxlUtils.toNearestStr(vec.y), this.pxlUtils.toNearestStr(vec.z) );
499501
}
500502

501-
// Round to nearest
502-
toNearestStr( val, precision=1 ){
503-
let retVal = val.toFixed(precision);
504-
return retVal;
505-
}
506503

507504
// -- -- --
508505

‎Source/js/pxlNav/core/Enums.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,15 @@ export const ANTI_ALIASING = {
2121
'HIGH' : 3
2222
};
2323

24+
// Render Order Layers
25+
export const RENDER_LAYER = {
26+
"SKY": 0,
27+
"SCENE": 1,
28+
"PARTICLES": 2,
29+
"GLOW": 3
30+
}
31+
32+
2433
// Sky Haze settings should be passed through the pxlNav.Options
2534
export const SKY_HAZE = {
2635
'OFF' : 0,
@@ -115,6 +124,7 @@ export const COLOR_SHIFT = {
115124
export const pxlEnums = {
116125
'VERBOSE_LEVEL' : VERBOSE_LEVEL,
117126
'ANTI_ALIASING' : ANTI_ALIASING,
127+
'RENDER_LAYER' : RENDER_LAYER,
118128
'SKY_HAZE' : SKY_HAZE,
119129
'SHADOW_MAP' : SHADOW_MAP,
120130
'CAMERA_EVENT' : CAMERA_EVENT,

‎Source/js/pxlNav/core/FileIO.js‎

Lines changed: 45 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,12 @@ import {
2323
} from "../../libs/three/three.module.min.js";
2424
import { FBXLoader } from "../../libs/three/FBXLoader.js";
2525

26-
import { COLLIDER_TYPE, COLOR_SHIFT } from "./Enums.js";
27-
2826
export class FileIO{
2927
constructor( folderDict={}){
3028
this.pxlTimer=null;
3129
this.pxlUtils=null;
3230
this.pxlQuality=null;
31+
this.pxlEnums=null;
3332
this.pxlVideo=null;
3433
this.pxlCamera=null;
3534
this.pxlAutoCam=null;
@@ -62,6 +61,7 @@ export class FileIO{
6261
this.pxlTimer=pxlNav.pxlTimer;
6362
this.pxlUtils=pxlNav.pxlUtils;
6463
this.pxlQuality=pxlNav.pxlQuality;
64+
this.pxlEnums=pxlNav.pxlEnums;
6565
this.pxlVideo=pxlNav.pxlVideo;
6666
this.pxlCamera=pxlNav.pxlCamera;
6767
this.pxlAutoCam=pxlNav.pxlAutoCam;
@@ -101,7 +101,7 @@ export class FileIO{
101101

102102
// -- -- --
103103

104-
convertVertColor( meshObj, space=COLOR_SHIFT.KEEP ){
104+
convertVertColor( meshObj, space=this.pxlEnums.COLOR_SHIFT.KEEP ){
105105
if (meshObj.geometry && meshObj.geometry.attributes && meshObj.geometry.attributes.color) {
106106
let colors = meshObj.geometry.attributes.color;
107107
for( let x=0; x<colors.count; ++x ){
@@ -364,12 +364,26 @@ export class FileIO{
364364
let instBase= envObj.baseInstancesList[ mesh.userData.Instance ];
365365

366366
if( mesh.type == "Mesh" ){
367-
const matrix = new Matrix4();
368-
const position = new Vector3();
369-
const normal = new Vector3();
370-
const quaternion = new Quaternion();
371-
const scale = new Vector3(1, 1, 1);
367+
let matrix = new Matrix4();
368+
let position = new Vector3();
369+
let normal = new Vector3();
370+
let quaternion = new Quaternion();
371+
let scale = new Vector3(1, 1, 1);
372372
const hasColor = mesh.geometry.attributes.hasOwnProperty("color");
373+
let userDataKeys = Object.keys( mesh.userData );
374+
let userDataKeysLower = userDataKeys.map( (c)=> c.toLowerCase() );
375+
376+
let hasFitScale = false;
377+
let minScale = 0;
378+
let maxScale = 1;
379+
if( userDataKeysLower.includes("minscale") ){
380+
hasFitScale = true;
381+
minScale = mesh.userData[ userDataKeys[ userDataKeysLower.indexOf("minscale") ] ];
382+
}
383+
if( userDataKeysLower.includes("maxscale") ){
384+
hasFitScale = true;
385+
maxScale = mesh.userData[ userDataKeys[ userDataKeysLower.indexOf("maxscale") ] ];
386+
}
373387

374388
// Prevent dupelicate instances
375389
// Verts are split, so neighboring polygons have stacked vertices
@@ -379,15 +393,22 @@ export class FileIO{
379393
for (let x = 0; x < mesh.geometry.attributes.position.count; ++x) {
380394
position.fromBufferAttribute(mesh.geometry.attributes.position, x);
381395
let entry = position.toArray();
382-
entry = entry.join(",");
396+
397+
// Flatten array elements to 0.01 precision joined by ","
398+
entry = this.pxlUtils.flattenArrayToStr( entry );
399+
383400
if( !pointRecorder.hasOwnProperty(entry) ){
384401
normal.fromBufferAttribute(mesh.geometry.attributes.normal, x);
385402
let randomRot = new Euler( 0,Math.random() * 2 * Math.PI, 0);
386403
quaternion.setFromEuler(randomRot);
387404

388-
let curScale = scale;
405+
curScale = scale;
389406
if( hasColor ){
390407
let curScalar = mesh.geometry.attributes.color.getX(x);
408+
if( hasFitScale ){
409+
// Scale the object based on object parameter `minScale` & `maxScale`
410+
curScalar = minScale + (maxScale - minScale) * curScalar;
411+
}
391412
curScale = new Vector3(curScalar, curScalar, curScalar);
392413
}
393414
matrix.compose(position, quaternion, curScale);
@@ -909,6 +930,7 @@ export class FileIO{
909930
c.visible = false;
910931
}
911932

933+
c.layers.set( this.pxlEnums.RENDER_LAYER.SCENE );
912934
envObj.geoList[c.name]=c;
913935

914936
let curSide = FrontSide;
@@ -1105,14 +1127,14 @@ export class FileIO{
11051127
// Parse grid Vertex-Faces for collision detection
11061128
// Prep barycentric coordinate dependency values
11071129
// Vert-Edge lengths, Edge Dot Products, Vert-Face areas & data
1108-
if( envObj.hasColliderType( COLLIDER_TYPE.FLOOR ) ){
1109-
this.pxlColliders.prepColliders( envObj, COLLIDER_TYPE.FLOOR );
1110-
}else if( envObj.hasColliderType( COLLIDER_TYPE.WALL ) ){
1111-
this.pxlColliders.prepColliders( envObj, COLLIDER_TYPE.WALL );
1112-
}else if( envObj.hasColliderType( COLLIDER_TYPE.WALL_TOP ) ){
1113-
this.pxlColliders.prepColliders( envObj, COLLIDER_TYPE.WALL_TOP );
1114-
}else if( envObj.hasColliderType( COLLIDER_TYPE.ROOM ) ){
1115-
this.pxlColliders.prepColliders( envObj, COLLIDER_TYPE.ROOM );
1130+
if( envObj.hasColliderType( this.pxlEnums.COLLIDER_TYPE.FLOOR ) ){
1131+
this.pxlColliders.prepColliders( envObj, this.pxlEnums.COLLIDER_TYPE.FLOOR );
1132+
}else if( envObj.hasColliderType( this.pxlEnums.COLLIDER_TYPE.WALL ) ){
1133+
this.pxlColliders.prepColliders( envObj, this.pxlEnums.COLLIDER_TYPE.WALL );
1134+
}else if( envObj.hasColliderType( this.pxlEnums.COLLIDER_TYPE.WALL_TOP ) ){
1135+
this.pxlColliders.prepColliders( envObj, this.pxlEnums.COLLIDER_TYPE.WALL_TOP );
1136+
}else if( envObj.hasColliderType( this.pxlEnums.COLLIDER_TYPE.ROOM ) ){
1137+
this.pxlColliders.prepColliders( envObj, this.pxlEnums.COLLIDER_TYPE.ROOM );
11161138
}
11171139
}
11181140

@@ -1149,6 +1171,7 @@ export class FileIO{
11491171
mtl.side=FrontSide;
11501172
mtl.flatShading=true;
11511173
c.material=mtl;
1174+
c.layers.set( this.pxlEnums.RENDER_LAYER.SCENE );
11521175
c.matrixAutoUpdate=false;
11531176
envScene.add(c);
11541177
//addToScene[1].add(c.clone());
@@ -1189,6 +1212,7 @@ export class FileIO{
11891212
c.material=mtl;
11901213
}
11911214

1215+
c.layers.set( this.pxlEnums.RENDER_LAYER.SCENE );
11921216
c.matrixAutoUpdate=false;
11931217
envScene.add(c);
11941218
//addToScene[1].add(c.clone());
@@ -1224,9 +1248,9 @@ export class FileIO{
12241248
c.material = curMat;
12251249
c.matrixAutoUpdate = false;
12261250
c.frustumCulled = false;
1227-
c.layers.set( this.pxlEnv.renderLayerEnum.SKY )
1228-
//c.material.depthTest=true;
1229-
//c.material.depthWrite=true;
1251+
c.layers.set( this.pxlEnums.RENDER_LAYER.SKY )
1252+
c.material.depthTest=true;
1253+
c.material.depthWrite=false;
12301254
envObj.geoList[ c.name ] = c;
12311255
envObj.materialList[ c.name ] = curMat;
12321256
//envObj.shaderGeoList[c.name]=c;

‎Source/js/pxlNav/core/Utils.js‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,8 @@ export class Utils{
111111
return [date, time];
112112
}
113113

114+
// -- -- -- //
115+
114116
cleanStrict( messageString ){
115117
let strip=document.createElement( "div" );
116118
strip.innerHTML=messageString;
@@ -142,6 +144,27 @@ export class Utils{
142144
return strip;
143145
}
144146

147+
148+
// Round to nearest
149+
toNearestStr( val, precision=2 ){
150+
let retVal = val.toFixed(precision);
151+
return retVal;
152+
}
153+
154+
// Round array elements to nearest
155+
arrayToStr( arr, precision=2 ){
156+
let retArr = [];
157+
arr.forEach( (val)=>{
158+
retArr.push( this.toNearestStr(val, precision) );
159+
});
160+
return retArr;
161+
}
162+
163+
// Flatten array to joined string
164+
flattenArrayToStr( arr, precision=2, delimiter="," ){
165+
return this.arrayToStr( arr, precision ).join(delimiter);
166+
}
167+
145168
// -- -- -- //
146169

147170
randomFloat(min,max){

0 commit comments

Comments
 (0)