# Shader Talk - Conversations on GLSL

**URL:** <https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677>\
**Category:** Questions\
**Created:** [March 1, 2019, 9:12pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677 "2019-03-01T21:12:15Z")\
**Posts on this page:** 20\
**Page:** 5

<div class="post-metadata">

**Author:** ![Vinc3r](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/vinc3r/32/25340_2.png) [@Vinc3r](https://forum.babylonjs.com/u/Vinc3r)\
**Post date:** [January 17, 2020, 4:50pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/82 "2020-01-17T16:50:50Z")

</div>

It comes from somewhere in my head who doesn’t understand too much shaders 😃

So I delete the line and do a PR.

---

<div class="post-metadata">

**Author:** ![Alex\_B](https://avatars.discourse-cdn.com/v4/letter/a/5f8ce5/32.png) [@Alex\_B](https://forum.babylonjs.com/u/Alex_B)\
**Post date:** [January 20, 2020, 4:50pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/83 "2020-01-20T16:50:26Z")

</div>

One thing that is a default uniform in ThreeJS but apparently not Babylon is the camera position (`cameraPosition` as it’s named), which is important in computing lighting. Is that something that we should be implementing as a uniform ourselves or is it there under a different name?

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [January 20, 2020, 4:58pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/84 "2020-01-20T16:58:00Z")

</div>

This is not available but it is easy to do 🙂

---

<div class="post-metadata">

**Author:** ![Alex\_B](https://avatars.discourse-cdn.com/v4/letter/a/5f8ce5/32.png) [@Alex\_B](https://forum.babylonjs.com/u/Alex_B)\
**Post date:** [January 20, 2020, 4:58pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/85 "2020-01-20T16:58:41Z")

</div>

Is there an example? Do you just send it in as `scene.activeCamera.position`?

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [January 20, 2020, 4:58pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/86 "2020-01-20T16:58:58Z")

</div>

I will add a cameraPosition default value for the next nightly 🙂

---

<div class="post-metadata">

**Author:** ![nasimiasl](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/nasimiasl/32/34_2.png) [@nasimiasl](https://forum.babylonjs.com/u/nasimiasl)\
**Post date:** [January 20, 2020, 5:22pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/87 "2020-01-20T17:22:58Z")

</div>

can you add the camera target too 🙂  
specially with fov

vec4 (target.x,target.y,target.z ,fov ) :))))

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [January 20, 2020, 7:04pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/88 "2020-01-20T19:04:39Z")

</div>

That will be cool, I can’t even count the number of times I’ve had to script that into a shader.

---

<div class="post-metadata">

**Author:** ![Alex\_B](https://avatars.discourse-cdn.com/v4/letter/a/5f8ce5/32.png) [@Alex\_B](https://forum.babylonjs.com/u/Alex_B)\
**Post date:** [January 20, 2020, 10:48pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/89 "2020-01-20T22:48:35Z")

</div>

Who knew all I had to do was ask???

😉

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [January 21, 2020, 5:36pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/90 "2020-01-21T17:36:14Z")

</div>

This is why we are all here 😃 To ask or to answer

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [February 17, 2020, 9:11pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/92 "2020-02-17T21:11:26Z")

</div>

turn the iterations down to 1, to make it more simple.

Now what was the question?

F is just a float that is being calculated from the distance of the screen to a point which is being offset by the sin and cos function.

That is then ramped by dividing it into 0.001

and then the whole process is offset and looped.

at the end you have a f value for every pixel that you then use to scale a color.

---

<div class="post-metadata">

**Author:** ![nasimiasl](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/nasimiasl/32/34_2.png) [@nasimiasl](https://forum.babylonjs.com/u/nasimiasl)\
**Post date:** [February 20, 2020, 2:38pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/94 "2020-02-20T14:38:04Z")

</div>

nice loading  
[http://glslsandbox.com/e#61399.1](http://glslsandbox.com/e#61399.1)  
[http://glslsandbox.com/e#61399.0](http://glslsandbox.com/e#61399.0)

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [February 20, 2020, 5:13pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/95 "2020-02-20T17:13:56Z")

</div>

Fun that could be a whole sub thread. Glsl loading spinners.

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [February 23, 2020, 4:13pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/99 "2020-02-23T16:13:10Z")

</div>

First time I saw this is real life, I totally hopped on the shader editor and made a version as well, thats funny!

This has been really cool watching you develop your shader skills.

---

<div class="post-metadata">

**Author:** ![aFalcon](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/afalcon/32/7015_2.png) [@aFalcon](https://forum.babylonjs.com/u/aFalcon)\
**Post date:** [February 23, 2020, 8:02pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/100 "2020-02-23T20:02:49Z")

</div>

How to “step-debug” shaders is a Double-LIKE.

Saved the link above by @Necips thank you.

This thread is favorite. Someday I will get to play more, sorry.

Still on the steps before all these cool things…

But will return to the glsl-transpiler link above 1st.

~ : ) -.

---

<div class="post-metadata">

**Author:** ![avin](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/avin/32/14454_2.png) [@avin](https://forum.babylonjs.com/u/avin)\
**Post date:** [March 9, 2020, 6:58pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/102 "2020-03-09T18:58:27Z")

</div>

Circle particles + Simplex noise = Roundworms 🐛

dark version: [Babylon.js Playground](https://www.babylonjs-playground.com/#J2C62M)  
lighter version: [https://www.babylonjs-playground.com/#J2C62M#2](https://www.babylonjs-playground.com/#J2C62M#2)

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/e/ed5c66f9b34e89fb7f8bffc01f8f7fe7f0c2e515.jpeg)

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [March 9, 2020, 7:04pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/103 "2020-03-09T19:04:43Z")

</div>

thats super fun

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [March 10, 2020, 12:09am UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/105 "2020-03-10T00:09:37Z")

</div>

Can you rephrase that? Are you looking to make a Pseudo-Volumetric 2D texture, using like a slideshow method sampling method?

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [March 10, 2020, 4:17pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/107 "2020-03-10T16:17:30Z")

</div>

I guess you are talking about raymarching through screenspace rays?

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [March 10, 2020, 7:50pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/109 "2020-03-10T19:50:20Z")

</div>

[http://glslsandbox.com/e#61957.0](http://glslsandbox.com/e#61957.0)

Just to much going on, you had it “right”

---

<div class="post-metadata">

**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\
**Post date:** [March 18, 2020, 2:48pm UTC](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677/110 "2020-03-18T14:48:31Z")

</div>

How do we do that same thing in BJS I am wondering?

I have this setup:  
[https://playground.babylonjs.com/#UXRQKD#6](https://playground.babylonjs.com/#UXRQKD#6)

Now I just need to pass it the backbuffer.

@Deltakosh, maybe you know a quick and easy way to pass the prior state of the texture back to itself? I tried doing readPixels but ew no… Maybe pass it to a rtt and have that be passed back to the texture so that way I can force its update?

[https://www.babylonjs-playground.com/#I30SDL#37](https://www.babylonjs-playground.com/#I30SDL#37) \<- this is literally the only time I’ve gotten a ping-pong simulation to work and it was a pain in the \*&^%. There has to be a better way. If not then I need to come up with a method that makes this easier.

What am I doing differently here: [Babylon.js Playground](https://www.babylonjs-playground.com/#Q3CS3Y)  
That I am not doing in the prior working example?

Maybe its just a timing issue? I have the backframe being generated here if you look in the inspector.  
[https://playground.babylonjs.com/#UXRQKD#9](https://playground.babylonjs.com/#UXRQKD#9)

But the second I bind it back to the prior texture I get errors:  
[https://playground.babylonjs.com/#UXRQKD#10](https://playground.babylonjs.com/#UXRQKD#10)

I think I have to force them to update or something.

@Necips  
Here is a better example for the question you had though:  
[http://glslsandbox.com/e#61957.1](http://glslsandbox.com/e#61957.1)

[Previous page](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677.md?page=4)

[Next page](https://forum.babylonjs.com/t/shader-talk-conversations-on-glsl/1677.md?page=6)