Scale(x,y) and translate(x,y)

[martyzorro]

Hello all -
Over the past several years I’ve tweaked lots of the patterns discussed on this forum, and combined many of them into the same pattern where I can switch among them with a separate button. Thank you to all who have inspired me, I stand on the shoulders of giants. (I promise to show and tell when the projects are done)

I have a few questions saved up, and will post them separately here. Here’s my first:

A few of the 2D sub-patterns use the scale(x,y) operator, such as @zranger1’s beautiful Rippletank and Sea Star. As I understand it, when these patterns are running as standalones this operator is only called once (i.e., not in beforeRender or render2D) … but when these patterns run as subpatterns I have to call scale(x,y) once each time the pattern is selected. Same with translate(x,y).

I’ve figured out how to call scale (x,y) and translate (x,y) only once per pattern, and I think I reset translate (x,y) by negating whatever was there before, but my question is about scale(x,y): if one pattern calls for scale(.5,.5) how does one reset it back to normal? I’ve tried scale(2,2), scale(-.5,-.5) but whatever I try doesn’t fix the 2D patterns (like DoomFire or Spiral Twirls) that come next. Thanks in advance!

[zranger1]

Cool! I look forward to seeing what you’ve made!
There are a couple of ways you might deal with translation and scaling in subpatterns.

First, it’s perfectly OK to call scale/translate/rotate in beforeRender(). You just have to call
resetTransform() first, then do the new transforms you want. Like this:

export function beforeRender(delta) {
  resetTransform();
  translate(-0.5,-0.5);
  scale(4,4);
 ....
 (other code!)
}

The other thing to remember is that you can always do it yourself if you find it handier. Translate and scale in particular are just substitutes for adding and multiplying the x and y coordinates that you get in your render() function. So
scale(2,2);
is equivalent to adding the statements
x = 2 * x; y = 2 * y;
to render2D(), and
translate(-0.5,-0,5) ;
is equivalent to:
x = x-0.5; y = y-0.5;
(remember that order matters here – I usually follow “normal” practice and translate, then scale.)

[martyzorro]

Wow, thank you so much! resetTransform() works perfectly. This is very helpful. More questions to come in their own threads. Thanks!