DEV Community

Cover image for 'Pattern Painter': My first crank-only 'game'
Robert Mion
Robert Mion

Posted on

'Pattern Painter': My first crank-only 'game'

My mission

  • Make a game
  • That only uses the crank
  • And paints the screen
  • One random tile at a time
  • As determined by the rotation of the crank

How hard could this be, right?

The event members

In every event, its aa and ra members will be set to the current absolute angle and the amount of change since the last frame of the crank in degrees (relative angle).

So, in the crank event, I can do this:

on crank do
  absAngle = event.aa
  relAngle = event.ra
end
Enter fullscreen mode Exit fullscreen mode
  • event.aa will be a value between 0 and 360
  • event.ra will be a value between -360 and 360, though likely closer to the middle third of that range

How could I see this to confirm?

Using draw and label to display the values

I want to display the aa and ra values on the room.

So, I write this in the player script:

on draw do
  label "{event.aa}" at 0,0
  label "{event.ra}" at 0,1
end
Enter fullscreen mode Exit fullscreen mode

And I see this in the browser simulator:
Displaying angles

The top number is the absolute angle.
The bottom number is the relative angle - amount changed since the last frame, which is 0.

Great!

How do I swap a tile at a valid coordinate based on the relative angle?

Swapping tiles based on crank rotation

I confirmed I can capture the crank's rotation.

Now I need to use it to swap all the tiles.

Approach 1: Downward staircase

  • I wrote the code below
  • It guarantees that x and y are each positive numbers between 0 and 24 or 0 and 14
  • Sadly, x and y are the same from 0 to 14
  • And then y is always 14 and x is 14 to 24
  • Thus, a downward staircase
on draw do
  x = event.ra
  x = floor x
  if x<0 then
    x *= -1
  end
  if x>24 then
    x = 24
  end
  y = event.ra
  y = floor y
  if y<0 then
    y *= -1
  end
  if y>14 then
    y = 14
  end
  tell x,y to
    swap "black"
  end
  label "{x},{y}" at 0,14
end
Enter fullscreen mode Exit fullscreen mode

The resulting tiled room:
Downward staircase

Approach #2: Chickenpox

  • I removed all of the conditionals setting x and y
  • I generate random positive numbers when the crank is turned
  • I only update a tile when the crank is turned
on draw do
  change = event.ra
  if change!=0 then
    tell x,y to
      swap "black"
    end
  end
  label "{x},{y}" at 0,14
end

on crank do
  x = random 0,24
  y = random 0,14
end
Enter fullscreen mode Exit fullscreen mode

This is what the tiled room looks like now:
Chickenpox

Swapping for a specific tile

I can swap random tiles with a black tile.

I want to swap tiles with one of several other tiles.

Approach #1: add x and y

  • x will be 0-24
  • y will be 0-14
  • The sum will be 0-38
  • If I make tiles named tile0 thru tile38, then I can perform a swap using text interpolation, like "tile{sum}"

At least I hope!

My updated code:

on draw do
  change = event.ra
  if change!=0 then
    tell x,y to
      sum = x
      sum += y
      swap "tile {sum}"
    end
  end
  label "{x},{y}" at 0,14
end

on crank do
  x = random 0,24
  y = random 0,14
end
Enter fullscreen mode Exit fullscreen mode

Knowing that sum will be a number between 0 and 38, I made 38 tiles:
Unique tiles

The tiled room after rotating the crank for a while:
Crazy pattern room

It works! Very cool!

What now?

  • Try to update each tile so that something more recognizable appears?
  • Or just leave it like this...and see what my son thinks?

Mission: accomplished

  • I made a game
  • That only uses the crank
  • And paints the screen
  • One random tile at a time
  • As determined by the rotation of the crank

It wasn't that hard.

It just took some experimentation in Pulp.

And now I'm excited to do something more!

Top comments (0)