Using OpenGL ES 2.0 inside CCRenderTexture - ios

Question

I am trying to follow a tutorial on Dynamic Textures in iOS by Ray Wenderlich
http://www.raywenderlich.com/3857/how-to-create-dynamic-textures-with-ccrendertexture
but using Cocos2D 2.0 and OpenGL ES 2.0 instead of 1.1. The tutorial begins by drawing a coloured square to the screen with a shadow gradient applied to it, but I cannot get the gradient to render to the coloured square. This part of the tutorial is where OpenGL ES code is sent to the CCRenderTexture, so I figure I must be setting up my OpenGL ES 2.0 code wrong (I have very little experience with OpenGL / OpenGL ES). The OpenGL ES 1.1 code is
glDisable(GL_TEXTURE_2D);
glDisableClientState(GL_TEXTURE_COORD_ARRAY);
float gradientAlpha = 0.7;
CGPoint vertices[4];
ccColor4F colors[4];
int nVertices = 0;
vertices[nVertices] = CGPointMake(0, 0);
colors[nVertices++] = (ccColor4F){0, 0, 0, 0 };
vertices[nVertices] = CGPointMake(textureSize, 0);
colors[nVertices++] = (ccColor4F){0, 0, 0, 0};
vertices[nVertices] = CGPointMake(0, textureSize);
colors[nVertices++] = (ccColor4F){0, 0, 0, gradientAlpha};
vertices[nVertices] = CGPointMake(textureSize, textureSize);
colors[nVertices++] = (ccColor4F){0, 0, 0, gradientAlpha};
glVertexPointer(2, GL_FLOAT, 0, vertices);
glColorPointer(4, GL_FLOAT, 0, colors);
glDrawArrays(GL_TRIANGLE_STRIP, 0, (GLsizei)nVertices);
glEnableClientState(GL_TEXTURE_COORD_ARRAY);
glEnable(GL_TEXTURE_2D);
which goes between the CCRenderTexture begin and end methods (full code can be found at the above link). My Cocos2D 2.0 / OpenGL ES 2.0 attempt is
float gradientAlpha = 0.7;
CGPoint vertices[4];
ccColor4F colors[4];
int nVertices = 0;
vertices[nVertices] = CGPointMake(0, 0);
colors[nVertices++] = (ccColor4F){0, 0, 0, 0 };
vertices[nVertices] = CGPointMake(textureSize, 0);
colors[nVertices++] = (ccColor4F){0, 0, 0, 0};
vertices[nVertices] = CGPointMake(0, textureSize);
colors[nVertices++] = (ccColor4F){0, 0, 0, gradientAlpha};
vertices[nVertices] = CGPointMake(textureSize, textureSize);
colors[nVertices++] = (ccColor4F){0, 0, 0, gradientAlpha};
// Setup OpenGl ES shader programs
CCGLProgram *positionColourProgram = [[CCShaderCache sharedShaderCache] programForKey:kCCShader_PositionColor];
[rt setShaderProgram:positionColourProgram];
ccGLEnableVertexAttribs(kCCVertexAttribFlag_Position | kCCVertexAttribFlag_Color);
glVertexAttribPointer(kCCVertexAttrib_Position, 2, GL_FLOAT, GL_FALSE, 0, vertices);
glVertexAttribPointer(kCCVertexAttrib_Color, 4, GL_FLOAT, GL_FALSE, 0, colors);
glDrawArrays(GL_TRIANGLE_STRIP, 0, (GLsizei)nVertices);
where rt is the CCRenderTexture object. There are no errors in the console but the image on the screen is a solid colour square with no gradient. Do I need to use an OpenGL blending function perhaps? Any help would be much appreciated. Thanks in advance.

Answer 1

I have figured out the changes needed to make it \work and I posted my comment in the tutorial's forum http://www.raywenderlich.com/forums//viewtopic.php?f=20&t=512&start=40
Hope it is not too late for you.
To save you time from looking through the forum to find my posting, here it is what I posted there:
I have posted my fix at:
http://www.wfu.edu/~ylwong/download/cocos2d-2.0-texture/
The HelloWorldLayer.mm is the final file incorporated all the changes so you do not have to type them in. The pdf file marks up the changes in case you want to see what the changes are.
Basically, in addition to replacing the statements that are not supported in OpenGLES 2.0, I have to add code to set up the shaders for vertex and fragment. Also, instead of using the range 0 to textureSize in the vertex arrays, I have to use the range -1 to 1, which means that in setting up the vertex arrays, the texture width is now 2, 0 becomes -1, and textureSize becomes 1.
To set up the shaders for that tutorial, we can use the ones that come with Cocos2d or write custom but simple shaders. I have included both methods to choose from.
Hope this helps!