why i can’t see the the glsl effect correctly?
i’m testing the xyar shader from ShaderDesinger… the same of this post http://www.jmonkeyengine.com/jmeforum/index.php?topic=9184.0
i’m using the same code for loadind the shader…
but i can’t see the model transparent, something is wrong?
some screenshots:
This may be a stupid thing to say since I have no idea how shaders actually work, but maybe you're missing a BlendState?
Yes, and make sure they are in the transparent queue- Spatial.setRenderQueueMode(Renderer.QUEUE_TRANSPARENT)- so that they are properly sorted.
yes, using a blendstate works only with this shader, but it doesn't work correctly using the glass effect.
with the glass effect i can see the envMap, but i don't see the model transparent…
I think that it should work applying only the renderState for the glsl program… why isn't it working?
What is this glass effect? How are you creating it?
the "Glass" shader i'm testing is from the demo by 3DLabs…
the code i'm using:
private Torus createBrickQuad() {
// Check is GLSL is supported on current hardware.
if (!GLSLShaderObjectsState.isSupported()) {
logger.severe("Your graphics card does not support GLSL programs, and thus cannot run this test.");
quit();
}
GLSLShaderObjectsState so = display.getRenderer()
.createGLSLShaderObjectsState();
so.load(TestGLSLShaderObjectsState.class.getClassLoader().getResource(
"res/shaders/Glass.vert"),
TestGLSLShaderObjectsState.class.getClassLoader().getResource(
"res/shaders/Glass.frag"));
Texture tex = TextureManager.loadTexture(
TestGLSLShaderObjectsState2.class.getClassLoader().getResource(
"res/House.jpg"),
Texture.MinificationFilter.Trilinear,
Texture.MagnificationFilter.Bilinear);
tex.setWrap(Texture.WrapMode.Repeat);
Texture tex1 = TextureManager.loadTexture(
TestGLSLShaderObjectsState2.class.getClassLoader().getResource(
"res/PointSprite.png"),
Texture.MinificationFilter.Trilinear,
Texture.MagnificationFilter.Bilinear);
tex.setWrap(Texture.WrapMode.Repeat);
TextureState brick = display.getRenderer().createTextureState();
brick.setTexture(tex, 0);
brick.setTexture(tex1, 1);
brick.setEnabled(true);
//Glass
so.setUniform("BaseColor", 0.2f, 0.2f, 0.75f);
so.setUniform("Depth", 0.3f);
so.setUniform("MixRatio", 0.5f);
so.setUniform("FrameWidth", 1f);
so.setUniform("FrameHeight", 1f);
so.setUniform("EnvMap", 0);
so.setUniform("RefractionMap", 1);
so.setUniform("LightPos", 1.0f, 10.5f, 1.0f);
so.setEnabled(true);
//Generate the torus
Torus t = new Torus("glslQuad", 35, 35, 1.0f, 2f);
t.setRenderState(brick);
t.updateRenderState();
t.setRenderState(so);
t.updateRenderState();
return box;
}
and the vert/frag:
frag
const vec3 Xunitvec = vec3 (1.0, 0.0, 0.0);
const vec3 Yunitvec = vec3 (0.0, 1.0, 0.0);
uniform vec3 BaseColor;
uniform float Depth;
uniform float MixRatio;
// need to scale our framebuffer - it has a fixed width/height of 2048
uniform float FrameWidth;
uniform float FrameHeight;
uniform sampler2D EnvMap;
uniform sampler2D RefractionMap;
varying vec3 Normal;
varying vec3 EyeDir;
varying vec4 EyePos;
varying float LightIntensity;
void main (void)
{
// Compute reflection vector
vec3 reflectDir = reflect(EyeDir, Normal);
// Compute altitude and azimuth angles
vec2 index;
index.y = dot(normalize(reflectDir), Yunitvec);
reflectDir.y = 0.0;
index.x = dot(normalize(reflectDir), Xunitvec) * 0.5;
// Translate index values into proper range
if (reflectDir.z >= 0.0)
index = (index + 1.0) * 0.5;
else
{
index.t = (index.t + 1.0) * 0.5;
index.s = (-index.s) * 0.5 + 1.0;
}
// if reflectDir.z >= 0.0, s will go from 0.25 to 0.75
// if reflectDir.z < 0.0, s will go from 0.75 to 1.25, and
// that's OK, because we've set the texture to wrap.
// Do a lookup into the environment map.
vec3 envColor = vec3 (texture2D(EnvMap, index));
// calc fresnels term. This allows a view dependant blend of reflection/refraction
float fresnel = abs(dot(normalize(EyeDir), Normal));
fresnel *= MixRatio;
fresnel = clamp(fresnel, 0.1, 0.9);
// calc refraction
vec3 refractionDir = normalize(EyeDir) - normalize(Normal);
// Scale the refraction so the z element is equal to depth
float depthVal = Depth / -refractionDir.z;
// perform the div by w
float recipW = 1.0 / EyePos.w;
vec2 eye = EyePos.xy * vec2(recipW);
// calc the refraction lookup
index.s = (eye.x + refractionDir.x * depthVal);
index.t = (eye.y + refractionDir.y * depthVal);
// scale and shift so we're in the range 0-1
index.s = index.s / 2.0 + 0.5;
index.t = index.t / 2.0 + 0.5;
// as we're looking at the framebuffer, we want it clamping at the edge of the rendered scene, not the edge of the texture,
// so we clamp before scaling to fit
float recip1k = 1.0 / 2048.0;
index.s = clamp(index.s, 0.0, 1.0 - recip1k);
index.t = clamp(index.t, 0.0, 1.0 - recip1k);
// scale the texture so we just see the rendered framebuffer
index.s = index.s * FrameWidth * recip1k;
index.t = index.t * FrameHeight * recip1k;
vec3 RefractionColor = vec3 (texture2D(RefractionMap, index));
// Add lighting to base color and mix
vec3 base = LightIntensity * BaseColor;
envColor = mix(envColor, RefractionColor, fresnel);
envColor = mix(envColor, base, 0.2);
gl_FragColor = vec4 (envColor, 1.0);
}
vert:
varying vec3 Normal;
varying vec3 EyeDir;
varying vec4 EyePos;
varying float LightIntensity;
uniform vec3 LightPos;
void main(void)
{
gl_Position = ftransform();
Normal = normalize(gl_NormalMatrix * gl_Normal);
vec4 pos = gl_ModelViewMatrix * gl_Vertex;
EyeDir = pos.xyz;
EyePos = gl_ModelViewProjectionMatrix * gl_Vertex;
LightIntensity = max(dot(normalize(LightPos - EyeDir), Normal), 0.0);
}
I get this:
but i should get something like...:
Texture tex1 = TextureManager.loadTexture(
TestGLSLShaderObjectsState2.class.getClassLoader().getResource(
"res/PointSprite.png"),
Texture.MinificationFilter.Trilinear,
Texture.MagnificationFilter.Bilinear);
What's this? This is not what the RefractionMap should be. The refraction map should contain the background framebuffer. You need to use TextureRenderer and render the background to that with the current camera, extracting the texture from there, that's your RefractionMap. Looking at the shader it seems it does lots of math on the tex coords for the RefractionMap which I don't really understand right now so it could require you to render it in a certain way. You should probably consult the documentation that came with the shader demo on what do the uniforms mean and what the correct scene setup should be. Otherwise, try to render RefractionMap and see what it looks like for hints.
You need to use TextureRenderer and render the background to that with the current camera, extracting the texture from there, that's your RefractionMap
this means i have to make a texture with that i'm seeing in the current camera?
done:
Texture2D fakeTex;
TextureRenderer texRenderer;
private Torus createBrickQuad() {
if (!GLSLShaderObjectsState.isSupported()) {
logger.severe("Your graphics card does not support GLSL programs, and thus cannot run this test.");
quit();
}
GLSLShaderObjectsState so = display.getRenderer()
.createGLSLShaderObjectsState();
so.load(TestGLSLShaderObjectsState.class.getClassLoader().getResource(
"res/shaders/Glass.vert"),
TestGLSLShaderObjectsState.class.getClassLoader().getResource(
"res/shaders/Glass.frag"));
Texture tex = TextureManager.loadTexture(
TestGLSLShaderObjectsState2.class.getClassLoader().getResource(
"res/House.jpg"),
Texture.MinificationFilter.Trilinear,
Texture.MagnificationFilter.Bilinear);
tex.setWrap(Texture.WrapMode.Repeat);
// texture extracted from the camera
texRenderer = DisplaySystem.getDisplaySystem().createTextureRenderer(settings.getWidth(), settings.getHeight(), TextureRenderer.Target.Texture2D);
texRenderer.setBackgroundColor(new ColorRGBA(.5f, .5f, .5f, 1f));
fakeTex = new Texture2D();
fakeTex.setWrap(Texture.WrapMode.Clamp);
if ( texRenderer.isSupported() )
{
texRenderer.setupTexture(fakeTex);
} else
{
logger.severe("Render to texture not supported!");
}
TextureState brick = display.getRenderer().createTextureState();
brick.setTexture(tex, 0);
//the texture extracted
brick.setTexture(fakeTex, 1);
brick.setEnabled(true);
//Glass
so.setUniform("BaseColor", 0.2f, 0.2f, 0.75f);
so.setUniform("Depth", 0.3f);
so.setUniform("MixRatio", 0.5f);
so.setUniform("FrameWidth", 1f);
so.setUniform("FrameHeight", 1f);
so.setUniform("EnvMap", 0);
so.setUniform("RefractionMap", 1);
so.setUniform("LightPos", 1.0f, 10.5f, 1.0f);
so.setEnabled(true);
Torus t = new Torus("glslQuad", 35, 35, 1.0f, 2f);
t.setRenderState(brick);
t.updateRenderState();
t.setRenderState(so);
t.updateRenderState();
return t;
}
protected void simpleRender()
{
texRenderer.render(rootNode, fakeTex);
}
still not working...
I got it to work. You need to have something in the background, like a skybox, to see the effect. Otherwise the model will just appear to look like the background color of the tex renderer. Also, make sure NOT to render the model in the tex renderer, only the background. Also make sure the FrameWidth and FrameHeight represent the width and height of the tex renderer respectively.
sorry I had problems understanding some things… but i'll try again…
and thanks!!!