Review shader to use provided texture coordinates

Now shader uses `fragTexCoord` that are the full screen texture coordinates normalized, instead of `gl_fragCoord`, the unnormalized screen coordinates

3 files changed, 51 insertions, 50 deletions

diff --git a/examples/shaders/resources/shaders/glsl100/julia_set.fs b/examples/shaders/resources/shaders/glsl100/julia_set.fs
index 9b8a0d03..149a559c 100644
--- a/examples/shaders/resources/shaders/glsl100/julia_set.fs
+++ b/examples/shaders/resources/shaders/glsl100/julia_set.fs
@@ -33,31 +33,30 @@ vec3 Hsv2rgb(vec3 c)
 
 void main()
 {
-    // The pixel coordinates scaled so they are on the mandelbrot scale
-    // y also flipped due to opengl
-    vec2 z = vec2((((gl_FragCoord.x + offset.x)/screenDims.x)*2.5)/zoom,
-                  (((screenDims.y - gl_FragCoord.y + offset.y)/screenDims.y)*1.5)/zoom);
-                  
-    int iterations = 0;
-
     /**********************************************************************************************
-    Julia sets use a function z^2 + c, where c is a constant.
-    This function is iterated until the nature of the point is determined.
+      Julia sets use a function z^2 + c, where c is a constant.
+      This function is iterated until the nature of the point is determined.
 
-    If the magnitude of the number becomes greater than 2, then from that point onward
-    the number will get bigger and bigger, and will never get smaller (tends towards infinity).
-    2^2 = 4, 4^2 = 8 and so on.
-    So at 2 we stop iterating.
+      If the magnitude of the number becomes greater than 2, then from that point onward
+      the number will get bigger and bigger, and will never get smaller (tends towards infinity).
+      2^2 = 4, 4^2 = 8 and so on.
+      So at 2 we stop iterating.
 
-    If the number is below 2, we keep iterating.
-    But when do we stop iterating if the number is always below 2 (it converges)?
-    That is what MAX_ITERATIONS is for.
-    Then we can divide the iterations by the MAX_ITERATIONS value to get a normalized value that we can
-    then map to a color.
+      If the number is below 2, we keep iterating.
+      But when do we stop iterating if the number is always below 2 (it converges)?
+      That is what MAX_ITERATIONS is for.
+      Then we can divide the iterations by the MAX_ITERATIONS value to get a normalized value that we can
+      then map to a color.
 
-    We use dot product (z.x * z.x + z.y * z.y) to determine the magnitude (length) squared.
-    And once the magnitude squared is > 4, then magnitude > 2 is also true (saves computational power).
+      We use dot product (z.x * z.x + z.y * z.y) to determine the magnitude (length) squared.
+      And once the magnitude squared is > 4, then magnitude > 2 is also true (saves computational power).
     *************************************************************************************************/
+    
+    // The pixel coordinates are scaled so they are on the mandelbrot scale
+    // NOTE: fragTexCoord already comes as normalized screen coordinates but offset must be normalized before scaling and zoom
+    vec2 z = vec2((fragTexCoord.x + offset.x/screenDims.x)*2.5/zoom, (fragTexCoord.y + offset.y/screenDims.y)*1.5/zoom);
+
+    int iterations = 0;
     for (iterations = 0; iterations < MAX_ITERATIONS; iterations++)
     {
         z = ComplexSquare(z) + c;  // Iterate function
diff --git a/examples/shaders/resources/shaders/glsl330/julia_set.fs b/examples/shaders/resources/shaders/glsl330/julia_set.fs
index 0e58716f..f68367ea 100644
--- a/examples/shaders/resources/shaders/glsl330/julia_set.fs
+++ b/examples/shaders/resources/shaders/glsl330/julia_set.fs
@@ -33,31 +33,30 @@ vec3 Hsv2rgb(vec3 c)
 
 void main()
 {
-    // The pixel coordinates scaled so they are on the mandelbrot scale
-    // y also flipped due to opengl
-    vec2 z = vec2((((gl_FragCoord.x + offset.x)/screenDims.x)*2.5)/zoom,
-                  (((screenDims.y - gl_FragCoord.y + offset.y)/screenDims.y)*1.5)/zoom);
-                  
-    int iterations = 0;
-
     /**********************************************************************************************
-    Julia sets use a function z^2 + c, where c is a constant.
-    This function is iterated until the nature of the point is determined.
+      Julia sets use a function z^2 + c, where c is a constant.
+      This function is iterated until the nature of the point is determined.
 
-    If the magnitude of the number becomes greater than 2, then from that point onward
-    the number will get bigger and bigger, and will never get smaller (tends towards infinity).
-    2^2 = 4, 4^2 = 8 and so on.
-    So at 2 we stop iterating.
+      If the magnitude of the number becomes greater than 2, then from that point onward
+      the number will get bigger and bigger, and will never get smaller (tends towards infinity).
+      2^2 = 4, 4^2 = 8 and so on.
+      So at 2 we stop iterating.
 
-    If the number is below 2, we keep iterating.
-    But when do we stop iterating if the number is always below 2 (it converges)?
-    That is what MAX_ITERATIONS is for.
-    Then we can divide the iterations by the MAX_ITERATIONS value to get a normalized value that we can
-    then map to a color.
+      If the number is below 2, we keep iterating.
+      But when do we stop iterating if the number is always below 2 (it converges)?
+      That is what MAX_ITERATIONS is for.
+      Then we can divide the iterations by the MAX_ITERATIONS value to get a normalized value that we can
+      then map to a color.
 
-    We use dot product (z.x * z.x + z.y * z.y) to determine the magnitude (length) squared.
-    And once the magnitude squared is > 4, then magnitude > 2 is also true (saves computational power).
+      We use dot product (z.x * z.x + z.y * z.y) to determine the magnitude (length) squared.
+      And once the magnitude squared is > 4, then magnitude > 2 is also true (saves computational power).
     *************************************************************************************************/
+    
+    // The pixel coordinates are scaled so they are on the mandelbrot scale
+    // NOTE: fragTexCoord already comes as normalized screen coordinates but offset must be normalized before scaling and zoom
+    vec2 z = vec2((fragTexCoord.x + offset.x/screenDims.x)*2.5/zoom, (fragTexCoord.y + offset.y/screenDims.y)*1.5/zoom);
+
+    int iterations = 0;
     for (iterations = 0; iterations < MAX_ITERATIONS; iterations++)
     {
         z = ComplexSquare(z) + c;  // Iterate function
diff --git a/examples/shaders/shaders_julia_set.c b/examples/shaders/shaders_julia_set.c
index 58163059..6c45f843 100644
--- a/examples/shaders/shaders_julia_set.c
+++ b/examples/shaders/shaders_julia_set.c
@@ -117,8 +117,8 @@ int main()
             // Probably offset movement should be proportional to zoom level
             if (IsMouseButtonDown(MOUSE_LEFT_BUTTON) || IsMouseButtonDown(MOUSE_RIGHT_BUTTON))
             {
-                if (IsMouseButtonDown(MOUSE_LEFT_BUTTON)) zoom += zoom * 0.003f;
-                if (IsMouseButtonDown(MOUSE_RIGHT_BUTTON)) zoom -= zoom * 0.003f;
+                if (IsMouseButtonDown(MOUSE_LEFT_BUTTON)) zoom += zoom*0.003f;
+                if (IsMouseButtonDown(MOUSE_RIGHT_BUTTON)) zoom -= zoom*0.003f;
 
                 Vector2 mousePos = GetMousePosition();
                 
@@ -153,16 +153,19 @@ int main()
             BeginTextureMode(target);       // Enable drawing to texture
                 ClearBackground(BLACK);     // Clear the render texture
 
-                // Draw a rectangle in shader mode
-                // NOTE: This acts as a canvas for the shader to draw on
-                BeginShaderMode(shader);
-                    DrawRectangle(0, 0, GetScreenWidth(), GetScreenHeight(), BLACK);
-                EndShaderMode();
+                // Draw a rectangle in shader mode to be used as shader canvas
+                // NOTE: Rectangle uses font white character texture coordinates,
+                // so shader can not be applied here directly because input vertexTexCoord
+                // do not represent full screen coordinates (space where want to apply shader)
+                DrawRectangle(0, 0, GetScreenWidth(), GetScreenHeight(), BLACK);
             EndTextureMode();
 
-            // Draw the saved texture (rendered julia set)
-            DrawTextureRec(target.texture, (Rectangle){ 0, 0, target.texture.width, -target.texture.height }, (Vector2){ 0.0f, 0.0f }, WHITE);
-            
+            // Draw the saved texture and rendered julia set with shader
+            // NOTE: We do not invert texture on Y, already considered inside shader
+            BeginShaderMode(shader);
+                DrawTexture(target.texture, 0, 0, WHITE);
+            EndShaderMode();
+                
             if (showControls)
             {
                 DrawText("Press Mouse buttons right/left to zoom in/out and move", 10, 15, 10, RAYWHITE);