Spark SL Syntax 101 (What are these? When to use them? Why?)

Dear Shader-God and Goddess of Spark AR. :crown:
I need your guidance, my lord and my lady. :pray:t5:

I’ll type some words and symbols, also some screenshot of something that i want to know.
The question to each of them are:
A. What is it?
B. When to use it? and why?

Please answer 2 questions above for each numbers below that you know/have time to explain.
Here they are:

  1. float

  2. void

  3. uniform

  4. array

  5. return

  6. varying

  7. main

  8. std

  9. get

  10. namepace

  11. ()

  12. {}

  13. \

  14. /

  15. =>

  16. ;

  17. ::

  18. the gap / margin / spaces before each lines image

  19. the () after void main image

  20. the <>, std, and the :: image
    how to read that in human language? :rofl: or what is that suppose to mean if we translate it into a sentence?

That’s all for now.

If there some of you guys found some terms or “script vocabulary” that you don’t know, go ahead and put it in the reply below. I’ll try to keep updating the post with each answer to help future reader and maybe move it to wiki category.

Thank you :innocent:

These are not the exact definitions by Kronos/OpenGL standards, these are laymans’ explanations.

I’ll start by laying down a basic definition we can all agree on, which will make it a bit easier to understand some things.

“Shaders are a set of instructions, but the instructions are executed all at once for every single pixel on the screen. That means the code you write has to behave differently depending on the position of the pixel on the screen.” taken from the book of shaders.

  1. Float(s):
    1. It is a data type. It describes numbers with a fractional part, this fractional part may also be 0. E.g. 1.2 // .2 is the fractional part. If the fractional part is 0 the number after the . can be omitted, e.g. .2.
    2. You use it to declare variables of the type float. E.g. const float myFloat = 3.0;
  2. void:
    1. void it represents no data/return, similar to null in Javascript.
    2. You may use it when a function has no return statement, e.g.
void function(){
// this function  does nothing and doesn't return any values
};
  1. uniform:
    1. (At the time of writing) This isn’t thing in Spark SL. In GLSL, uniforms do not change from one shader invocation to the next within a particular rendering call thus their value is uniform among all invocations - aka for all pixels (see the definition at the beginning).
    2. uniform float time (the time is the same for all invocations)
  2. Array:
    1. Arrays are lists of values identified by an index (same as in Java/Javascript/Python/etc)
    2. float arrayA[5] = {1.0, -2.0, 0.2, 5.0, 3.3}; (a list of values)
  3. return:
    1. A keyword used to denote the return statement of a function
float function(){
  return 1.2; // the function returns a float
};
  1. varying:
    1. (At the time of writing) This isn’t thing in Spark SL. In GLSL, varying is used to denote values which will/might change from one invocation to another (the opposite of a uniform).
// again, this isn't a thing in Spark SL
varying vec2 v_TexCoord; // the texture coordinates do change from inv to inv
  1. main
    1. It is used to denote which functions programs (in Spark SL Spark/IG/FB) need to run, from there, you can call other functions inside your main one
void main(){
  // spark will execute this function
}
  1. std:

    1. This is a namespace Spark provides, which includes some useful functions
    2. std::getTime();
  2. get: Sorry but I’m not sure about what you mean by get… could you provide an example?

  3. namespace:

    1. This is not a thing in GLSL, in Spark SL they are a concept borrowed from c++, they are essentially small isolated code packages you can access later
namespace myNameSpace {
   float nameSpaceFloat 2.;
};
  1. ():

    1. This is part of the GLSL/SparkSL syntax, it’s used to denote the parameters of a function or the calling of one.
    2. void main() {}; // takes no parameters
      main(); // function is called.
  2. {}:

    1. It’s used to denote the body of a function.
void main()
{
 // your body (statements/ops/etc)
};
  1. That character(?) isn’t rendering properly, maybe you can describe it or share an example?.

  2. \

    1. I am not sure whether this is a part of Spark SL, in GLSL: “There are no escape sequences or uses of the backslash beyond use as the line-continuation character.” aka you can continue a line.
float f\
oo;
// forms a single line equivalent to “float foo;”
  1. /:

    1. This is the division operator (math).
    2. 4.0 / 2.0 // result = 2.0
  2. =>:

    1. This is a typo (?) of the the ‘greater or equal’ operator (math) which is >=
    2. 2.0 >= 1.0; // result = true
  3. ;:

    1. It shows the compiler that the current instruction is over and it should move on.
float a = 1.0
float b = 2.0 
// the code above you be interpreted as float a = 1.0float b = 2.0, throwing an error
  1. :: :

    1. It is used to access the properties of namespaces.
    2. std::getTime();// accesses the getTime function
    1. It has no effect on the code, but it’s nice (and easier) to see things spaced out :smile:
void main(){vec2 uv= fragment(std::getVertexTexCoord()); return uv;}; 
// this code is valid but it's difficult to read
// instead 👇
void main(){
  vec2 uv= fragment(std::getVertexTexCoord());
  return uv;
}; 
  1. See point 11.

    1. <>:
      1. This is used to denote the type of a parameter (or return of functions when used as types)
      2. function<vec4> myFunction; // (type) a function that returns a vec4
    2. std: See point 8
    3. :: : See point 18.
    4. Translated into a sentence:
The function 'main', which returns a vec4, takes as parameters: 
- An optional std::Texture2D (data type provided by Spark and accessed through the std namespace) which is called tex0.

// code truncated and so is this translation :)

I hope this helps :heart:.

5 Likes

I’ll update my previous comment as more answers are needed :wink:

Wow, this is beautiful :smiley:

1 Like