1. The following code defines a function called
right that uses a new Turtle to quickly
fill a right triangle with color k,
with vertices at the origin (0, 0),
the point (a, 0), and the point
(0, b). Then it removes the turtle
after the drawing is done.
right = (k, a, b) -> # Define a function right: p = new Turtle() # Create a turtle p. p.speed(Infinity) # Make it move instantly. p.moveto(0, 0).pen(path) # Start a path at the origin, p.moveto(a, 0).moveto(0, b) # go through each corner, p.fill(k) # and fill with color k. p.remove() # Then remove p. right purple, 50, 80 # Call the function.
2. A Sprite is an object that can be moved on
the screen: the Pencil Code Turtle is a type of Sprite, but
we can define our own.
Let's draw our triangle as a Sprite.
The program below defines a new kind of
sprite, RightTriangle. Then we make one with
new RightTriangle(purple, 50, 80)
and turn it right 60°:
class RightTriangle extends Sprite # Define RightTriangle as a subclass of Sprite. constructor: (k, a, b) -> # Define how a RightTriangle is made: super { width: 2*a, height: 2*b } # Make the sprite 2a×2b. p = new Turtle() # Create a turtle p. p.speed(Infinity) # Make it move instantly. p.drawon(@) # Draw on this new sprite! p.moveto(0, 0).pen(path) # Start a path at the origin, p.moveto(a, 0).moveto(0, b) # go through each corner, p.fill(k) # and fill with color k. p.remove() # Then remove p. r = new RightTriangle(purple, 50, 80) # Create a RightTriangle, r.rt 60 # and turn it a bit.
Understanding this program:
class RightTriangle extends Sprite
is a class definition. It defines a new class of
object called RightTriangle that
extends the built-in base class Sprite.
The new class behaves like Sprite in every way,
except that is defines a new constructor method.
constructor is the special function that
is used to set up a newly created object. This function
will run whenever we use new like this:
new RightTriangle(purple, 50, 60).
super { width: 2*a, height 2*b }
calls the super-class constructor. That means we
start with a basic Sprite as we would get
from new Sprite { width: 2*a, height: 2*b }.
p.drawon(@) tells the
turtle p to draw on the sprite
instead of drawing on the default background canvas.
@ refers to the
sprite being defined. This variable is automatically
defined inside the functions of a class definition.
3. Write the following program to create
and arrange four RightTriangle sprites
to show a square with area (a+b)2
containing a square with area c2:
class RightTriangle extends Sprite # Define RightTriangle as before. constructor: (k, a, b) -> super { width: 2*a, height: 2*b } p = new Turtle() p.speed(Infinity) p.drawon(@) p.moveto(0, 0).pen(path) p.moveto(a, 0).moveto(0, b) p.fill(k) p.remove() a = 50 # a is one leg length. b = 80 # b is the other. s = (a + b) / 2 # s is half the sum. h = for c, i in [red, gold, green, blue] # Make four colors of t = new RightTriangle(c, a, b) # new right triangles. t.rt(i * 90) # Turn the ith one by i×90° t.slide(-s, -s) # and move it left and back by s. movexy(-s, -s) # Go to the lower-left corner. pen black, 3 # In black pen, for [1..4] # draw a square of fd(a + b).rt(90) # dimension a+b.
The triangle has short sides of length a and
b. Let's call the length of the hypotenuse
c.
a and b, write a formula
for the area of the square outlined in black.
c, write a formula for the area
of the tilted square not covered by triangles.
4. Add the following click handler function
to the end of the program:
class RightTriangle extends Sprite # Define RightTriangle as before.
constructor: (k, a, b) ->
super { width: 2*a, height: 2*b }
p = new Turtle()
p.speed(Infinity)
p.drawon(@)
p.moveto(0, 0).pen(path)
p.moveto(a, 0).moveto(0, b)
p.fill(k)
p.remove()
a = 50 # a is one leg length.
b = 80 # b is the other.
s = (a + b) / 2 # s is half the sum.
h = for c, i in [red, gold, green, blue] # Make four colors of
t = new RightTriangle(c, a, b) # new right triangles.
t.rt(i * 90) # Turn the ith one by i×90°
t.slide(-s, -s) # and move it left and back by s.
movexy(-s, -s) # Go to the lower-left corner.
pen black, 3 # In black pen,
for [1..4] # draw a square of
fd(a + b).rt(90) # dimension a+b.
# Add the code below to the end of program 3.
d = 1 # d is a toggle.
click -> # On each click,
h[1].movexy(d * a, 0) # three triangles sslide
h[2].movexy(-d * b, -d * a) # to a new position
h[3].movexy(0, d * b) # depending on d, then
d = -d # d flips sign.
Understanding this program:
Each time you click in the window, the triangles
move to a new position, and the value of the variable
d flips between +1 and -1, so that the
triangles move back when you click again.
The array h contains the four
RightTriangle sprites: the red one is
h[0]; gold is h[1]; green
is h[2]; and blue is h[3].
The code h[1].movexy(d * a, 0) moves
the gold triangle d * a in the x direction.
Thinking about the math:
a and b, write a formula
for the area of the two squares not covered by triangles.