Skip to content

Commit 8560895

Browse files
committed
pxlNav v0.0.26-dev & CampfireEnv. Grass Card fixes
_Shader Editor had an issue you couldn't click off the editor if DOM elements were getting in the way, see pxlNav ChangeLog's for more info _Tamped down the "shimmer" effect on the grass cards _Switched the shader over to a 'settings' based shader to integrate into `pxlNav`
1 parent a9d3688 commit 8560895

File tree

7 files changed

+71
-34
lines changed

7 files changed

+71
-34
lines changed

docs/js/pxlNav.esm.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

docs/js/pxlPages/ProcPageManager.js

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -154,7 +154,6 @@ export class ProcPageManager {
154154

155155
// Rectify the URL state and set the current page
156156
let pageURL = this.getPageURL();
157-
this.curPageName = pageURL;
158157

159158
// Find the dom user clickable actions
160159
this.findDomUserEvents();
@@ -183,6 +182,15 @@ export class ProcPageManager {
183182
});
184183

185184

185+
// -- Error check; user put in a bad URL --
186+
if( !pageListingKeys.hasOwnProperty( pageURL ) ){
187+
pageURL = this.defaultPage;
188+
this.shiftHistoryState( pageURL );
189+
this.updateDocumentMetaData( pageURL );
190+
}
191+
192+
this.curPageName = pageURL;
193+
186194

187195
// Prep the page divs
188196
pageListingKeys.forEach( (pageKey)=>{
@@ -217,6 +225,7 @@ export class ProcPageManager {
217225

218226
});
219227

228+
220229
this.navBarLinks.forEach( (navLink)=>{
221230
let linkText = navLink.getAttribute("page-name");
222231
let pxlRoomName = navLink.getAttribute("pxlRoomName");

docs/js/pxlRooms/CampfireEnvironment/CampfireEnvironment.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -654,10 +654,13 @@ export class CampfireEnvironment extends RoomEnvironment{
654654

655655

656656
let grassCardSettings = {
657+
'buildAlpha' : true,
658+
'addShimmer' : true,
659+
'addCampfire' : true,
657660
'depthScalar': 0.0025,
658661
}
659662

660-
let grassCardsMat=this.pxlFile.pxlShaderBuilder( grassCardsAUniforms, instPlantsVert(), instPlantsFrag( true, true, grassCardSettings ) );
663+
let grassCardsMat=this.pxlFile.pxlShaderBuilder( grassCardsAUniforms, instPlantsVert(), instPlantsFrag( grassCardSettings ) );
661664
grassCardsMat.side = DoubleSide;
662665
grassCardsMat.lights = true;
663666
grassCardsMat.transparent = false;

docs/js/pxlRooms/CampfireEnvironment/Shaders/instPlants.js

Lines changed: 33 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ export function instPlantsVert(){
2121
2222
varying vec3 vPos;
2323
varying vec3 vCamPos;
24-
varying vec3 vWorldPos;
2524
varying vec2 vUv;
2625
varying vec3 vN;
2726
varying vec3 vLocalN;
@@ -128,9 +127,12 @@ export function instPlantsVert(){
128127
return ret;
129128
}
130129

131-
export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={} ){
130+
export function instPlantsFrag( settings={} ){
132131

133132
let defaults = {
133+
'buildAlpha' : false,
134+
'addShimmer' : false,
135+
'addCampfire' : false,
134136
'depthScalar' : .0001,
135137
}
136138
let shaderSettings = Object.assign( defaults, settings );
@@ -142,7 +144,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
142144
const float ShadowTighten = 2.94;
143145
const float FogDepthMult = 0.05;
144146
`;
145-
if( addShimmer ){
147+
if( shaderSettings.addShimmer ){
146148
ret+=`
147149
// Shimmer Settings --
148150
// Mid-to-long distance ambient movement in grass + foliage
@@ -166,7 +168,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
166168
167169
uniform sampler2D diffuse;
168170
`;
169-
if( buildAlpha ){
171+
if( shaderSettings.buildAlpha ){
170172
ret+=`
171173
uniform sampler2D alphaMap;
172174
`;
@@ -176,7 +178,6 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
176178
177179
varying vec3 vPos;
178180
varying vec3 vCamPos;
179-
varying vec3 vWorldPos;
180181
varying vec2 vUv;
181182
varying vec3 vN;
182183
varying vec3 vLocalN;
@@ -218,7 +219,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
218219
219220
vec4 Cd = texture2D(diffuse,vUv);
220221
`;
221-
if( buildAlpha ){
222+
if( shaderSettings.buildAlpha ){
222223
ret+=`
223224
float Alpha = texture2D(alphaMap,vUv).r;
224225
@@ -244,7 +245,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
244245
depthFade *= depthFade*depthFade;
245246
246247
`;
247-
if( addShimmer ){
248+
if( shaderSettings.addShimmer ){
248249
ret+=`
249250
250251
float gInf = min( 1.0, max( 0.0, 1.0-depth * ShimmerEndMult ) * ShimmerEndRolloff );
@@ -266,20 +267,25 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
266267
267268
// -- -- --
268269
270+
`;
271+
if( shaderSettings.addCampfire ){
272+
ret+=`
269273
// -- -- -- -- -- -- -- -- -- -- -- -- --
270274
// -- Animated Radial Campfire Flicker -- --
271275
// -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
272276
273277
// Animated Noise UVs of the campefire flicker on the ground
274-
timer = (-time.x*.02);
278+
timer = (-time.x*.015);
275279
vec2 animWarpUV = (vUv-.5)*.5;
276-
animWarpUV += animWarpUV*min(1.0,length(vPos)*.001);
277-
animWarpUV = vec2(.45, length(animWarpUV)*.04 - timer );
278-
vec3 animWarpCd = texture2D(noiseTexture,animWarpUV).rgb * depthFade;
279-
280-
// -- -- --
280+
animWarpUV += animWarpUV*min(1.0,length(vPos)*.0005);
281+
animWarpUV = vec2(.45, length(animWarpUV)*.01 - timer );
282+
vec3 animWarpCd = texture2D(noiseTexture,animWarpUV).rgb * min(1.0, depthFade*depthFade*1.3 ) + max(0.0, 0.5-depthFade)*.15;
281283
284+
// -- -- --
282285
286+
`;
287+
}
288+
ret+=`
283289
// -- -- -- -- -- -- -- -- -- --
284290
// -- Point Light Influence - -- --
285291
// -- -- -- -- -- -- -- -- -- -- -- --
@@ -288,7 +294,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
288294
float lightMag = 0.0;
289295
#if NUM_POINT_LIGHTS > 0
290296
for(int i = 0; i < NUM_POINT_LIGHTS; i++) {
291-
vec3 lightDelta = (vWorldPos - pointLights[i].position);
297+
vec3 lightDelta = (vPos - pointLights[i].position);
292298
vec3 lightVector = normalize(lightDelta);
293299
294300
// Calculate distance attenuation
@@ -342,7 +348,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
342348
343349
float gCd = luma( Cd.rgb );
344350
`;
345-
if( addShimmer ){
351+
if( shaderSettings.addShimmer ){
346352
ret+=`
347353
Cd.rgb = Cd.rgb * intensity * (vCd.z*.15*(1.0-(gCd*gInf*2.0))-depth*1.1+.45) * (vCd.x*depthFade + 0.9-gCd*depthFade);
348354
`;
@@ -352,17 +358,24 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false, settings={}
352358
Cd.rgb = Cd.rgb * intensity * (vCd.z*.25*(1.0-gCd)-depth*.1+.45) * (vCd.x*depthFade + 1.0-gCd*depthFade);
353359
`;
354360
}
355-
if( addShimmer ){
361+
if( shaderSettings.addShimmer ){
356362
ret+=`
357363
Cd.rgb = mix( Cd.rgb, vec3( gCd*3.4 ), depth );
358364
`;
359365
}
360-
ret+=`
361-
362-
// Campfire Flicker
366+
if( shaderSettings.addCampfire ){
367+
ret+=`
368+
369+
// -- -- --
370+
371+
// Add Campfire Flicker
363372
Cd.rgb += Cd.rgb * (animWarpCd.r*.65) * clamp( 1.2 - min(1.0, length( vPos )*0.01), 0.0, 1.0 ) * intensity;
364-
365373
374+
// -- -- --
375+
376+
`;
377+
}
378+
ret+=`
366379
float fogMix = clamp( depth * (depth*2.2501) - lightMag*(1.0-depth * FogDepthMult), 0.0, 0.85 ) ;
367380
368381
vec3 toFogColor = fogColor * (gCd*.4 + .7 + gInf*.3);

docs/js/pxlRooms/OutletEnvironment/OutletEnvironment.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -309,7 +309,12 @@ builBugs(){
309309
grassCardsAUniforms.diffuse.value = this.pxlUtils.loadTexture( this.assetPath+"grassCardsA_diffuse.jpg" );
310310
grassCardsAUniforms.alphaMap.value = this.pxlUtils.loadTexture( this.assetPath+"grassCardsA_alpha.jpg" );
311311

312-
let grassCardsMat=this.pxlFile.pxlShaderBuilder( grassCardsAUniforms, instPlantsVert(), instPlantsFrag( true, true ) );
312+
let grassCardSettings = {
313+
'buildAlpha' : true,
314+
'addShimmer' : true
315+
}
316+
317+
let grassCardsMat=this.pxlFile.pxlShaderBuilder( grassCardsAUniforms, instPlantsVert(), instPlantsFrag( grassCardSettings ) );
313318
grassCardsMat.side = DoubleSide;
314319
grassCardsMat.lights = true;
315320
grassCardsMat.transparent = false;

docs/js/pxlRooms/OutletEnvironment/Shaders/instPlants.js

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -128,16 +128,23 @@ export function instPlantsVert(){
128128
return ret;
129129
}
130130

131-
export function instPlantsFrag( buildAlpha=false, addShimmer=false ){
131+
export function instPlantsFrag( settings={} ){
132+
133+
let defaults = {
134+
'buildAlpha' : false,
135+
'addShimmer' : false,
136+
'depthScalar' : .0001,
137+
}
138+
let shaderSettings = Object.assign( defaults, settings );
132139

133140
let ret=`
134141
// Plants surface settings --
135-
const float DepthScalar = .0001;
142+
const float DepthScalar = ${shaderSettings.depthScalar};
136143
const float ScreenWarpColorFix = 3.521;
137144
const float ShadowTighten = 2.94;
138145
const float FogDepthMult = 0.05;
139146
`;
140-
if( addShimmer ){
147+
if( shaderSettings.addShimmer ){
141148
ret+=`
142149
// Shimmer Settings --
143150
// Mid-to-long distance ambient movement in grass + foliage
@@ -161,7 +168,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false ){
161168
162169
uniform sampler2D diffuse;
163170
`;
164-
if( buildAlpha ){
171+
if( shaderSettings.buildAlpha ){
165172
ret+=`
166173
uniform sampler2D alphaMap;
167174
`;
@@ -213,7 +220,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false ){
213220
214221
vec4 Cd = texture2D(diffuse,vUv);
215222
`;
216-
if( buildAlpha ){
223+
if( shaderSettings.buildAlpha ){
217224
ret+=`
218225
float Alpha = texture2D(alphaMap,vUv).r;
219226
@@ -239,7 +246,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false ){
239246
//depthFade *= depthFade*depthFade;
240247
241248
`;
242-
if( addShimmer ){
249+
if( shaderSettings.addShimmer ){
243250
ret+=`
244251
245252
float gInf = min( 1.0, max( 0.0, 1.0-depth * ShimmerEndMult ) * ShimmerEndRolloff );
@@ -323,7 +330,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false ){
323330
324331
float gCd = luma( Cd.rgb );
325332
`;
326-
if( addShimmer ){
333+
if( shaderSettings.addShimmer ){
327334
ret+=`
328335
Cd.rgb = Cd.rgb * (vCd.z*.15*(1.0-(gCd*gInf*2.0))-depth*1.1+.45) * (vCd.x*depthFade + 0.9-gCd*depthFade);
329336
`;
@@ -333,7 +340,7 @@ export function instPlantsFrag( buildAlpha=false, addShimmer=false ){
333340
Cd.rgb = Cd.rgb * (vCd.z*.25*(1.0-gCd)-depth*.1+.45) * (vCd.x*depthFade + 1.0-gCd*depthFade);
334341
`;
335342
}
336-
if( addShimmer ){
343+
if( shaderSettings.addShimmer ){
337344
ret+=`
338345
Cd.rgb = mix( Cd.rgb, vec3( gCd*3.4 ), depth );
339346
`;

docs/pages/pxlNav/explore.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ export const pageListingData = {
55
{
66
'type' : 'image',
77
'src' : '../pages/pxlNav/images/pxlNav_TheOutlet_2025-2-8_Coastline_sm.jpg',
8-
'href' : 'https://procstack.github.io/Outlet.htm',
8+
'href' : 'Outlet.htm',
99
'alt' : 'The Outlet coastline',
1010
'style' : 'procPagesImageStyle',
1111
'caption' : ["An overlook of the Outlet"]
@@ -14,7 +14,7 @@ export const pageListingData = {
1414
{
1515
'type' : 'image',
1616
'src' : '../pages/pxlNav/images/pxlNav_TheOutlet_2025-2-8_CatTails_sm.jpg',
17-
'href' : 'https://procstack.github.io/Outlet.htm',
17+
'href' : 'Outlet.htm',
1818
'alt' : 'The water-side cattails',
1919
'style' : 'procPagesImageStyle'
2020
},

0 commit comments

Comments
 (0)