Compare commits

...

4 Commits

Author SHA1 Message Date
Neyl
123db6d6bc Update scenestack.ts 2025-04-30 10:52:13 +02:00
Neyl
8a9636c519 Update scenestack.ts 2025-04-30 10:49:51 +02:00
Neyl
cc1ac66f9f format 2025-04-30 10:39:46 +02:00
Neyl
6e523cb0cc Draft commit to demonstrate lava shader 2025-04-28 15:31:37 +02:00
5 changed files with 96 additions and 27 deletions

View File

@@ -75,12 +75,11 @@ namespace gdjs {
instanceContainer: gdjs.RuntimeInstanceContainer instanceContainer: gdjs.RuntimeInstanceContainer
) { ) {
const geometry = new THREE.BoxGeometry(1, 1, 1); const geometry = new THREE.BoxGeometry(1, 1, 1);
getFaceMaterial(runtimeObject, materialIndexToFaceIndex[0]);
const materials: THREE.Material[] = new Array(6) const materials: THREE.Material[] = new Array(6)
.fill(0) .fill(0)
.map((_, index) => .map((_, index) => lavaMaterial);
getFaceMaterial(runtimeObject, materialIndexToFaceIndex[index])
);
const boxMesh = new THREE.Mesh(geometry, materials); const boxMesh = new THREE.Mesh(geometry, materials);
@@ -123,6 +122,7 @@ namespace gdjs {
this._cube3DRuntimeObject, this._cube3DRuntimeObject,
faceIndex faceIndex
); );
if (this._cube3DRuntimeObject.isFaceAtIndexVisible(faceIndex)) { if (this._cube3DRuntimeObject.isFaceAtIndexVisible(faceIndex)) {
this.updateTextureUvMapping(faceIndex); this.updateTextureUvMapping(faceIndex);
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

View File

@@ -3,6 +3,7 @@
* Copyright 2013-2016 Florian Rival (Florian.Rival@gmail.com). All rights reserved. * Copyright 2013-2016 Florian Rival (Florian.Rival@gmail.com). All rights reserved.
* This project is released under the MIT License. * This project is released under the MIT License.
*/ */
let lavaMaterial: THREE.ShaderMaterial;
namespace gdjs { namespace gdjs {
const logger = new gdjs.Logger('PIXI Image manager'); const logger = new gdjs.Logger('PIXI Image manager');
@@ -234,29 +235,96 @@ namespace gdjs {
vertexColors: boolean; vertexColors: boolean;
} }
): THREE.Material { ): THREE.Material {
const cacheKey = `${resourceName}|${useTransparentTexture ? 1 : 0}|${ // const cacheKey = `${resourceName}|${useTransparentTexture ? 1 : 0}|${
forceBasicMaterial ? 1 : 0 // forceBasicMaterial ? 1 : 0
}|${vertexColors ? 1 : 0}`; // }`;
const loadedThreeMaterial = this._loadedThreeMaterials.get(cacheKey); // const loadedThreeMaterial = this._loadedThreeMaterials.get(cacheKey);
if (loadedThreeMaterial) return loadedThreeMaterial; // if (loadedThreeMaterial) return loadedThreeMaterial;
const material = forceBasicMaterial // const material = forceBasicMaterial
? new THREE.MeshBasicMaterial({ // ? new THREE.MeshBasicMaterial({
map: this.getThreeTexture(resourceName), // map: this.getThreeTexture(resourceName),
side: useTransparentTexture ? THREE.DoubleSide : THREE.FrontSide, // side: useTransparentTexture ? THREE.DoubleSide : THREE.FrontSide,
transparent: useTransparentTexture, // transparent: useTransparentTexture,
vertexColors, // vertexColors: true,
}) // })
: new THREE.MeshStandardMaterial({ // : new THREE.MeshStandardMaterial({
map: this.getThreeTexture(resourceName), // map: this.getThreeTexture(resourceName),
side: useTransparentTexture ? THREE.DoubleSide : THREE.FrontSide, // side: useTransparentTexture ? THREE.DoubleSide : THREE.FrontSide,
transparent: useTransparentTexture, // transparent: useTransparentTexture,
metalness: 0, // metalness: 0,
vertexColors, // vertexColors: true,
}); // });
this._loadedThreeMaterials.put(cacheKey, material); // this._loadedThreeMaterials.put(cacheKey, material);
return material; let tex1 = new THREE.TextureLoader().load(
'C:/Users/Utilisateur/Desktop/Gdevelop/GDevelop/GDJS/Runtime/pixi-renderers/cloudLava.png'
);
tex1.wrapS = THREE.RepeatWrapping;
tex1.wrapT = THREE.RepeatWrapping;
let text2 = new THREE.TextureLoader().load(
'C:/Users/Utilisateur/Desktop/Gdevelop/GDevelop/GDJS/Runtime/pixi-renderers/tileLava.jpg'
);
text2.wrapS = THREE.RepeatWrapping;
text2.wrapT = THREE.RepeatWrapping;
lavaMaterial = new THREE.ShaderMaterial({
uniforms: {
time: { value: time },
fogDensity: { value: 0.001 },
fogColor: { value: new THREE.Vector3(0.1, 0.1, 0.1) },
texture1: { value: tex1 },
texture2: { value: text2 },
uvScale: { value: new THREE.Vector2(1, 1) },
},
vertexShader: `uniform vec2 uvScale;
varying vec2 vUv;
void main()
{
vUv = uvScale * uv;
vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
gl_Position = projectionMatrix * mvPosition;
}`,
fragmentShader: `uniform float time;
uniform float fogDensity;
uniform vec3 fogColor;
uniform sampler2D texture1;
uniform sampler2D texture2;
varying vec2 vUv;
void main( void ) {
vec2 position = -1.0 + 2.0 * vUv;
vec4 noise = texture2D( texture1, vUv );
vec2 T1 = vUv + vec2( 1.5, - 1.5 ) * time * 0.02;
vec2 T2 = vUv + vec2( - 0.5, 2.0 ) * time * 0.01;
T1.x += noise.x * 2.0;
T1.y += noise.y * 2.0;
T2.x -= noise.y * 0.2;
T2.y += noise.z * 0.2;
float p = texture2D( texture1, T1 * 2.0 ).a;
vec4 color = texture2D( texture2, T2 * 2.0 );
vec4 temp = color * ( vec4( p, p, p, p ) * 2.0 ) + ( color * color - 0.1 );
if( temp.r > 1.0 ) { temp.bg += clamp( temp.r - 2.0, 0.0, 100.0 ); }
if( temp.g > 1.0 ) { temp.rb += temp.g - 1.0; }
if( temp.b > 1.0 ) { temp.rg += temp.b - 1.0; }
gl_FragColor = temp;
float depth = gl_FragCoord.z / gl_FragCoord.w;
const float LOG2 = 1.442695;
float fogFactor = exp2( - fogDensity * fogDensity * depth * depth * LOG2 );
fogFactor = 1.0 - clamp( fogFactor, 0.0, 1.0 );
gl_FragColor = mix( gl_FragColor, vec4( fogColor, gl_FragColor.w ), fogFactor );
}`,
});
return lavaMaterial;
} }
/** /**

Binary file not shown.

After

Width:  |  Height:  |  Size: 545 KiB

View File

@@ -1,5 +1,6 @@
let time = 0.0;
namespace gdjs { namespace gdjs {
const logger = new gdjs.Logger('Scene stack');
const debugLogger = new gdjs.Logger('Multiplayer - Debug'); const debugLogger = new gdjs.Logger('Multiplayer - Debug');
/** /**
@@ -35,6 +36,8 @@ namespace gdjs {
} }
step(elapsedTime: float): boolean { step(elapsedTime: float): boolean {
time += this._stack[0].getTimeManager().getElapsedTime() / 100;
lavaMaterial.uniforms.time.value = time;
this._throwIfDisposed(); this._throwIfDisposed();
if (this._isNextLayoutLoading || this._stack.length === 0) { if (this._isNextLayoutLoading || this._stack.length === 0) {
return false; return false;
@@ -68,10 +71,8 @@ namespace gdjs {
} else if (request === gdjs.SceneChangeRequest.CLEAR_SCENES) { } else if (request === gdjs.SceneChangeRequest.CLEAR_SCENES) {
this.replace(currentScene.getRequestedScene(), true); this.replace(currentScene.getRequestedScene(), true);
} else { } else {
logger.error('Unrecognized change in scene stack: ' + request);
} }
} }
return true; return true;
} }