Rosetta Examples development

Besides that, JS can perform some extra optimizations to the strict code as well: :wink:

Nope! It’s a helper which can always be deleted. :smiling_imp:

2 Likes

So now I wonder; if it’s that good, why isn’t it already included in the compiler?

Just like Java, the ECMA team takes care that future JS versions won’t break compatibility w/ older code! :sunglasses:

2 Likes

All I can say is: Huh ?:question: :slight_smile: I’ve never seen Sierpinski’s like that. Really condensed code too! Not familiar with the p5.js syntax though. But wow. Great stuff!

1 Like

I’ve posted the Sierpinski Carpet task as well on Rosetta, with the usual link to OpenProcessing.

4 Likes

Hosting Sierpinski’s p5.js & Java Mode online versions on OpenProcessing.org: :yum:


4 Likes

Also a Python Mode version on Trinket.io for completeness’ sake. :snake:

Although not very condensed b/c assignments can’t be used as expressions on Python. :unamused:

4 Likes

I posted the Sierpinski arrowhead curve on Rosetta with a link.
I’m trying to code the still missing Sierpinski pentagon with sin/cos, but it’s still a mess.
@GoToLoop did you give it a try?

1 Like

Sorry I’m a bit slow these days! I have almost finished the Plasma example and then everything derailed :confused: Will try to get back :slight_smile:

1 Like

Solved.

float s_angle, scale, margin = 25, total = 4;
float size = 700;
float radius = size/2-2*margin;
float side = radius * sin(PI/5)*2;

void setup() {
  size(590, 590);
  background(0, 0, 200);
  stroke(255);
  s_angle = 72*PI/180;
  scale = 1/(2+cos(s_angle)*2);
  for (int i = 0; i < total; i++) {
    background(0, 0, 200);
    drawPentagon(width/2, (height-size)/2 + 3*margin, side, total);
  }
}

void drawPentagon(float x, float y, float side, float depth) {
  float angle = 3*s_angle; 
  if (depth == 0) {  
    for (int i = 0; i < 5; i++) {
      float px = x;
      float py = y;
      x = x+cos(angle)*side;
      y = y-sin(angle)*side;
      line(x, y, px, py);
      angle += s_angle;
    }
  } else {
    side *= scale;
    float distance = side+side*cos(s_angle)*2;
    for (int j = 0; j < 5; j++) {
      x = x+cos(angle)*distance;
      y = y-sin(angle)*distance;
      drawPentagon(x, y, side, depth-1);
      angle += s_angle;
    }
  }
}

4 Likes

Well, I did. But it took me more time. :mantelpiece_clock:

I’ve based mine on the Go version (although I barely know anything about that Google language): :woozy_face:
RosettaCode.org/wiki/Sierpinski_pentagon#Go

That version uses a fixed palette of 5 primary colors. :paintbrush:

In my sketch conversion I keep track of the current palette's index by returning it at the end of the recursive pentagon() function. :triangular_ruler:

In order to get a free color fill() I’m using beginDraw() + vertex() to draw each Sierpinski pentagon. :framed_picture:

The 1st sketch below is the Java Mode version w/ no special optimization: :coffee:

2nd sketch is the p5.js version, which caches all cos() & sin() calcs inside 2 Float32Array containers, similar to what I already did before to the Python Mode conversion: :bulb:

4 Likes

And finally the Python Mode flavor which the p5.js is based upon: :snake:

5 Likes

I am looking forward to starting! I am just have to get my book off to the editor and then I’m on it.

The task I want to tackle is combinations and permutations in Processing. I know there is a great library for this, but that is like using a robot to mow the lawn.

1 Like

@noel @jeremydouglass @villares For the Sierpinski Carpet, eventually I opted for a variant on the @noel processing variation for JRubyArt, partly to show off the JRubyArt grid method now on rosetta code.

3 Likes

I have added the Python mode of Sierpinski carpet to the wiki and to the repository, @monkstone, could you add the JRubyArt one?

Also, I have been working on the N-queen problem, Java and Python. :slight_smile:

3 Likes

This is my Python mode attempt! @noel you could perhaps format yours with header for the GitHub repoGitHub - jeremydouglass/rosetta_examples_p5: Example set from Rosetta Code for P5 (Processing) too?

"""
 Plasmas with Palette Looping
 https://lodev.org/cgtutor/plasma.html#Plasmas_with_Palette_Looping_
"""

pal = [0] * 128
r = 42
g = 84
b = 126
rd = gd = bd = False

def setup():
    global buffer
    size(600, 600)
    frameRate(25)
    buffer = [None] * width * height
    for x in range(width):
        for y in range(width):
            value = int(((128 + (128 * sin(x / 32.0)))
                         + (128 + (128 * cos(y / 32.0)))
                         + (128 + (128 * sin(sqrt((x * x + y * y)) / 32.0)))) / 4)
            buffer[x + y * width] = value

def draw():
    global r, g, b, rd, gd, bd
    if r > 128: rd = True
    if not rd: r+=1
    else: r-=1
    if r < 0: rd = False
    if g > 128: gd = True
    if not gd: g+=1
    else: g-=1
    if r < 0: gd = False 
    if b > 128: bd = True
    if not bd: b+=1
    else: b-=1
    if b < 0: bd = False
 
    for i in range(128):
          s_1 = sin(i * PI / 25)
          s_2 = sin(i * PI / 50 + PI / 4)
          pal[i] = color(r + s_1 * 128, g + s_2 * 128, b + s_1 * 128)

    loadPixels()
    for i, b in enumerate(buffer):
          pixels[i] = pal[(b + frameCount) % 127]
    updatePixels()
2 Likes

This looks really great! So excited to review – I’ll be getting caught up on merging things to the repository and making a new release shortly – I just need to survive the process of launching a new class co-taught class (How Games Tell Stories) this week for our online Fall quarter…

1 Like

Thank you @jeremydouglass you are a cape-less hero!

1 Like

I’m going to add this raster-VoronoiDiagram, I have ported from Rosetta’s Python example first.


def setup():
    size(500, 500)
    generate_voronoi_diagram(width, height, 25)
    saveFrame("VoronoiDiagram.png")

def generate_voronoi_diagram(w, h, num_cells):
    nx, ny, nr, ng, nb = [], [], [], [], [] 
    for i in range(num_cells):
        nx.append(int(random(w)))
        ny.append(int(random(h)))
        nr.append(int(random(256)))
        ng.append(int(random(256)))
        nb.append(int(random(256)))
    for y in range(h):
        for x in range(w):
            dmin = dist(0, 0, w - 1, h - 1)
            j = -1
            for i in range(num_cells):
                d = dist(0, 0, nx[i] - x, ny[i] - y)
                if d < dmin:
                    dmin = d
                    j = i
            set(x, y, color(nr[j], ng[j], nb[j]))

And the Java mode version:


void setup() {
  size(500, 500);
  generateVoronoiDiagram(width, height, 25);
  saveFrame("VoronoiDiagram.png");
}

void generateVoronoiDiagram(int w, int h, int num_cells) {
  int nx[] = new int[num_cells];
  int ny[] = new int[num_cells];
  int nr[] = new int[num_cells];
  int ng[] = new int[num_cells];
  int nb[] = new int[num_cells];
  for (int n=0; n < num_cells; n++) {
    nx[n]=int(random(w));
    ny[n]=int(random(h));
    nr[n]=int(random(256));
    ng[n]=int(random(256));
    nb[n]=int(random(256));
    for (int y = 0; y < h; y++) {
      for (int x = 0; x < w; x++) {
        float dmin = dist(0, 0, w - 1, h - 1);
        int j = -1;
        for (int i=0; i < num_cells; i++) {
          float d = dist(0, 0, nx[i] - x, ny[i] - y);
          if (d < dmin) {
            dmin = d;
            j = i;
          }
        }
        set(x, y, color(nr[j], ng[j], nb[j]));
      }
    }
  }
}
1 Like

@villares inspired by you I’ve just posted JRubyArt variant of voronoi diagram. The existing ruby example is in need of correction, which I’ll get round to next (for one thing Queue is part of ruby so can be monkey patched without sub-classing Array).

1 Like