Working with BlockPy¶

The BlockPy environment we will be working with is shown in the figure below. This is a workspace in which you can develop and run Blockly algorithms interactively. The workspace consists of five major components. These are:

• the Block Menu: the menu has various categories of blocks. Each category contains a number of blocks. A block can be selected and inserted into the area where the algorithms are constructed. The contents of each menu are described more fully below.
• the Algorithm Canvas: this area contains blocks selected from the block menu that are being assembled together to form an algorithm. As with the Maze blocks, these blocks only fit together in meaningful ways. In the bottom right corner of the canvas is a trash can icon. Blocks in the workspace that are not needed can be dragged into the trash can to clear them from the workspace.
• the Output area: this area displays both textual output (produced by the print blocks) and line drawings (produced by the “plot” blocks). In this figure, the text output “78” (the current temperature in Blacskburg) is shown along with a graph of the forecasted temperatures for Blacksburg.
• the State Display: this area shows the current state of the algorithm. The properties and property values of the current state are shown. See, for example, that the property temperate is shown with the value 78.

The BlockPy environment also has a set of controls that are located in the top left area (above the Block menu and the Algorithm canvas). These controls are:

• Run: This control executes the Blockly program shown in the canvas. Any results generated by the program (printed values or graphs) are shown in the Output area.
• Pseudo: This control displays a window with a structured English-language description of the algorithm. Viewing an algorithm in this way may be useful in discovering mistakes in the algorithm. Some mistakes are because what we believe we are "saying" in an algorithm is not what the algorithm actually means. Seeing the algorithm in an English-like form may help to detect this mismatch and lead to a correct algorithm.
• [arrows] The “Undo” (counterclockwise-wise arrow) and “Redo” (clockwise arrow) controls reversing or repeating, respectively, the last action taken in the canvas. If you inadvertently delete a block, you can recover it by the “Undo” control.
• Text: the Python code that is equivalent to the Blockly algorithm is shown in a window that replaces the Blockly menu and canvas. When the Python code is displayed the "Text" control becomes "Blocks" so that you can return to the block view. We will not look now at the Python code now but you can look at this code whenever you are curious. You should be able to recognize at least some parts of the correspondence between the Blockly representation of the program and the Python equivalent. Seeing the Python code for a Blockly program is further evidence that Blockly itself is a “real” programming language. Eventually we will make the transition from building programs in Blockly to building them directly and exclusively in Python. While Blockly is a good learning aid, we will eventually be able to write larger programs more quickly by using Python directly.
• Wide: The default display shows the State display and the Output area to the right of the Blockly areas. Clicking on this control changes the arrangement so that the State display and the Output area and shown below the Blockly areas. When the layout is changed the "Wide" control becomes "Skinny" so that you can return to the original view. You may want to use these controls because the "Skinny" view allows the Algorithm canvas to be wider so that long blocks can be seen more easily. The "Wide" view allows you to see more easily the algorithm and its output together. 
• Align: This control aligns all the blocks to the upper-left corner of the canvas. 
• Reset: This control causes the Algorithm canvas to be placed back in its original condition (often a blank canvas).
• Clear: This control causes all blocks in the algorithm canvas to be deleted.

Finding Blocks¶

BlockPy can be used to create complex algorithms. The menu of blocks is organized as follows.

The topmost items are the menus for basic parts of an algorithm (Properties, Decisions, Iteration, Calculation, and Values). The meaning of these items should be clear from our understanding of algorithms. Two other menus are Python and Output. The Output menu contains the blocks for printing values and creating line plots. The Python menu contains blocks for directly entering Python code. These blocks will not be used but as you begin to explore Python later you can experiment with this feature.

The middle items contain the menus for different forms of complex data (Lists, and Dictionaries). We will learn more about these forms of data in this chapter.

The bottom-most items contain the menus of blocks that produce “big data” streams. These data streams contain abstractions for weather forecasts, financial stocks, earthquakes, reports of crimes in the US, and books. You can explore the blocks in each category by clicking on the menu name. There are more blocks in this palette than we will need immediately. Those that are not immediately familiar will be studied soon.

A word about terminology is needed here. In BlockPy (and many other programming languages) what we have been referring to as a "property" or a “variable property” may also be referred to as a “variable”.

Explore the BlockPy workspace below but leave the two original blocks in the workspace. The example workspace above had two blocks connected together: a “print” block (from the Text category) and a “get temperature in” block (from the Weather menu) where “Blacksburg, VA” is the selected city. Click the Run button and observe what is printed in the output area (just below the work space). You should see the number “78” in the output area. 

Look at the set of available blocks in each category so that you know what blocks you have available to solve the problems we will be working with in this section. Drag some blocks into the workspace, assemble them together, and clear the workspace by moving all of the blocks to the trashcan.

You will notice that in the Weather menu two of the blocks give access to weather data and two of the blocks in the Stock menu give access to stock market data. These blocks are:

• get temperature in: returns a single number that is the temperature in Fahrenheit for the selected city
• get forecasted temperature in: returns a list of numbers with the temperature forecast over the next nine days for the selected city
• get current stock of: returns a single number that is the current change in the value of the selected stock
• get past stocks of: returns a list of numbers with the nine most recently reported changes in the value of the selected stock

Two of the blocks return single numbers and two of the blocks return a list of numbers. We will see in the following examples how to construct small Blockly programs that use calculation, sequence, decision, and iteration to process the data returned by these blocks. The same techniques allow us to use computation to answer questions about earthquakes, crimes, and books.

The example workspace above had two blocks connected together: a “print” block (from the Text category) and a “get temperature in” block (from the Weather menu) where “Blacksburg, VA” is the selected city. Click the Run button and observe what is printed in the output area (just below the work space). You should see the number “60” in the output area.

Using the output produced in the work space, answer these questions using the “print” block in combination with the “get temperature for” and “get current stock for” blocks.

Sequence and Calculation¶

The temperature returned by the “get temperature in” block is measured on the Fahrenheit scale. An alternative scale is the Celsius (or Centigrade) scale. The conversion between these two scales is:

Celsius = (Fahrenheit - 32)/1.8

The work space that follows shows the program needed to convert the temperature from Fahrenheit to Celsius. In this program, this conversion calculation is performed using some of the blocks in the Math category. The “set to” and variable blocks are both in the Variable category. The print block is in the Text category.

The code in the work space makes use of a sequence of operations:

• setting the property “ftemp” to the current temperature in Fahrenheit,
• setting the property “ctemp” to the result of calculating the conversion of the temperature to Celsius,
• printing the converted temperature.

The assembly of the blocks often involves multiple steps. Here is a diagram that shows the way in which the blocks for the Fahrenheit to Celsius conversion can be assembled. The arrows shows how the blocks are snapped together. There is no strict ordering of which blocks are assembled first.

Assembling Blocks for the Temperature Conversion Example

Creating the blocks with the property names “ftemp” and “ctemp” involves renaming one of the standard blocks. For example, to create the “set ftemp to” block:

• drag a “set item to” block from the Variable category to the work space
• click on the name “item” and select the option “Rename variable...”
• in the window that appears, replace the name “item” with the name “ftemp” and click the OK button

A similar renaming is done for the variable blocks.

Another temperature scale is the Kelvin scale. Temperatures in Fahrenheit can be converted to Kelvin as follows:

Kelvin = 273.15 + ((Fahrenheit - 32) *5)/9

Using the below work space, build a Blockly program that does the conversion from Fahrenheit to Kelvin.