Replicating background warp effect

Started by Ezekiel000, Tue 25/09/2012 13:04:58

Previous topic - Next topic

Ezekiel000

I'm trying to recreate an effect, it is a consistent ripple/wave distortion so.
I started with the LakeModule as a base and modified it to be a single instance in the room script as I only need it once.
I got the ripple to reverse and stopped the ripple from tapering but it doesn't look right and the warped image doesn't scroll up.
I was hoping that someone who is better at maths and ags scripting could help me match the original warp.

The background image is http://s8.postimage.org/ffcydh879/arena_bg.png (tiles vertically)

And an animation of the resulting effect: http://s8.postimage.org/x44p53jyd/10000.gif


I'm running ags 2.72, arena_bg.png is set as background frame 2, my current code looks like this:
Code: AGS
// room script file

/********************************************
* Background                                *
********************************************/

int displayFrame = 1;
int bufferFrame = 2;

int bg_y = 8;
int bg_h = 255; // should be 208
int buf_y = 255;

float bg_speed = 1.0;

float bg_yRipplePhaseScale = 1.0;
float bg_yRippleSize = 0.0;
float bg_yRippleDensity = 3.0;

float bg_xRipplePhaseScale = 1.0;
float bg_xRippleDensity = 0.5;
float bg_xRippleSize = 5.0;

float bg_yPhase = 2.0;
float bg_xPhase = 2.0;

function bg_warp()
{
  float phaseScalar = Maths.Pi/IntToFloat(GetGameSpeed());
  
  bg_yPhase += bg_speed * bg_yRipplePhaseScale * phaseScalar;
  while (bg_yPhase > 2.0 * Maths.Pi) bg_yPhase -= 2.0 * Maths.Pi;
  
  bg_xPhase += bg_speed * bg_xRipplePhaseScale * phaseScalar;
  while (bg_xPhase > 2.0 * Maths.Pi) bg_xPhase -= 2.0 * Maths.Pi;

  float fh = IntToFloat(bg_h);
  
  int i = 0;
  while (i < bg_h)
  {
    float fi = IntToFloat(i);
    float yAngle = (bg_yRippleDensity * (fh - fi)) + bg_yPhase;
    float yoff = bg_yRippleSize * (28.0 / 14.0) * (1.0 + Maths.Sin(yAngle));
    int yoffi = FloatToInt(yoff);
    int yi = i - yoffi;
    if (yi >= 0)
    {
      float xAngle = (bg_xRippleDensity * (fh - fi) ) + bg_xPhase;
      float xoff = bg_xRippleSize * (28.0 / 14.0) * (1.0 + Maths.Sin(xAngle));
      int xoffi = FloatToInt(xoff);

      //an attempt to get the image to scroll
      //if (buf_y - i <= 1) buf_y = 255;
      DynamicSprite *s = DynamicSprite.CreateFromBackground(bufferFrame, xoffi, buf_y - yi, 320 - xoffi, 1);
      RawDrawImageResized(0 + xoffi/2, bg_y + bg_h - i, s.Graphic, 320 - xoffi/2, 1);
      s.Delete();
    }
    i++;
  }
  //an attempt to get the image to scroll
  //buf_y = buf_y - bg_h;
}

#sectionstart room_a  // DO NOT EDIT OR REMOVE THIS LINE
function room_a()
{
  // script for Room: Player enters room (before fadein)
  SetViewport(0, 0);
  SetBackgroundFrame(displayFrame);
}
#sectionend room_a  // DO NOT EDIT OR REMOVE THIS LINE

function repeatedly_execute_always()
{
  bg_warp();
}

Ezekiel000

I managed to get much closer to the original warp, if anyone else was interested here it is:
Code: AGS
/********************************************
* Background                                *
********************************************/

int displayFrame = 1;
int bufferFrame = 2;

int baseline = 255;
int amplitude = 30;
float frequency = 0.1;

int r = 1;

function bg_warp()
{
  if (r == 0)
  {
    int next_line = baseline;
    int i = 0;
    while (i < 164)
    {
      float x_offset = Maths.Sin(IntToFloat(i) * frequency) * IntToFloat(amplitude);
      int x_offset_i = FloatToInt(x_offset);
      DynamicSprite *s = DynamicSprite.CreateFromBackground(bufferFrame, x_offset_i + amplitude, next_line, 320 - (amplitude * 2), 1);
      RawDrawImageResized(0, 186 - i, s.Graphic, 320, 1);
      s.Delete();
      if (next_line - 1 == -1) next_line = 255;
      else next_line--;
      i++;
    }
    baseline++;
    if (baseline < 0) baseline = 255 + baseline;
    if (baseline > 255) baseline = baseline - 255;
    r = 1;
  }
  else r--;
}

SMF spam blocked by CleanTalk