Varyings can be named the way you want as long as they have the same name on both sides. They are just variables send from vertex to fragment shader
They are shader dependant
Varyings can be named the way you want as long as they have the same name on both sides. They are just variables send from vertex to fragment shader
They are shader dependant
I think direction is an attribute, so to test that go to the playground.
Make a custom shader, and in the attribute section of the shaders constructor make sure you declare direction.
Then in the vertex shader make super simple and just include the position and direction attributes, declare a vDirection varying. Set it to directions value.
Then in the fragment set the fragcolor to vec4(vdirection, 1.0)
See if you can do that.
https://www.babylonjs-playground.com/#1OH09K#121
Vertex code:
precision highp float;
// Attributes
attribute vec3 position;
// Uniforms
uniform mat4 worldViewProjection;
uniform vec3 direction;
// Varying
varying vec3 vDirection;
void main(void) {
gl_Position = worldViewProjection * vec4(position, 1.0);
vDirection = direction;
}
Pixel code:
precision highp float;
// Varying
varying vec3 vDirection;
void main(void) {
gl_FragColor = vec4(vDirection, 1.);
}
[edit] woops, direction is a uniform, not an attribute, fixed
The CYOS might not be the area to try it as the uniform might not be getting bound.
Try on a playground with a custom shader.
You are spot on with the glsl code though
God I wish I had access to a computer right now. This is the most excitement this thread has had happened in forever!
You may have miss the playground I’ve linked on my message above, between screenshot and copied code?
I must haven’t, my bad. I’m kinda drunk and “on vacation” today so maybe i should just review all this Thursday when I get back home and actually contribute.
We will have all this figured out and documented before the weekend.
I just notice something UBER cool about copy-pasting custom shader into the playground! In this doc’ page we can see that our custom shader code use "\r\n"+
on each lines, which is very painful isn’t it?
Thanks for this guy, we actually able to directly copy-paste our shader code from our editor without formating each lines, using backtick char ` (on Azerty: Alt Gr + 7)
https://www.babylonjs-playground.com/#1OH09K#122
BABYLON.Effect.ShadersStore["customVertexShader"] = `
precision highp float;
// Attributes
attribute vec3 position;
attribute vec2 uv;
// Uniforms
uniform mat4 worldViewProjection;
// Varying
varying vec2 vUV;
void main(void) {
gl_Position = worldViewProjection * vec4(position, 1.0);
vUV = uv;
}
`;
BABYLON.Effect.ShadersStore["customFragmentShader"] = `
precision highp float;
varying vec2 vUV;
uniform sampler2D textureSampler;
void main(void) {
gl_FragColor = texture2D(textureSampler, vUV);
}
`;
var shaderMaterial = new BABYLON.ShaderMaterial("shader", scene, {
vertex: "custom",
fragment: "custom",
}, {
attributes: ["position", "normal", "uv"],
uniforms: ["world", "worldView", "worldViewProjection", "view", "projection", "time", "direction"]
});
It looks like another update to make in the doc’ right?
[edit] @sharp tell me that it’s only es6 compatible, so that’s OK for playground testing, but not for customer delivery
Yes this are literal lines. They save lots of time!
So we still have nobody who knows about this direction
uniform?
we dont have any setVector3(‘direction’)
but i just find this in BJs.js
,e.setVector3(“direction1”,this.direction1),e.setVector3(“direction2”,this.direction2)
also we have two methid for getDirection - setDirection - for mesh
but that never set to custom shader effect or standardmaterial too
Ok I am back into town, I have a ton of work to catch up on but I will hop on this as soon as I have a second!
Is it for GPU particles only?
After a little hunting I can pretty confidently say its for particles? @Deltakosh
On this WebGL API cheatsheet…
a search for ‘direction’, there is 0 results.
In this WebGL Specification:
There are 3 results for ‘direction’, but each describe something else.
I bought that cheatsheet (laminated - version) somewhere online for 1.00. But cant find that link now.
Thank you for this fun challenge. Idk “direction”, or much else, but maybe someday. : )
The link in the last post is so cool…
Particles?
Reading thread - on a hunt to convert a shader from ShaderFrog (and to understand more about how to convert shaders to BJS in general). Too much of a noob to understand some of the stuff above. Tried following instructions on help files but no luck.
Looking to convert: Goo Shader - ShaderFrog.com
Got it to compile in CYOS, but doesn’t display anything:
https://cyos.babylonjs.com/#2ACSTF#11
Seem like a whole bunch of uniform variables are being set in shaderfrog - that don’t seem to have a place for input in CYOS.
Any pointers to right place for understanding how to convert from ShaderFrog (or any other source) to BJS would be awesome!
What would be great is to explain how each of these vars/consts relate to what’s in book of shaders - or in other popular shader resources (shaderfrog). Am getting somewhere reading book of shaders, but having difficulty figuring out how it all translates to BJS. Finally got the pink hello world example working in CYOS, but wasn’t/isn’t at all obvious what goes where -
I’ll take a look at this here soon, sorry I have been super sick for about a week after a trip… otherwise Id be on this.
After looking at this, it will be fun to recreate it in the new Node Shader system.
@Deltakosh how would we add a sub-shader node in bjs like they did here Goo Shader - ShaderFrog.com - you have to click the edit button to get there.
This is on my plan but not for 4.1:) you will have to build it with existing nodes
Ok cool, cause as of now it would not be possible I don’t think unless I can do a custom Script node or something.
Otherwise this shader would be ez to do in glsl, I just wanted to try doing it for him in the node thing… Might have to wait for that then.
Which part do you think would be complicated with the node editor?