Multiple Shaders in OpenGL

Question

Is there a way to create multiple shaders (both vertex, fragment, even geometry and tessellation) that can be compounded in what they do?

For example: I've seen a number of uses of the in and out keywords in the later versions of OpenGL, and will use these to illustrate my question.

Is there a way given a shader (doesn't matter which, but let's say fragment shader) such as

in inVar;
out outVar;
void man(){
    var varOne = inVar;
    var varTwo = varOne;
    var varThr = varTwo;
    outVar = varThr;
}

To turn it into the fragment shader

in inVar;
out varOne;
void main(){
    varOne = inVar;
}

Followed by the fragment shader

in varOne;
out varTwo;
void main(){
    varTwo = varOne;
}

Followed by the fragment shader

in varTwo(
out varThr;
void main(){
    varThr = varTwo
}

And finally Followed by the fragment shader

in varThr;
out outVar;
void main(){
    outVar = varThr;
}

Are the in and out the correct "concepts" to describe this behavior or should I be looking for another keyword(s)?

Answer 1

In OpenGL, you can attach multiple shaders of the same type to a program object. In OpenGL ES, this is not supported.

This is from the OpenGL 4.5 spec, section "7.3 Program Objects", page 88 (emphasis added):

Multiple shader objects of the same type may be attached to a single program object, and a single shader object may be attached to more than one program object.

Compared with the OpenGL ES 3.2 spec, section "7.3 Program Objects", page 72 (emphasis added):

Multiple shader objects of the same type may not be attached to a single program object. However, a single shader object may be attached to more than one program object.

However, even in OpenGL, using multiple shaders of the same type does not work they way you outline it in your question. Only one of the shaders can have a main(). The other shaders typically only contain functions. So your idea of chaining multiple shaders of the same type into a pipeline will not work in this form.

The way this is sometimes used is that there is one (or multiple) shaders that contain a collection of generic functions, which only needs to be compiled once, and can then be used for multiple shader programs. This is comparable to a library of functions in general programming. You could call this, using unofficial terminology, a "library shader".

Then each shader program has a single shader of each type containing a main(), and that shader contains the specific logic and control flow for that program, while calling generic functions from the "library shaders".

Following the outline in your question, you could achieve something similar with defining a function in each shader. For example, the first fragment shader could contain this code:

void shaderOne(in vec4 varIn, out vec4 varOut) {
    varOut = varIn;
}

Second shader:

void shaderTwo(in vec4 varIn, out vec4 varOut) {
    varOut = varIn;
}

Third shader:

void shaderThr(in vec4 varIn, out vec4 varOut) {
    varOut = varIn;
}

Then you need one shader with a main(), where you can chain the other shaders:

in vec4 varOne;
out vec4 outVar;

void main() {
    vec4 varTwo, varThr;
    shaderOne(varOne, varTwo);
    shaderTwo(varTwo, varThr);
    shaderThr(varThr, outVar);
}

Answer 2

Generate your shaders. That's what pretty much all 3D engines and game engines do.

In other words they manipulate text using code and generate source code at runtime or build time.

Sometimes they use GLSL's preprocessor. Example

#ifdef USE_TEXTURE
  uniform sampler2D u_tex;
  varying vec2 v_texcoord;
#else
  uniform vec4 u_color;
#endif

void main() {
  #ifdef USE_TEXTURE
    gl_FragColor = texture2D(u_tex, v_texcoord);
  #else 
    gl_FragColor = u_color;
  #endif
}

Then at runtime prepend a string to define USE_TEXTURE.

JavaScript

var prefix = useLighting ? '#define USE_TEXTURE' : '';
var shaderSource = prefix + originalShaderSource;

Most engines though do a lot more string manipulation by taking lots of small chunks of GLSL and combining them with various string substitutions.