How do you pass webgl functions as variables

Question

I could not figure out how to do this. I keep getting an illegal invocation. Let's say that from a function in my program I call a function ...

setGlState( cGl.DEPTH_WRITEMASK, true, cGl.depthMask );

So I'm passing different states and functions to the setGlState function so that it can make some decisions and call the gl function if it needs to set state.

setGlState = function ( cap, value, setterFunc ) {
    ....

    if( needsToBeSent ) {
        setterFunc( value ) 
    }
}

For some reason this code does not work. Do I need to bind the function or call the function? Is it a problem that the function is on the gl context. I

Answer 1

You need to pass a new function that will call the old function in the right context (so this is cGl inside the function).

bind will do that for you.

setGlState( cGl.DEPTH_WRITEMASK.bind(cGl), true, cGl.depthMask.bind(cGl) );

The documentation linked to above includes a shim for browsers that do not natively support bind .