[Effect] Again, ripple with lookup table

cocos2d for iPhone » Programming » cocos2d support (graphics engine)

[Effect] Again, ripple with lookup table

(31 posts) (8 voices)

Started 1 year ago by gabrielstuff
Latest reply from araker

Tags:

gabrielstuff
Member

Hi there,
As I'm still trying to run the CCMutableTexture ripple filter effect, I am also making a port of ripple from 1993. As far as I've tried, it compiles and run without warning or errors... but stilles, nothing shows up... the fps should be great !
The port is quiet "easy" as it is already prepared for openGLES.

Here is the snippet code,

-(void) initGL{

	glPixelStorei ( GL_UNPACK_ALIGNMENT, 1 );
	glClearColor ( 0.0f, 0.0f, 0.25f, 1.0f );
	glShadeModel ( GL_SMOOTH );
	glDisable ( GL_CULL_FACE );	

	// ask director the the window size
	CGSize winSize = [[CCDirector sharedDirector] winSize];

	image = [CCSprite node];
	[image setPosition:ccp(winSize.width/2, winSize.height/2)];

	//asign pixelData from loaded image
	[CCTexture2D setDefaultAlphaPixelFormat:kCCTexture2DPixelFormat_RGBA8888];
	ripTexture_ = [[CCTexture2DMutable alloc] initWithImage:[UIImage imageNamed:@"image.jpg"]];
	ccColor4B*  pixels = ripTexture_.texData;

	glGenTextures   ( 1, &idImg );
	glEnable	    ( GL_TEXTURE_2D );
	glBindTexture   ( GL_TEXTURE_2D , idImg );
	glTexImage2D    ( GL_TEXTURE_2D , 0, GL_RGB, TEXTURE_WIDTH, TEXTURE_HEIGHT, 0, GL_RGB, GL_UNSIGNED_BYTE, pixels );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_MAG_FILTER, GL_LINEAR );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_MIN_FILTER, GL_LINEAR );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE );

	//free image ???

	[self addChild:image];

	NSLog(@"initGL end");
}

-(void) draw
{
	glClear ( GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT );

	CGSize s = [[CCDirector sharedDirector] winSize];

/*	glMatrixMode( GL_PROJECTION );
	glLoadIdentity();	

	glOrthox( f2vt( -0.5f ), f2vt( gscry + 0.5f ), f2vt( -0.5f ), f2vt( gscrx + 0.5f ), f2vt( CLIP_NEAR ), f2vt( CLIP_FAR ) );

	glMatrixMode( GL_MODELVIEW );
	glLoadIdentity();
*/

	// draw a simple line
	// The default state is:
	// Line Width: 1
	// color: 255,255,255,255 (white, non-transparent)
	// Anti-Aliased
	glEnable(GL_LINE_SMOOTH);
	ccDrawLine( ccp(0, 0), ccp(s.width, s.height) );

	// line: color, width, aliased
	// glLineWidth > 1 and GL_LINE_SMOOTH are not compatible
	// GL_SMOOTH_LINE_WIDTH_RANGE = (1,1) on iPhone
	glDisable(GL_LINE_SMOOTH);
	glLineWidth( 5.0f );
	glColor4ub(255,0,0,255);
	ccDrawLine( ccp(0, s.height), ccp(s.width, 0) );

	// TIP:
	// If you are going to use always the same color or width, you don't
	// need to call it before every draw
	//
	// Remember: OpenGL is a state-machine.

	// draw big point in the center
	glPointSize(64);
	glColor4ub(0,0,255,128);
	ccDrawPoint( ccp(s.width / 2, s.height / 2) );

	// draw 4 small points
	CGPoint points[] = { ccp(60,60), ccp(70,70), ccp(60,70), ccp(70,60) };
	glPointSize(4);
	glColor4ub(0,255,255,255);
	ccDrawPoints( points, 4);

	// restore original values
	glLineWidth(1);
	glColor4ub(255,255,255,255);
	glPointSize(1);

	[self ripple_redraw];	

	glFlush ( );
}

/* Draw the next frame of animation. */
-(void)ripple_redraw{

	CGSize winSize = [[CCDirector sharedDirector] winSize];

	glScissor ( 0, 0, winSize.width, winSize.height );	

	glEnable(GL_SCISSOR_TEST);
	glDisable( GL_DEPTH_TEST );

	glLoadIdentity();

	glEnableClientState( GL_VERTEX_ARRAY );
	glEnableClientState( GL_TEXTURE_COORD_ARRAY );	

	glVertexPointer  ( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].x );
	glTexCoordPointer( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].t );
	glDrawElements   ( GL_TRIANGLES, GRID_SIZE_X * GRID_SIZE_Y * 6, GL_UNSIGNED_SHORT, ripple_Indices );

	glDisableClientState( GL_VERTEX_ARRAY );
	glDisableClientState( GL_TEXTURE_COORD_ARRAY );	

	glEnable( GL_DEPTH_TEST );
	glDisable(GL_SCISSOR_TEST);

	[image setTexture:ripTexture_];
	[image setTextureRect:CGRectMake(0, 0, ripTexture_.contentSize.width, ripTexture_.contentSize.height)];
}

full source si here (available for 4 days) :
http://demo.ovh.net/fr/e854460f75a2bdf20015f645b3f0d17f/

If anyone got time to try it.... I'm getting kind of stuck...

Thanks

Posted 1 year ago #

araker
Moderator

Sorry but this code is a mess, I don't want to sound condescending here, but I can see that you don't have a clue about OpenGL. When you want to work with OpenGL try to have a least a basic understanding of it. I'll point out the 4 biggest flaws, try to find the other ones yourself.

- What are you doing with the texture, that code has no effect (it generates a texture) but that texture will not be bound anymore when the drawing code is reached (presuming you're also using other textures)
- Don't use glFlush
-Don't use glLoadIdentity(), use glPushMatrix before drawing and glPopMatrix after drawing
- Don't disable GL_VERTEX_ARRAY and GL_TEXTURE_COORD_ARRAY after the drawing, since other draw commands rely on those

Posted 1 year ago #
gabrielstuff
Member

Hi and thank you.

As I want to learn, I do not see why GLFlush is bad :

DESCRIPTION
Different GL implementations buffer commands in several different locations, including network buffers and the graphics accelerator itself. glFlush empties all of these buffers, causing all issued commands to be executed as quickly as they are accepted by the actual rendering engine. Though this execution may not be completed in any particular time period, it does complete in finite time.

Because any GL program might be executed over a network, or on an accelerator that buffers commands, all programs should call glFlush whenever they count on having all of their previously issued commands completed. For example, call glFlush before waiting for user input that depends on the generated image.

NOTES
glFlush can return at any time. It does not wait until the execution of all previously issued OpenGL commands is complete.

ERRORS
GL_INVALID_OPERATION is generated if glFlush is called between a call to glBegin and the corresponding call to glEnd.

SEE ALSO
"glFinish"

So, mixing it with cocos could make bad performance or issue ?

As for glLoadIdentity, I totaly get it, I might change the parameters of cocos... and thus make a bad bad result in the final rendering. So appologies for that and thank you.

Finaly for GL_VERTEX_ARRAY and GL_TEXTURE_COORD_ARRAY, it is kind of hard, as I was enabling it, I guess it should be nice to me to give it back...

From the definitio :

C Specification

void glEnableClientState( GLenum cap);
Parameters

cap
Specifies the capability to enable. Symbolic constants GL_COLOR_ARRAY, GL_EDGE_FLAG_ARRAY, GL_FOG_COORD_ARRAY, GL_INDEX_ARRAY, GL_NORMAL_ARRAY, GL_SECONDARY_COLOR_ARRAY, GL_TEXTURE_COORD_ARRAY, and GL_VERTEX_ARRAY are accepted.

C Specification

void glDisableClientState( GLenum cap);
Parameters

cap
Specifies the capability to disable.

Description

glEnableClientState and glDisableClientState enable or disable individual client-side capabilities. By default, all client-side capabilities are disabled. Both glEnableClientState and glDisableClientState take a single argument, cap, which can assume one of the following values

Well, the thing I totally miss is the mix of cocos2d and opengL. As you say this...

- What are you doing with the texture, that code has no effect (it generates a texture) but that texture will not be bound anymore when the drawing code is reached (presuming you're also using other textures)

I absolutely do not get where the hell... my texture is gone :( how should one load and display texture using cocos and opengl native code ?

Thank you and sorry for this mess !

Posted 1 year ago #

gabrielstuff
Member

Sorry I could not edit the code up there. Here is the new one far better !! :

-(void) initGL{

	glPixelStorei ( GL_UNPACK_ALIGNMENT, 1 );
	glShadeModel ( GL_SMOOTH );
	glDisable ( GL_CULL_FACE );	

	// ask director the the window size
	CGSize winSize = [[CCDirector sharedDirector] winSize];

	image = [CCSprite node];
	[image setPosition:ccp(winSize.width/2, winSize.height/2)];

	//asign pixelData from loaded image
	[CCTexture2D setDefaultAlphaPixelFormat:kCCTexture2DPixelFormat_RGBA8888];
	ripTexture_ = [[CCTexture2DMutable alloc] initWithImage:[UIImage imageNamed:@"image.jpg"]];
	ccColor4B*  pixels = ripTexture_.texData;

	glGenTextures   ( 1, &idImg );
	glEnable	    ( GL_TEXTURE_2D );
	glBindTexture   ( GL_TEXTURE_2D , idImg );
	glTexImage2D    ( GL_TEXTURE_2D , 0, GL_RGB, TEXTURE_WIDTH, TEXTURE_HEIGHT, 0, GL_RGB, GL_UNSIGNED_BYTE, pixels );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_MAG_FILTER, GL_LINEAR );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_MIN_FILTER, GL_LINEAR );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE );
	glTexParameteri ( GL_TEXTURE_2D , GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE );

	//free image ???

	[self addChild:image];

	NSLog(@"initGL end");
}

And for the draw :

-(void) draw
{

	[self ripple_redraw];	

	CGSize s = [[CCDirector sharedDirector] winSize];

	// line: color, width, aliased
	// glLineWidth > 1 and GL_LINE_SMOOTH are not compatible
	// GL_SMOOTH_LINE_WIDTH_RANGE = (1,1) on iPhone
	glDisable(GL_LINE_SMOOTH);
	glLineWidth( 5.0f );
	glColor4ub(255,0,0,255);
	ccDrawLine( ccp(0, s.height), ccp(s.width, 0) );

}

/* Draw the next frame of animation. */
-(void)ripple_redraw{

	glDisable( GL_DEPTH_TEST );

	glEnableClientState( GL_VERTEX_ARRAY );
	glEnableClientState( GL_TEXTURE_COORD_ARRAY );	

	glVertexPointer  ( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].x );
	glTexCoordPointer( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].t );
	glDrawElements   ( GL_TRIANGLES, GRID_SIZE_X * GRID_SIZE_Y * 6, GL_UNSIGNED_SHORT, ripple_Indices );

	glEnable( GL_DEPTH_TEST );

	[image setTexture:ripTexture_];
	[image setTextureRect:CGRectMake(0, 0, ripTexture_.contentSize.width, ripTexture_.contentSize.height)];
}

So now, I get a texture... but not the good one... I only get the original one, not the one created by glDrawElements. Kind of logical as i display the sprite at the end :(

Posted 1 year ago #

araker
Moderator

Since you want to learn, let me give you a few useful resources..

-the apple opengl es documentation
- the apple opengl es platform notes (explains why you shouldn't call glFinish)
- OpenGL ES from the ground up, this blog is probably one of the best online resources for starting with OpenGL ES
- for even more understanding, the red book, it's a bit old and deals with OpenGL but it is still vary valid for explaining the different parts of OpenGL.

Posted 1 year ago #
gabrielstuff
Member

- OpenGL ES from the ground up, this blog is probably on of the best online resources for starting with OpenGL ES

already know this blog and love it ! thanks !

Posted 1 year ago #
araker
Moderator

I forgot a few points..

For the texture take a look at CCTexture2D, it shows how to correctly load a texture. How to bind a texture before drawing, look up the draw method from CCSprite for instance.

Cocos already sets many OpenGL states and you don't have to set them again. Look at CCDirector to see which ones.

Posted 1 year ago #

gabrielstuff
Member

Thank you very much @Araker, I've been thru the all classes and code, I've been reading the infos there :
http://sio2interactive.forumotion.net/t814-patch-less-footprint-to-load-png
and there :
http://www.songho.ca/opengl/gl_vertexarray.html
http://www.opengl.org/wiki/Common_Mistakes
http://www.opengl.org/wiki/Programming_OpenGL_in_Linux:_Creating_a_texture_from_a_Pixmap

I've shrink the code, and make less messy. It runs, and I do not see memory link in the instruments. I just see the square...

Here is the very simplify code.

I've also put a totaly easy to run test, with a quad drawing from the routine of cocos. The quad appear in wireframe mode, but my whole image does not pop up... I guess, this is due to something with my vertices... I've read there is kind of offset to setup into the cocos sprite (CCSprite)

@implementation TestGL
- (id) init{
	if((self = [super init])){
		self.initRipple;
		self.initGL;
	}
	return self;
}

-(void) initGL{
	//asign pixelData from loaded image

	[CCTexture2D setDefaultAlphaPixelFormat:kCCTexture2DPixelFormat_RGBA8888];
	CCTexture2D *texture = [[CCTextureCache sharedTextureCache] addImage: @"image.jpg"];
	if( texture ) {
		CGRect rect = CGRectZero;
		rect.size = texture.contentSize;
		[texture_ release];
		texture_ = [texture retain];
	}

	NSLog(@"initGL end");
}

-(void) draw
{
	[self ripple_redraw];		

	CGPoint vertices[] = { ccp(50,100), ccp(50,50), ccp(100,50), ccp(100,100), ccp(50,100) };

	ccVertex2F newPoint[5];
	bool closePolygon = FALSE;

	glEnable(GL_TEXTURE_2D);

	glBindTexture(GL_TEXTURE_2D, [texture_ name]);

	if( sizeof(CGPoint) == sizeof(ccVertex2F) ) {

		// convert to pixels ?
		if( CC_CONTENT_SCALE_FACTOR() != 1 ) {
			memcpy( newPoint, vertices, 5 * sizeof(ccVertex2F) );
			for( NSUInteger i=0; i<5;i++)
				newPoint[i] = (ccVertex2F) { vertices[i].x * CC_CONTENT_SCALE_FACTOR(), vertices[i].y * CC_CONTENT_SCALE_FACTOR() };

			glVertexPointer(2, GL_FLOAT, 0, newPoint);

		} else
			glVertexPointer(2, GL_FLOAT, 0, vertices);

	}else {
		for( NSUInteger i=0; i<5;i++)
			newPoint[i] = (ccVertex2F) { vertices[i].x, vertices[i].y };

		glVertexPointer(2, GL_FLOAT, 0, newPoint );
	}

	 if( closePolygon )
		 glDrawArrays(GL_LINE_LOOP, 0, 5);
	 else
		 glDrawArrays(GL_LINE_STRIP, 0, 5);
}

/* Draw the next frame of animation. */
-(void)ripple_redraw{	

	glEnable(GL_TEXTURE_2D);

	glBindTexture(GL_TEXTURE_2D, [texture_ name]);

	glDisable( GL_DEPTH_TEST );

	glEnableClientState( GL_VERTEX_ARRAY );
	glEnableClientState( GL_TEXTURE_COORD_ARRAY );	

	glVertexPointer  ( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].x );
	glTexCoordPointer( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].t );
	glDrawElements   ( GL_TRIANGLES, GRID_SIZE_X * GRID_SIZE_Y * 6, GL_UNSIGNED_SHORT, ripple_Indices );
	glEnable( GL_DEPTH_TEST );
        glDisable(GL_TEXTURE_2D);
}

Posted 1 year ago #

araker
Moderator

This surely looks much better. You're not using the color array, then you must disable it before drawing and enable it after drawing. Beware though that the last color set with glColor will be used.

In your draw method you don't need to enable and bind the texture, since line loop and line strip don't use the texture data since they draw primitives. Don't forget to turn on the default states again if you're using this inside cocos (like ccDrawLine does).

I don't think it matters much if you leave the depth test the way it is (don't disable or enable it).

As you probably already red, changing state in OpenGl is expensive, even redundant state changes have a small overhead (ie enabling texture2d when it is already on).

Posted 1 year ago #

gabrielstuff
Member

Thanks !

I've read the default state of cocos2d and simplifying again I get this :

@implementation TestGL

- (id) init{
	if((self = [super init])){
		self.initRipple;
		self.initGL;
	}
	return self;
}

-(void) initGL{

	[CCTexture2D setDefaultAlphaPixelFormat:kCCTexture2DPixelFormat_RGBA8888];
	CCTexture2D *texture = [[CCTextureCache sharedTextureCache] addImage: @"image.jpg"];
	if( texture ) {
		CGRect rect = CGRectZero;
		rect.size = texture.contentSize;
		[texture_ release];
		texture_ = [texture retain];
	}

	NSLog(@"initGL end");
}

-(void) draw
{
	[self ripple_redraw];
}

/* Draw the next frame of animation. */
-(void)ripple_redraw{	

	glBindTexture(GL_TEXTURE_2D, [texture_ name]);

	// Default GL states: GL_TEXTURE_2D, GL_VERTEX_ARRAY, GL_COLOR_ARRAY, GL_TEXTURE_COORD_ARRAY
	// Needed states: GL_VERTEX_ARRAY,
	// Unneeded states: GL_TEXTURE_2D, GL_TEXTURE_COORD_ARRAY, GL_COLOR_ARRAY	

	//by default in cocos2D
	//glEnableClientState( GL_VERTEX_ARRAY );
	//glEnableClientState( GL_TEXTURE_COORD_ARRAY );	

	glVertexPointer  ( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].x );
	glTexCoordPointer( 2, GL_FLOAT, sizeof( struct Ripple_VERTEX ), ripple_vertex[0][0].t );
	glDrawElements   ( GL_TRIANGLES, GRID_SIZE_X * GRID_SIZE_Y * 6, GL_UNSIGNED_SHORT, ripple_Indices );

}

-(void) initRipple{

	posX = 0;
	posY = 0;

	CGSize winSize = [[CCDirector sharedDirector] winSize];

	int	i, j, index;
	ripple_max = (int) sqrt( (float) ( 768 * 768 + 1024 * 1024 ) );

	for ( i = 0; i < RIPPLE_COUNT; i++ )
	{
		t  [i] = ripple_max + RIPPLE_LENGTH;
		cx [i] = 0;
		cy [i] = 0;
		max[i] = 0;
	}

	for ( i = 0; i < GRID_SIZE_X; i++ )
	{
		for ( j = 0; j < GRID_SIZE_Y; j++ )
		{
			ripple_vertex[i][j].x [0] = i / ( GRID_SIZE_X - 1.f ) * gscrx;
			ripple_vertex[i][j].x [1] = j / ( GRID_SIZE_Y - 1.f ) * gscry;
			ripple_vertex[i][j].dt[0] = i / ( GRID_SIZE_X - 1.f );
			ripple_vertex[i][j].dt[1] = j / ( GRID_SIZE_Y - 1.f );
		}
	}

	for ( i = 0; i < GRID_SIZE_Y-1; i++ )
	{
		for ( j = 0; j < GRID_SIZE_X-1; j++ )
		{
			index = i * GRID_SIZE_X + j;
			ripple_Indices[index * 6 + 0] = ( i     ) * GRID_SIZE_X + j;
			ripple_Indices[index * 6 + 1] = ( i + 1 ) * GRID_SIZE_X + j;
			ripple_Indices[index * 6 + 2] = ( i + 1 ) * GRID_SIZE_X + j + 1;
			ripple_Indices[index * 6 + 3] = ( i     ) * GRID_SIZE_X + j;
			ripple_Indices[index * 6 + 4] = ( i + 1 ) * GRID_SIZE_X + j + 1;
			ripple_Indices[index * 6 + 5] = ( i     ) * GRID_SIZE_X + j + 1;
		}
	}
	[self ripple_reshape:winSize.width height:winSize.height];

	[self schedule:@selector(ripple_dynamics:)];
	NSLog(@"initRipple End");
}

The project is available here :
http://demo.ovh.net/fr/142c945fa1e9512ce5f70bd47fe7ae8f/

The original one is available here via svn :
svn co https://openkode.svn.sourceforge.net/svnroot/openkode openkode in :
openkode/05_Demo/XMGL_Ripple_Effect/proj/xcode

I'm sure to be one line to the end... actually not really as the main idea is to apply this effect on any texture during the game ^^

Thank you again Araker, you're a great helper and a wise adviser. reading... reading...

Posted 1 year ago #

gabrielstuff
Member

Youha !
I was passing an empty array ! I fixed this and now, let me introduces you .... a very bad texture :

Somekind of blending ? or ?

Thanks to you...
I feel it cool as the fps is really neat !

Posted 1 year ago #
ddeaco
Member

looks like some strange vertex coloring/lighting, maybe have a look into that...

Posted 1 year ago #
araker
Moderator

Congratulations :) In your ripple redraw method you still don't disable the color array, so you don't know with which color your vertices will blend with.

ie

// Needed states: GL_VERTEX_ARRAY, GL_TEXTURE_2D, GL_TEXTURE_COORD_ARRAY
// Unneeded states: GL_COLOR_ARRAY

For debugging, you could try to display the texture as a whole on one screen filling quad, without any ripples. If it displays correctly, the problem must be in your vertices or indices.

Posted 1 year ago #
gabrielstuff
Member

YOUHOU !
You spot it !
glDisableClientState(GL_COLOR_ARRAY);

Now it is ok. But nothing move.... Keep searchin' !

Posted 1 year ago #
ddeaco
Member

I cant spot anything obvious, All of your events seem to be triggering fine.

I'm sure you will get it :)

Keep us posted.

Posted 1 year ago #
gabrielstuff
Member

Hey... how could I check that ... the texture is redraw for real. I mean how to be sure that it uses the new coordinates ?

I double check the vertices array and texture array and they seems to be modified. With the original solution, I've got this :

With mine + cocos2D, I've got this :

So I guess I have an ordering problem ? or something similar ?

Posted 1 year ago #

gabrielstuff
Member

Hi...
Sorry to throw out this bunch of code... but I've double check and it appears that my vertices are modified the same way in both app.

Working version (without cocos2D)

XM_EVENT_TOUCH_DOWN : id = 0, x = 548, y = 394
X = x = 0.000000 et y = 0.000000
-----
DT = x = 0.000000 et y = 0.000000
-----
T = x = 0.000000 et y = 0.000000
-----
X = x = 0.000000 et y = 33.032257
-----
DT = x = 0.000000 et y = 0.032258
-----
T = x = 0.000000 et y = 0.032258
-----
X = x = 0.000000 et y = 66.064514
-----
DT = x = 0.000000 et y = 0.064516
-----
T = x = 0.000000 et y = 0.064516
-----
X = x = 0.000000 et y = 99.096771
-----
DT = x = 0.000000 et y = 0.096774
-----
T = x = 0.000000 et y = 0.096774
-----
X = x = 0.000000 et y = 132.129028
-----
DT = x = 0.000000 et y = 0.129032
-----
T = x = 0.000000 et y = 0.129032
-----
X = x = 0.000000 et y = 165.161285
-----
DT = x = 0.000000 et y = 0.161290
-----
T = x = 0.000000 et y = 0.161290
-----
X = x = 0.000000 et y = 198.193542
-----
DT = x = 0.000000 et y = 0.193548
-----
T = x = 0.000000 et y = 0.193548
-----
X = x = 0.000000 et y = 231.225800
-----
DT = x = 0.000000 et y = 0.225806
-----
T = x = 0.000000 et y = 0.225806
-----
X = x = 0.000000 et y = 264.258057
-----
DT = x = 0.000000 et y = 0.258065
-----
T = x = 0.000000 et y = 0.258065

Not working version (with cocos2D)

2011-02-02 17:42:19.540 ripple93[6039:307] touch end
2011-02-02 17:42:19.551 ripple93[6039:307] X = x = 0.000000 et y = 0.000000
2011-02-02 17:42:19.554 ripple93[6039:307] -----
2011-02-02 17:42:19.557 ripple93[6039:307] DT = x = 0.000000 et y = 0.000000
2011-02-02 17:42:19.560 ripple93[6039:307] -----
2011-02-02 17:42:19.563 ripple93[6039:307] T = x = 0.000000 et y = 0.000000
2011-02-02 17:42:19.565 ripple93[6039:307] -----
2011-02-02 17:42:19.568 ripple93[6039:307] X = x = 0.000000 et y = 33.032257
2011-02-02 17:42:19.571 ripple93[6039:307] -----
2011-02-02 17:42:19.573 ripple93[6039:307] DT = x = 0.000000 et y = 0.032258
2011-02-02 17:42:19.575 ripple93[6039:307] -----
2011-02-02 17:42:19.578 ripple93[6039:307] T = x = 0.000000 et y = 0.032258
2011-02-02 17:42:19.581 ripple93[6039:307] -----
2011-02-02 17:42:19.583 ripple93[6039:307] X = x = 0.000000 et y = 66.064514
2011-02-02 17:42:19.586 ripple93[6039:307] -----
2011-02-02 17:42:19.589 ripple93[6039:307] DT = x = 0.000000 et y = 0.064516
2011-02-02 17:42:19.592 ripple93[6039:307] -----
2011-02-02 17:42:19.594 ripple93[6039:307] T = x = 0.000000 et y = 0.064516
2011-02-02 17:42:19.597 ripple93[6039:307] -----
2011-02-02 17:42:19.599 ripple93[6039:307] X = x = 0.000000 et y = 99.096771
2011-02-02 17:42:19.602 ripple93[6039:307] -----
2011-02-02 17:42:19.604 ripple93[6039:307] DT = x = 0.000000 et y = 0.096774
2011-02-02 17:42:19.607 ripple93[6039:307] -----
2011-02-02 17:42:19.609 ripple93[6039:307] T = x = 0.000000 et y = 0.096774
2011-02-02 17:42:19.611 ripple93[6039:307] -----
2011-02-02 17:42:19.612 ripple93[6039:307] X = x = 0.000000 et y = 132.129028
2011-02-02 17:42:19.613 ripple93[6039:307] -----
2011-02-02 17:42:19.615 ripple93[6039:307] DT = x = 0.000000 et y = 0.129032
2011-02-02 17:42:19.616 ripple93[6039:307] -----
2011-02-02 17:42:19.617 ripple93[6039:307] T = x = 0.000000 et y = 0.129032
2011-02-02 17:42:19.619 ripple93[6039:307] -----
2011-02-02 17:42:19.623 ripple93[6039:307] X = x = 0.000000 et y = 165.161285
2011-02-02 17:42:19.624 ripple93[6039:307] -----
2011-02-02 17:42:19.626 ripple93[6039:307] DT = x = 0.000000 et y = 0.161290
2011-02-02 17:42:19.627 ripple93[6039:307] -----
2011-02-02 17:42:19.628 ripple93[6039:307] T = x = 0.000000 et y = 0.161290
2011-02-02 17:42:19.629 ripple93[6039:307] -----
2011-02-02 17:42:19.632 ripple93[6039:307] X = x = 0.000000 et y = 198.193542
2011-02-02 17:42:19.634 ripple93[6039:307] -----
2011-02-02 17:42:19.635 ripple93[6039:307] DT = x = 0.000000 et y = 0.193548
2011-02-02 17:42:19.636 ripple93[6039:307] -----
2011-02-02 17:42:19.638 ripple93[6039:307] T = x = 0.000000 et y = 0.193548
2011-02-02 17:42:19.639 ripple93[6039:307] -----
2011-02-02 17:42:19.640 ripple93[6039:307] X = x = 0.000000 et y = 231.225800
2011-02-02 17:42:19.645 ripple93[6039:307] -----
2011-02-02 17:42:19.646 ripple93[6039:307] DT = x = 0.000000 et y = 0.225806
2011-02-02 17:42:19.648 ripple93[6039:307] -----
2011-02-02 17:42:19.649 ripple93[6039:307] T = x = 0.000000 et y = 0.225806
2011-02-02 17:42:19.650 ripple93[6039:307] -----
2011-02-02 17:42:19.652 ripple93[6039:307] X = x = 0.000000 et y = 264.258057
2011-02-02 17:42:19.654 ripple93[6039:307] -----

I believe this has something to do with the parameters of cocos (point of view, rendering setup ?) everything is update but the effect does not show up : /

I do not get it... last code is up here :

http://demo.ovh.net/fr/c66b36b3e03ae565eb58f7753f9af500/

Thanks :(

Posted 1 year ago #

gabrielstuff
Member

Hello,

I've been working on the rest of the project since I didn't find the mistake I 've done.

Has anyone try to use the project... I've tried many things... but I do not see any ripple.
It would be great if any one just tried the project.
The event are ok, I logged them, and the vertices are modified but the textures still's not moving.

Project is here if anyone want to try it :
http://demo.ovh.net/fr/20a34bc17da718e405a9a87fcfab9be1/

Thanks alot.

Posted 1 year ago #
gabrielstuff
Member
WORKING :)

Ok, this is absolutely not perfect but the ripple is kind of sweet and eye candy (I think). It runs at 60fps, say Cocos2D.
I was linking the wrong files....

In my previous code I should have use the LUT (ripple_table)
struct Ripple_AMP ripple_amp[RIPPLE_LENGTH_ARRAY]

So I redefined it in the class :
```
#import "cocos2d.h"
#import "ripple.h"
#if __cplusplus
extern "C"{
#endif

	extern struct Ripple_VECTOR		ripple_vector[GRID_SIZE_X][GRID_SIZE_Y];
	extern struct Ripple_AMP		ripple_amp[RIPPLE_LENGTH];
#if __cplusplus
}
#endif

@interface CCRipple2DGL : CCLayer
```
I can only recommand you to try it :)

Next step would be to use the screenCapture thing and adding the ability to load withTexture the layer. I still have question :

1. How to do not stretch the texture : /
2. How to make the texture in the right sense ? It is up side down...

Thanks for any hints ! And thank you again for your help Araker.

Here's the code compiling and running :
http://demo.ovh.net/fr/f304f773b02e2a8f66d234996fb3ae2f/
Posted 1 year ago #
araker
Moderator

I've tried your project, the ripple dynamics look really good. Though the edges aren't always correct (ie the part of the red fish that appears sometimes near the upper left corner).

1) As soon as the size of the quad is different than the texture rectangle the texture will be stretched/shrunken. I don't think you can avoid this, since you need to simulate waves.

2) In OpenGL (0,0) is the upper left corner, while in cocos (0,0) is the lower left corner, so you'll need to convert your vertex coordinates (height - y position). The texture coordinate system is the same for cocos and OpenGL (upper left is (0,0)).

Posted 1 year ago #
gabrielstuff
Member

Hum... actually I do not get clearly this point about :

convert your vertex coordinates (height - y position)

Could you explain ?

Thanks,

Posted 1 year ago #
araker
Moderator

You need to subtract your current y-coordinates from the height of the window, then the coordinates will be cocos compatible.

For example in portrait mode it would be 480 - point.y.

Posted 1 year ago #
gabrielstuff
Member

Hum... so thus depending on iPad or iPhone or retina.. Ok I'll check that today ! Thanks !

Posted 1 year ago #
khoonie
Member

hello. The links to demo.ovh.net/fr are dead. Can someone care to repost the sample code? Thanks!

Posted 1 year ago #
MrLucky
Member

Bump

Posted 11 months ago #
araker
Moderator

Here you go. Like you can read in the topic the code doesn't completely work as expected.

Posted 11 months ago #
MrLucky
Member

Thank you! :)

Posted 10 months ago #
pacoloco
Member

Hi, I've get a look.. the effect is WOW! Work fluid also in my old 3G!
Great work Gabriel and tnx to share that!!

I'm trying to modify it to make a linear waves instad of the circular ones.. but I cannot understand these code.. :/
Can anyone help me??

Posted 8 months ago #
mxweas
Member

Will someone report the project? MegaUpload has been seized :|

Posted 3 months ago #
bradparks
Member

Hey.... I've posted a version I had here... not sure how recent it is:

http://dl.dropbox.com/u/274922/ripple93.zip

I'll leave it in my DropBox... and for what it's worth, if anyone's looking for a dead easy alternative to MegaUpload, they should get a free DropBox account. It's a super awesome service.... Here's a referral link that'll just get you more free space (extra 250 meg free, for a total of 2.25 gb) and I'll get 250mb too if you sign up using the link:

https://www.dropbox.com/referrals/NTI3NDkyMjk

Posted 3 months ago #

RSS feed for this topic

12 Next »

Reply »

You must log in to post.