Create your own Pong in Shoes by doing the following 5 steps.
-
Open Shoes Window / Play Pong in Shoes
- Window's width and height are both 400 pixel.
- Can't resize.
- Show your app name and revision number on the window's title bar.
- Color the surface of the window with the horizontal gradation.
- Play Pong in Shoes written by _why.
- Hack (read) the code.
-
Show two paddles and a ball
- Allocate computer paddle on the top (immobile yet).
- Allocate player's (your) paddle on the bottom.
- Your paddle synchronizes with the mouse movement.
- A ball appears left-top side and moves smoothly to right-bottom side at 20 frames per second.
-
Lock-in the ball within the window
- Bounce a ball on the edge of the window.
- Computer's paddle synchronizes with the ball movement.
-
Hit the ball
- Have your paddle hit the ball.
- have computer's paddle hit the ball.
- Change ball's speed and bounce angle when the ball is hit.
-
Have a match
- When the ball goes over the goal lines, game finishes with victory message.
sample58.png
# sample58.rb
Shoes.app :width => 400, :height => 400, :resizable => false do
vx, vy = 3, 4
nostroke
@ball = oval 0, 0, 20, :fill => forestgreen
@comp = rect 0, 0, 75, 4, :curve => 2
@you = rect 0, 396, 75, 4, :curve => 2
@anim = animate 40 do
nx, ny = @ball.left + vx.to_i, @ball.top + vy.to_i
if @ball.top + 20 < 0 or @ball.top > 400
para strong("GAME OVER", :size => 32), "\n",
@ball.top < 0 ? "You win!" : "Computer wins", :top => 140, :align => 'center'
@ball.hide and @anim.stop
end
vx = -vx if nx + 20 > 400 or nx < 0
if ny + 20 > 400 and nx + 20 > @you.left and nx < @you.left + 75
vy = -vy * 1.2
vx = (nx - @you.left - (75 / 2)) * 0.25
end
if ny < 0 and nx + 20 > @comp.left and nx < @comp.left + 75
vy = -vy * 1.2
vx = (nx - @comp.left - (75 / 2)) * 0.25
end
@ball.move nx, ny
@you.left = mouse[1] - (75 / 2)
@comp.left += 10 if @comp.left + 75 < @ball.left
@comp.left -= 10 if @ball.left + 20 < @comp.left
end
end
Have fun!
The sample58.rb worked well with Shoes-0.r1263