Chinese Flag

The image value on the left called china is defined by the code on the right.

Chinese Flag: Red rectangle with a large yellow star in the top left corner and an arc of 4 smaller yellow stars to the right of the big star

1 What image do you see repeated in the flag?

2 Highlight or underline every place in the code ➡️
that you see the repeated expression for that image.

china =
  put-image(
    rotate(40,star(15,"solid","yellow")),
    120, 175,
    put-image(
      rotate(80,star(15,"solid","yellow")),
      140, 150,
      put-image(
        rotate(60,star(15,"solid","yellow")),
        140, 120,
        put-image(
          rotate(40,star(15,"solid","yellow")),
          120, 90,
          put-image(scale(3,star(15,"solid","yellow")),
            60, 140,
            rectangle(300, 200, "solid", "red"))))))

3 Write the code to define a value for the repeated expression.

4 Open the Flag of China Starter File, save a copy and click "Run". Simplify the code, replacing the repeated expressions with the value you defined. Do you still get the same image when you click "Run"? If not, check your work.

5 Change the color of all the stars to black, then change their size to 20. Would this have been easier with the original code? Why or why not?

6 Here is the same code shown above, but all crammed into one line.

china = put-image(rotate(40, star(15, "solid", "yellow")), 120, 175, put-image(rotate(80, star(15, "solid", "yellow")), 140, 150, put-image(rotate(60, star(15, "solid", "yellow")), 140, 120, put-image(rotate(40, star(15, "solid", "yellow")), 120, 90, put-image(scale(3, star(15, "solid", "yellow")), 60, 140, rectangle(300, 200, "solid", "red"))))))

Is it easier or harder to read, when everything is all on one line?

7 Professional programmers indent their code, by breaking long lines into shorter, more readable lines of code. In the indented code at the top of the page, notice that each put-image is followed by several lines of code that all line up with each other, and that the lines under the next put-image are shifted farther and farther to the right. What do you think is going on?

★ This file uses a function we haven’t seen before! What is its name? Hint: Focus on the last instance of the function.
How many inputs are in its domain? . What are the types of those inputs?

These materials were developed partly through support of the National Science Foundation, (awards 1042210, 1535276, 1648684, 1738598, 2031479, and 1501927). Bootstrap by the Bootstrap Community is licensed under a Creative Commons 4.0 Unported License. This license does not grant permission to run training or professional development. Offering training or professional development with materials substantially derived from Bootstrap must be approved in writing by a Bootstrap Director. Permissions beyond the scope of this license, such as to run training, may be available by contacting contact@BootstrapWorld.org.