Home

SNAP! Reference Manual

image

Contents

1. Snap Build Your Own Blocks move T steps Maa 92 OCE Cae Brian Harvey Jens Monig Table of Contents I Blocks Scripts and Sprites 4 Hat Blocks and Command Blocks 5 A Sprites and Parallelism 6 Costumes and Sounds 6 Inter Sprite Gommunication with Broadcast 7 B Nesting Sprites Anchors and Parts 8 C Reporter Blocks and Expressions 8 D Predicates and Conditional Evaluation 10 E Variables 11 Global Variables 12 Script Variables 13 F Etcetera 15 II Saving and Loading Projects and Media 14 A Local Storage 14 Localstore 14 XML Export 15 B Cloud Storage 15 C Loading Saved Projects 16 III Building a Block 17 A Simple Blocks 17 Custom Blocks with Inputs 19 B Recursion 20 C Block Libraries 21 IV First Class Lists 22 The list Block 22 Lasts of Lasts 23 Functional and Imperatwe List Programming 24 Higher Order List Operations and Rings 25 ba amp g V Typed Inputs 27 A Scratch s Type Notation 27 B The Snap Input Type Dialog 27 Procedure Types 28 Pulldown inputs 29 Input variants 30 Prototype Hints 31 Title Text and Symbols 31 VI Procedures as Data 32 A Call and Run 32 Call Run with inputs 32 Variables in Ring Slots 33 B Writing Higher Order Procedures 33 Recursive Calls to Multiple Input Blocks 35 C Formal Parameters 36 D Procedures as Data 37 E Special Forms 38 Special Forms in Scratch 39 VII Object Oriented Programming 40 A Local State with Script Varia
2. At the top of the script 1s a hat block which indicates when the script should be carried out Hat block names typically start with the word when in this example the script should be run when the green flag near the right end of the Snap tool bar is clicked The Snap tool bar is part of the Snap window not the same as the browser s or operating system s menu bar A script isn t required to have a hat block but if not then the script will be run only if the user clicks on the script itself A script can t have more than one hat block and the hat block can be used only at the top of the script its distinctive shape is meant to remind you of that The other blocks in this script are command blocks Each command block corresponds to an action that Snap already knows how to carry out For example the block tells the sprite the arrowhead shape on the stage at the right end of the window to move ten steps a step 1s a very small unit of distance in the direction in which the arrowhead is pointing We ll see shortly that there can be more than one sprite and that each sprite has its own scripts Also a sprite doesn t have to look like an arrowhead but can have any picture as a costume The shape of the move block is meant to remind you of a Lego brick a script is a stack of blocks The word block denotes both the graphical shape on the screen and the procedure the action that the block carries out The number 10
3. Control Sensing Operators Variables oiher e for all sprites J tor this sprite only OK Cancel J In this dialog box you can choose the block s palette shape and name With one exception there is one color per palette e g all Motion blocks are blue But the Variables palette includes the orange variable related blocks and the red list related blocks Both colors are available along with an Other option that makes grey blocks in the Variables palette for blocks that don t fit any category There are three block shapes following a convention that should be familiar to Scratch users The jigsaw puzzle piece shaped blocks are Commands and don t report a value The oval blocks are Reporters and the hexagonal blocks are Predicates which 1s the technical term for reporters that report Boolean true or false values 17 Suppose you want to make a block named square that draws a square You would choose Motion Command and type square into the name field When you click OK you enter the Block Editor This works just like making a script in the sprite s scripting area except that the hat block at the top instead of saying something like when I am clicked has a picture of the block you re building This hat block is called the prototype of your custom block You drag blocks under the hat to program your custom block then click OK clear Block Editor pen down pers up
4. Predicate inline Command E g Any Boolean C snape unevaluated unevaluated Single input Detaunt Value a Muitipie puts value is list of inputs upvar n ake internal variable visible tc caller Commands Reporters Predicates Pulldown inputs Certain primitive blocks have pulldown inputs either read only like the input to the touching block touching mouse pointer edge pen tralis Sspme 2 indicated by the input slot being the same blue in this case color as the body of the block or writeable like the input to the point in direction block uum tad 90 w 90 ighi 90 left 0 up 180 down indicated by the white input slot which means that the user can enter an arbitrary input instead of using the pulldown menu Custom blocks can also have such inputs This is an experimental feature and the user interface is likely to change To make a pulldown input open the long form input dialog and control click right click in the dark grey area You will see this menu options _ read only 29 Click the checkbox if you want a read only pulldown input Then control click right click again and choose options to get this dialog box Input Slot Options Enter one option per ine Optionally use as key value delimiter B g the answar 42 OK Cancel For now at least you can have only fixed options not for example all sprites
5. that you can count the number of spaces between words and in particular you can tell the difference between an empty slot and one containing spaces The brown dots are not shown on the stage when the block is run The stage has its own scripting area It can be selected by clicking on the Stage icon at the left of the sprite corral Unlike a sprite though the stage can t move Instead of costumes it has backgrounds pictures that fill the entire stage area The sprites appear in front of the current background In a complicated project it s often convenient to use a script in the stage s scripting area as the overall director of the action B Nesting Sprites Anchors and Parts Sometimes it s desirable to make a sort of super sprite composed of pieces that can move together but can also be separately articulated The classic example is a person s body made up of a torso limbs and a head Snap allows one sprite to be designated as the anchor of the combined shape with other sprites as its parts To set up sprite nesting drag the sprite corral icon of a part sprite onto the stage display not the sprite corral icon of the desired anchor sprite Sprite nesting 1s shown in the sprite corral icons of both anchors and parts d Sprite Sprite2 In this illustration it is desired to animate Alonzo s arm The arm has been colored green in this picture to make the relationship of the two sprites clearer but in a re
6. then you will be logged in automatically the next time you run Snap from the same browser on the same computer Check the box if you re using your own computer and you don t share it with siblings Don t check the box if you re using a public computer at the library at school etc Once logged in you can choose the Cloud option in the Save as dialog shown on page 14 You enter a project name and optionally project notes just as for Localstore saving but your project will be saved online and can be loaded from anywhere with net access C Loading Saved Projects Once you ve saved a project you want to be able to load it back into Snap There are two ways to do this 1 If you saved the project in Localstore or in your online Snap account choose the Open option from the File menu Choose the Browser or Cloud button then select your project from the list in the big text box and click OK A third button Examples lets you choose from example projects that we provide You can see what each of these projects 1s about by clicking on it and reading its project notes 2 If you saved the project as an XML file on your computer choose Import from the File menu This will sive you an ordinary browser file open window in which you can navigate to the file as you would in other software Alternatively find the XML file on your desktop and just drag it onto the Snap window The seco
7. Media Lab is crucial to Snap Our earlier version BYOB was a direct modification of the Scratch source code Snap is a complete rewrite but its code structure and its user interface remain deeply indebted to Scratch And the Scratch Team who could have seen us as rivals have been entirely supportive and welcoming to us Brian grew up at the MIT and Stanford Artificial Intelligence Labs learning from Lisp inventor John McCarthy Scheme inventors Gerald J Sussman and Guy Steele and the authors of the world s best computer science book Structure and Interpretation of Computer Programs Hal Abelson and Gerald J Sussman with Julie Sussman among many other heroes of computer science In the glory days of the MIT Logo Lab we used to say Logo is Lisp disguised as BASIC Now with its first class procedures lexical scope and first class continuations Snap is Scheme disguised as Scratch We have been fortunate to get to know an amazing group of brilliant middle school and high school students through the Scratch Advanced Topics forum several of whom have contributed code to Snap Kartik Chandra Nathan Dinsmore Connor Hudson and Ian Reynolds Many more have contributed ideas and alpha testing bug reports UC Berkeley students who ve contributed code include Michael Ball Achal Dave Kyle Hotchkiss Ivan Motyashov and Yuan Yuan Contributors of translations are too numerous to list here but they re 1n the Abou
8. Meme 40 GTE the continuation of the move 100 steps block 1s aaa 20 ECE Meh 40 Braet pen up But some situations are more complicated For example what is the continuation of move 100 steps in the following script Tria 4 move 100 Mace turn 90 degrees That s a trick question the move block is run four times and it has a different continuation each time The first time its continuation 1s turn amp 90 degrees repeat 3 UCE 100 Bact p turn amp 90 degrees Note that there is no repeat 3 block in the actual script but the continuation has to represent the fact that there are three more times through the loop to go The fourth time the continuation is just turn 90 degrees What counts is not what s physically below the block in the script but what computational work remains to be done 49 When a block 1s used inside a custom block its continuation may include parts of more than one script For example if we make a custom square block square Thiet 4 UCICE 100 Maat turn amp 90 degrees and then use that block in a script pen down square pen up then the continuation of the first use of move 100 steps 1S Maal 90 EEEE anani es move 100 Maar aa 90 EEEE in which part comes from inside the square block and part comes from the call to square Nevertheless ordinarily when we display a continuation we show only the part within the current
9. Motion gt Control 7 specie Looks Sensing _ Sprite draggabdie f sound Operators Pen Variables Scripts Costumes Sounds A Tool Bar Features Holding down the Shift key while clicking on any of the menu buttons gives access to an extended menu with options shown in red that are experimental or for use by the developers We re not listing those extra options here because they change frequently and you shouldn t rely on them But they re not secrets The Snap Logo Menu The Snap logo at the left end of the tool bar is clickable It shows a menu of options about Snap itself About Reference manual snap website Download source The About option displays information about Snap itself including version numbers for the source modules the implementors and the license AGPL you can do anything with it except create proprietary versions basically 7 The Reference manual option downloads a copy of the latest revision of this manual in PDF format The Snap website option opens a browser window pointing to snap berkeley edu the web site for Snap The Download source option downloads to your browser s usual download directory a zip file containing the Javascript source files for Snap You can read the code to learn how Snap is implemented host a copy on your own computer this is one way to keep working while on an airplane or make a modified version with customized features However
10. Not just its costume but all of its costumes scripts local variables and blocks and other properties You can save this tab into a file on your computer and later import the sprite into another project Control clicking right clicking on the stage background that is anywhere on the stage except on a sprite shows the stage s own context menu edit show all pic The stage s edit option selects the stage so the stage s scripts and backgrounds are seen in the scripting area Note that when the stage is selected some blocks especially the Motion ones are not in the palette area because the stage can t move The show all option makes all sprites visible both in the sense of the show block and by bringing the sprite onstage if 1t has moved past the edge of the stage The pic option opens a browser tab with a picture of everything on the stage its background lines drawn with the pen and any visible sprites What you see 1s what you get If you want a picture of just the background select the stage open its costumes tab control click right click on a background and export it E The Sprite Corral and Sprite Creation Buttons Between the stage and the sprite corral at the bottom right of the Snap window is a dark grey bar containing two buttons These are used to create a new sprite The first button makes a sprite with just the turtle costume the second button makes a sprite and opens the Paint Edito
11. a sizes input list all but first of numbers all paut first of numbers 35 Note that the halo you see while dragging onto the arrowheads 1s red instead of white and covers the input slot as well as the arrowheads And when you drop the expression onto the arrowheads the words input list are added to the block text and the arrowheads disappear in this invocation only to remind you that the list represents all of the multiple inputs not just a single input The items in the list are taken indiwidually as inputs to the script Since numbers is a list of numbers each individual item is a number Just what sizes wants This block will take any number of numbers as inputs and will make the sprite grow and shrink accordingly if length of numbers gt jj set size to item GE of numbers i wait Ory SECS a sizes input list all but first of numbers sizes numbers The user of this block calls t with any number of zndwidual numbers as inputs But inside the definition of the block all of those numbers form a list that has a single input name numbers This recursive definition first checks to make sure there are any inputs at all If so it processes the first input item 1 of the list then it wants to make a recursive call with all but the first number But sizes doesn t take a list as input 1t takes numbers as inputs So this would be wrong Os d sizes all but first 2 number
12. access to cloud accounts is limited to the official version hosted at Berkeley The File Menu The file icon shows a menu mostly about saving and loading projects Project notes New Open Save Save As Import Export project Export blocks Import tools Libraries The Project notes option opens a window in which you can type notes about the project How to use it what it does whose project you modified to create it 1f any what other sources of ideas you used or any other information about the project This text is saved with the project and is useful if you share it with other users The New option starts a new empty project Any project you were working on before disappears so you are asked to confirm that this is really what you want It disappears only from the current working Snap window you should save the current project 1f you want to keep it before using New The Open option shows a project open dialog box in which you can choose a project to open Open Project BYOB3 tutorial3 I know an old lady Mole Mash Planetary Simulation Tree acronym animal game cloudtest count change geo p3 icecream intro Lists of lists of functions Green flag to display every possible ice Examples listdemo cream serving space to live tree display every possible pizza locomotive serving Each of the grey other renorters such as Open Unshare Delete Canc
13. blocks costume and graphics effects blocks and so on You can learn what they all do by experimentation and also by reading the help screens that you can get by right clicking or control clicking a block and selecting help from the menu that appears If you forget what palette color a block is but you remember at least part of its name type control F and enter the name in the text block that appears in the palette area 13 II Saving and Loading Projects and Media After you ve created a project you ll want to save it so that you can have access to it the next time you use Snap There are several ways to do that You can save a project on your own computer or you can save it at the Snap web site The advantage of saving on the net is that you have access to your project even if you are using a different computer or a mobile device such as a tablet or smartphone The advantage of saving on your computer is that you have access to the saved project while on an airplane or otherwise not on the net This is why we have multiple ways to save A Local Storage There are two different ways to save a project or a media file such as a costume on your computer he reason for this complexity is that Javascript in which Snap is implemented deliberately restricts the ability of programs running in a browser to affect the computer This is a good thing because it means that you can confidently ru
14. id block 39 identity function 39 if block 10 if else block 38 imperative programming style 24 Import tools 10 Import tools option 60 Import option 59 in front of block 25 Ingalls Dan 3 inheritance 40 43 input 5 input list 35 input name dialog 19 27 Input sliders 62 input type shapes 27 instance 41 interaction 13 internal variable 30 item 1 of block 25 iteration library 60 J jigsaw piece blocks 17 28 jukebox 7 K Kay Alan 3 keep block 25 key value pair 44 L lambda 34 Language option 62 layout window 4 Libraries option 60 license 57 Lifelong Kindergarten Group 3 line drawing tool 71 linked list 25 list block 22 list library 60 list of procedures 38 List type 28 list linked 25 lists of lists 23 local state 40 Login 61 Logout 61 Long form input dialog 62 long input name dialog 27 M Make a block 17 make a block option 69 Make a list 22 Make a variable 12 make internal variable visible 30 Maloney John 3 map block 26 32 Massachusetts Institute of Technology 3 McCarthy John 3 Media Lab 3 message 40 message passing 40 42 method 40 42 middle 70 MIT Artificial Intelligence Lab 3 MIT Media Lab 3 Morphic 3 Motyashov Ivan 3 Multiple inputs 30 N nested calls 37 Nesting Sprites 8 New option 58 new sprite butto
15. in the move block above is called an input to the block By clicking on the white oval you can type any number in place of the 10 The sample script on the previous page uses 100 as the input value We ll see later that inputs can have non oval shapes that accept values other than numbers We ll also see that you can compute input values instead of typing a particular value into the oval A block can have more than one input slot For example the glide block located about halfway down the Motion palette has three inputs Most command blocks have that brick shape but some like the repeat block in the sample script are C shaped Most C shaped blocks are found in the Control palette The slot inside the C shape is a special kind of input slot that accepts a scnpt as the input In the sample script the repeat block has two inputs the number 4 and the script Meh 100 Maat turn amp 90 degrees A Sprites and Parallelism Just below the stage is the new sprite button Click the button to add a new sprite to the stage The new sprite will appear in a random position on the stage facing in a random direction with a random color Each sprite has its own scripts To see the scripts for a particular sprite in the scripting area click on the picture of that sprite in the sprite corral in the bottom right corner of the window Try putting one of the following scripts in each sprite s scripting area when clicked when clicke
16. more recent Thinking Recurswely in Java is ISBN 978 0471701460 C Block Libraries When you save a project see Section II above any custom blocks you ve made are saved with it But sometimes you d like to save a collection of blocks that you expect to be useful in more than one project The tools library we ve used throughout this manual is an example Perhaps your blocks implement a particular data structure a stack or a dictionary etc or they re the framework for building a multilevel game Such a collection of blocks is called a block library Creating a block library is done using the XML Export mechanism described on page 15 except that you choose Export blocks from the File menu instead of Export project You then see a window like this Export blocks TEREF ETH D if aoe KIS JOE E all but last letter of E empty H reverse B for each item ot B OK Cancel The window shows all of your global custom blocks You can uncheck some of the checkboxes to select exactly which blocks you want to include in your library You can right click or control click on the export window for a menu that lets you check or uncheck all the boxes at once Then press OK You ll see a new tab with XML encoded block definitions which you save using your browser s Save command To import a block library use the Import command in the File menu or just drag the XML file into the Snap win
17. name A When you give the variable a value the orange box in its watcher will display the value How do you give it a value You use the set block Note that you don t drag the variable s oval into the set block You click on the downarrow in the first input slot and you get a menu of all the available variable names Script Variables In that example our project 1s going to carry on an interaction with the user and we want to remember her name throughout the project That s a good example of a situation in which a global variable the kind you make with the Make a variable button is appropriate Another common example is a variable called score in a game project But sometimes you only need a variable temporarily during the running of a particular script In that case you can use the script variables block to make the variable when clicked script variables wiggle set wgala to pick random 1 to 10 pen down J UCE 50 EGTE turn 6 a x wiggle degrees Mem 50 Meets turn Gx wiggle degrees Meh 50 MICTE As in the for block you can click on an orange oval in the script variables block without dragging to change its name You can also make more than one temporary variable by clicking on the right arrow at the end of the block to add another variable oval script variables occa F Etcetera This manual doesn t explain every block in detail There are many more motion blocks sound
18. no Sound Editor in Snap and also no current sound the way there s a current costume for each sprite The sprite always has an appearance unless hidden but it doesn t sing unless explicitly asked So the context menu for sounds has only rename and delete options and it has a clickable button labeled Play or Stop as appropriate If you need a sound editor consider http audacity sourceforge net D Controls on the Stage The stage is the area in the top right of the Snap window in which sprites move Most sprites can be moved by clicking and dragging them If you have unchecked the draggable checkbox for a sprite then dragging it has no effect Control clicking right clicking a sprite shows this context menu duplicate delete edit export The duplicate option makes another sprite with the same scripts same costumes etc as this sprite The new sprite starts at a randomly chosen position different from the original so you can see quickly which 1s which The new sprite 1s selected It becomes the current sprite the one shown in the scripting area 72 The delete option deletes the sprite It s not just hidden it s gone for good The edit option selects the sprite It doesn t actually change anything about the sprite despite the name it s Just that making changes in the scripting area will change this sprite The export option opens a new browser tab containing the XML text representation of the sprite
19. not ask it something because we want to report a method not the value that the message reports So if we ask a buzzer to reset to a value divisible by 7 it will end up reporting that number not buzz D An Implementation of Prototyping OOP In the class instance system above it is necessary to design the complete behavior of a class before you can make any instances of the class This 1s okay for top down design but not great for experimentation Here we sketch the implementation of a prototyping OOP system You make an object tinker with it make clones of it and keep tinkering Any changes you make in the parent are inherited by its children In effect that first object is both the class and an instance of the class In the implementation below children share properties methods and local variables of their parent unless and until a child changes a property at which point that child gets a private copy Ifa child wants to change something for its entire family it must ask the parent to do it Because we want to be able to create and delete properties dynamically we won t use Snap variables to hold an object s variables or methods Instead each object has two tables called methods and data each of which is 43 an association list a list of two item lists in which each of the latter contains a key and a corresponding value We provide a lookup procedure to locate the key value pair corresponding to a given key in a
20. repeat but before each repetition it sets the variable i to a number starting with its first numeric input adding for each repetition until it reaches the second numeric input In this case there will be 200 repetitions first with i 1 then with i 2 then 3 and so on until i 200 for the final repetition The result is that each move draws a longer and longer line segment and that s why the picture you see 1s a kind of spiral If you try again with a turn of 90 degrees instead of 92 you ll see why this picture is called a squiral The variable i is created by the for block and it can only be used in the script inside the block s C slot By the way if you don t like the name i you can change it by clicking on the orange oval without dragging it which will pop up a dialog window in which you can enter a different name input name P p isn t a very descriptive name you might prefer length to indicate its purpose in the script is traditional because mathematicians tend to use letters between i and n to represent integer values but in programming languages we don t have to restrict ourselves to single letter variable names 1 The for block is also in the tools library choose Import tools from the file menu if you don t have it in the Control palette 11 Global Variables You can create variables by hand that aren t limited to being used within a single block At the top of the
21. script The continuation of a command block as we ve seen is a simple script with no input slots But the continuation of a reporter block has to do something with the value reported by the block so it takes that value as input For example in the script mu 90 TECE the continuation of the 3 4 block is move gE x result steps af input names result MA 90 Meteo tt ia Of course the name result in that picture is arbitrary any name could be used or no name at all by using the empty slot notation for input substitution A Continuation Passing Style Like all programming languages Snap evaluates compositions of nested reporters from the inside out For example in the expression Snap first adds 4 and 5 then multiplies 3 by that sum This often means that the order in which the operations are done is backwards from the order in which they appear in the expression When reading the above expression you say times before you say plus In English instead of saying three times four plus five which actually makes the order of operations ambiguous you could say take the sum of four and five and then take the product of three and that sum This sounds more awkward but it has the virtue of putting the operations in the order in which they re actually performed 50 That may seem like overkill in a simple expression but suppose you re trying to convey the expression EGCUEIIE 3 Ea EEGCOFI
22. script 68 D data hiding 40 data structure 23 data types 27 date 48 Dave Achal 3 debugging 64 default value 30 delegation 43 Delete a variable 13 delete block definition option 66 delete option 68 71 73 design principle 22 devices 47 dialog input name 19 Dinsmore Nathan 3 dispatch procedure 40 42 44 Download source option 58 draggable checkbox 66 duplicate option 67 71 72 dynamic array 25 E edit option 71 73 edit option 66 ellipse tool 71 72 ellipsis 30 empty input slots filling 33 35 37 eraser tool 71 Examples button 59 Execute on slider change 63 Export blocks option 60 export option 71 73 Export project option 59 expression 9 eyedropper tool 71 72 F factorial 20 38 File button 10 file icon menu 58 first class data type 22 flag green 5 Flat design 63 floodfill tool 71 for block 11 31 function associative 26 functional programming style 24 G global variable 13 green flag 5 64 green halo 67 grey dot 7 H halo 9 67 hat block 5 18 help option 65 67 help option for custom block 65 hexagonal blocks 17 28 hexagonal shape 10 hide option 65 75 hide primitives option 66 higher order function 37 higher order procedure 33 Hotchkiss Kyle 3 http block 47 Hudson Connor 3 I icons in title text 31
23. the fact that different processors can be manipulating the same data at the same time This makes the use of mutation changing the value associated with a variable problematic because it s impossible to know the exact sequence of events so the result of mutation may not be what the programmer expected Even without parallelism though functional programming is sometimes a simpler and more effective technique especially when dealing with recursively defined data structures It uses reporter blocks not command blocks to build up a list value in front ot B Cua 1 ve all but first of H In a functional program we often use recursion to construct a list one 1tem at a time The in front of block makes a list that has one item added to the front of an existing list without changing the value of the original list A nonempty list is processed by dividing it into its first item item 1 of and all the rest of the items all but first of which are handled through a recursive call evens data if empty data report Clan vE rie mod 2 report 1 item fiw 4 data in front of evens all but first of data else report Fiia ah But first of Snap uses two different internal representations of lists one dynamic array for imperative programming and the other linked list for functional programming Each representation makes the corresponding built in list blocks commands or reporters respectively most efficie
24. the variable block itself rather than the value of the variable as a Procedure type input you can drag the variable into the input slot then control click or right click it and choose ringify from the menu that appears Similarly if you ever want to call a function that will report a block to use as the input you can choose unringify from the menu Almost all the time though Snap does what you mean without help B Writing Higher Order Procedures A higher order procedure is one that takes another procedure as an input or that reports a procedure In this document the word procedure encompasses scripts individual blocks and nested reporters Unless specified otherwise reporter includes predicates When the word is capitalized inside a sentence 1t means specifically oval shaped blocks So nested reporters includes predicates but a Reporter type input doesn t Although an Any type input slot what you get if you use the small input name dialog box will accept a procedure input it doesn t automatically ring the input as described above So the declaration of Procedure type inputs makes the use of your custom higher order block much more convenient 33 Why would you want a block to take a procedure as input This is actually not an obscure thing to do the primitive conditional and looping blocks the C shaped ones in the Control palette take a script as input Users just don t usually
25. think about it in those terms We could write the repeat block as a custom block this way if Snap didn t already have one repeater number action A if number gt 0 run Elain _ repeater ELTU CCEE 1 B EGC The lambda A next to action in the prototype indicates that this is a C shaped block and that the script enclosed by the C when the block is used is the input named action in the body of the script The only way to make sense of the variable action is to understand that its value is a script To declare an input to be Procedure type open the input name dialog as usual and click on the arrowhead Create input name Cancel Then in the long dialog choose the appropriate Procedure type The third row of input types has a ring in the shape of each block type jigsaw for Commands oval for Reporters and hexagonal for Predicates In practice though in the case of Commands it s more common to choose the C shaped slot on the fourth row because this container for command scripts 1s familiar to Scratch users Technically the C shaped slot is an unevaluated procedure type something discussed in Section E below The two Command related input types inline and C shaped are connected by the fact that if a variable an item of list block or a custom Reporter block is dropped onto a C shaped slot it turns into an inline slot as in the repeater block s recursive call above Other buil
26. this Just above this part of the window is a set of three tabs Scripts Costumes and Sounds You ll see that the Costumes tab 1s now selected In this view the sprite s wardrobe you can choose whether the sprite should wear its Turtle costume or its Alonzo costume Alonzo the Snap mascot is named after Alonzo Church a mathematician who invented the idea of procedures as data the most important way in which Snap is different from Scratch You can give a sprite as many costumes as you like and then choose which it will wear either by clicking in its wardrobe or by using the or block in a script Every costume has a number as well asa name he next costume block selects the next costume by number after the highest numbered costume it switches to costume 1 The Turtle costume 0 is never chosen by next costume The Turtle costume is the only one that changes color to match a change in the sprite s pen color In addition to its costumes a sprite can have sounds the equivalent for sounds of the sprite s wardrobe is called its jukebox Sound files can be imported in any format WAV OGG MP3 etc supported by your browser Two blocks accomplish the task of playing sounds If you would like a script to continue running while the sound is playing use the block 5 2 Ses In contrast you can use the oy ee ie ee block to wait for the sound s completion before continuing the rest of the script Inter Sprite Comm
27. to third party software libraries such as the speech synthesis package linked on our web site Most of these packages require some expertise to install the links are to source code repositories This situation will improve with time C Date and Time The current block in the Sensing palette can be used to find out the current date or time Each call to this block reports one component of the date or time so you will probably combine several calls like this join current month current date current year for Americans or like this join current date current montn ETN year for Europeans 43 IX Continuations Blocks are usually used within a script The continuation of a block within a particular script is the part of the computation that remains to be completed after the block does its job A continuation can be represented as a ringed script Continuations are always part of the interpretation of any program in any language but usually these continuations are implicit in the data structures of the language interpreter or compiler Making continuations explicit is an advanced but versatile programming technique that allows users to create control structures such as nonlocal exit and multithreading In the simplest case the continuation of a command block may just be the part of the script after the block For example in the script pen down Mee 50 IGE turn amp 30 degrees UOCE 100 GTE Maan 20 EEEE
28. EE 2 EE 2 Me 5 to a friend over the phone If you say factorial of three times factorial of two plus two plus five you might mean any of these ECCOIR 3 MeMerlaclit ie 2 FTF 2 TEJ 5 ECGCUEIRE 3 Ea EEGCOFIB TE 2 EZ 5 factorial 3 x ECHEN me 2 ERT 5 ECHEN BER 2 oe 5 factorial kK x Wouldn t it be better to say Add two and two take the factorial of that add five to that multiply three by that and take the factorial of the result We can do a similar reordering of an expression if we first define versions of all the reporters that take their continuation as an explicit input In the following picture notice that the new blocks are commands not reporters add a cont A factorlal cont A run cont withinputs a equals n o if eqresulit uU E ont subtract i cont FA ET run cont ide Inputs factorial subresutt ee ee oo ee ee M multiply n factresult cont input names T factresult o 198 Bite ii wt ERP MSR PEET multiply gt j Jen T run cont WIth Inputs mes 7 i mdo Amed de wt tis md CUECA cont A run cont with inputs We can check that these blocks give the results we want eatin 5 TESTA gt 51 The original expression can now be represented as add first fact yur multiply 3 second sum input names CED gt input names INET gt If you read this top to bottom don t you get Add two and two take the factorial of that a
29. T IAT aml count SEESE 1 CTG Siset ftotai MET ETT Stota eee 1 la ae ae ET count DE a eT E total input names self Tria 4 say ask counterl ff for 2 secs next set counter2 to ask counterl tell counter2 count f0 PEIR 3 AFT counter2 next for 2 secs TEIR 4 F counterl ffl for 2 secs 46 VIII The Outside World The facilities discussed so far are fine for projects that take place entirely on your computer s screen But you may want to write programs that interact with physical devices sensors or robots or with the World Wide Web For these purposes Snap provides a single primitive block http This might not seem like enough but in fact it can be used to build the desired capabilities A The World Wide Web The input to the http block is the URL Uniform Resource Locator of a web page The block reports the body of the Web server s response minus HTTP header without interpretation This means that in most cases the response is a description of the page in HTML HyperText Markup Language notation Often especially for commercial web sites the actual information you re trying to find on the page is actually at another URL included in the reported HTML The Web page is typically a very long text string and so the primitive split block is useful to get the text in a manageable form namely as a list of lines LE lt DOCTYPE HTML PUBLIC 4 IETF DTD HTML 2 0 EN g
30. Variables palette click the Make a variable button Motion Control LOOKS Sensing Sound Operators Pen Variables set to i change by D This will bring up a dialog window in which you can give your variable a name Variable name foralisprites for this sprite only OK Cancel The dialog also gives you a choice to make the variable available to all sprites which is almost always what you want or to make it visible only in the current sprite You d do that if you re going to give several sprites individual variables with the same name so that you can share a script between sprites by dragging it from the current sprite s scripting area to the picture of another sprite in the sprite corral and the different sprites will do slightly different things when running that script because each has a different value for that variable name If you give your variable the name name then the Variables palette will look like this Motion Control Looks Sensing Sound Operators Variables Make a variable Pen Delete a variable set to ij change by 1 12 There s now a Delete a variable button and there s an orange oval with the variable name in it just like the orange oval in the for block You can drag the variable into any script in the scripting area Next to the oval is a checkbox initially checked When it s checked you ll also see a variable watcher on the stage
31. ables Scripts Costumes Sounds UOCE 10 EGOE MA 15 OLE turn 4 i5 degrees point in direction 90 v point towards CEECEE O Bae 0 go to COR eile mo ee O re O rit eam 10 set x to O change y by 10 TISERE 0 if on edge bounce Bea y position E direction The proportions of these areas may be different depending on the size and shape of your browser window A Snap program consists of one or more scripts each of which is made of blocks Here s a typical script when clicked pen down Thiet 4 Melee 100 Bact MRA 90 degrees The five blocks that make up this script have three different colors corresponding to three of the eight palettes in which blocks can be found The palette area at the left edge of the window shows one palette at a time chosen with the eight buttons just above the palette area In this script the gold blocks are from the Control palette the green block is from the Pen palette and the blue blocks are from the Motion palette A script is assembled by dragging blocks from a palette into the scripting area in the middle part of the window Blocks snap together hence the name Snap for the language when you drag a block so that its indentation 1s near the tab of the one above it when clicked ic down a The white horizontal line is a signal that if you let go of the green block it will snap into the tab of the gold one Hat Blocks and Command Blocks
32. al project they d be the same color probably Sprite 1 representing Alonzo s body is the anchor Sprite2 1s the arm The icon for the anchor shows small images of up to three attached parts at the bottom The icon for each part shows a small image of the anchor in its top left corner and a synchronous rotation flag in the top right corner In its initial setting as shown above it means that the when the anchor sprite rotates the part sprite also rotates as well as revolving around the anchor When clicked it changes from a circular arrow to a straight arrow and indicates that when the anchor sprite rotates the part sprite revolves around it but does not rotate keeping its original orientation The part can also be rotated separately using its turn blocks Any change in the position or size of the anchor is always extended to its parts rae a Wave repeat 4 turn 5 degrees repeat 4 turn 4 5 degrees walt f1 secs C Reporter Blocks and Expressions So far we ve used two kinds of blocks hat blocks and command blocks Another kind is the reporter block which has an oval shape EJRESZEEY It s called a reporter because when it s run instead of carrying out an action it reports a value that can be used as an input to another block If you drag a reporter into the scripting area by itself and click on it the value it reports will appear in a speech balloon next to the block D x saad Sia Wh
33. anslation 62 Turbo mode 63 Turtle costume 70 turtle s rotation point 70 U undo button 72 undrop option 69 unevaluated procedure types 29 unringify 33 42 68 Unshare 59 upvar 31 upward pointing arrow 30 user interface elements 57 V variable 11 variable watcher 13 variable input slot 35 variadic library 61 W wardrobe 7 watcher 13 window layout 4 with inputs 33 word and sentence library 61 World Wide Web 47 writeable pulldown inputs 29 X X position 9 Xerox PARC 3 Y Y position 9 Yuan Yuan 3 K zebra coloring 9 Zoom blocks option 62
34. ants of the primitive repeat until block giving all while four combinations of whether the first test happens before or after the first repetition repeat while and whether the condition must be true or false to continue repeating The last repeat repeat block 1s like the repeat primitive but makes the number of repetitions so far available to the repeated script The list library has these blocks append E The append block takes any number of list inputs and reports a list of all the items a of all the input lists Reverse reports a list with the items of the input list in sort E ordering with reverse order Remove duplicates from reports a list in which no two items are map _D over B equal The sort block takes a list and a two input comparison predicate such as Se lt and reports a list with the items sorted according to that comparison combine with gt items of H for each GD of I The other four blocks are versions of the list tools that provide a variable containing the position in the input list of the currently considered item This version of map also allows multiple list inputs in which case the mapping function must take as many inputs as there are lists 1t will be called with all the first items all the second items and so on The stream library has these blocks A PAA Streams are a special kind of list whose items are not computed until they are head of stream I needed This makes ce
35. atory except for the last block which takes a a 4 text string as input and reports a list of one character long strings empty sentence word gt list The Cloud Menu The cloud icon shows a menu of options relating to your Snap cloud account If you are not logged in you see this menu Login signup Reset Password Choose Login if you have a Snap account and remember your password Choose Signup if you don t have an account Choose Reset Password if you ve forgotten your password or just want to change it You will then get an email at the address you gave when you created your account with a new temporary password Use that password to log in then you can choose your own password as shown below If you are already logged in you ll see this menu Logout bh Change Password Logout is obvious but has the additional benefit of showing you who s logged in Change password will ask for your old password the temporary one if you re resetting your password and the new password you want entered twice because it doesn t echo 61 The Settings Menu The settings icon B shows a menu of Snap options either for the current project or for you permanently depending on the option Language Zoom blocks Stage size A Long form input dialog A Plain prototype labels _ Input sliders Clicking sound Turbo mode Flat design Thread safe scripts Prefer smooth animati
36. bles 41 B Messages and Dispatch Procedures 42 C Inheritance via Delegation 43 D An Implementation of Prototyping OOP 45 VIII The Outside World 47 A The World Wide Web 47 B Hardware Devices 48 C Date and Time 48 IX Continuations 49 A Continuation Passing Style 50 B Call Run w Continuation 53 Nonlocal exit 55 X User Interface Elements 57 A Tool Bar Features 57 The Snap Logo Menu 57 The File Menu 58 The Cloud Menu 61 The Settings Menu 62 Stage Resizing Buttons 64 Project Control Buttons 64 B The Palette Area 65 Context Menus for Palette Blocks 65 Context Menu for the Palette Background 66 C The Scripting Area 66 Sprite Appearance and Behavior Controls 66 Scripting Area Tabs 67 Scripts and Blocks Within Scripts 67 Scripting Area Background Context Menu 68 Controls in the Costumes Tab 70 The Paint Editor 71 Controls in the Sounds Tab 72 D Controls on the Stage 72 E The Sprite Corral and Sprite Creation Buttons 73 Index 75 Acknowledgements We have been extremely lucky in our mentors Jens cut his teeth in the company of the Smalltalk pioneers Alan Kay Dan Ingalls and the rest of the gang who invented personal computing and object oriented programming in the great days of Xerox PARC He worked with John Maloney of the MIT Scratch Team who developed the Morphic graphics framework that s still at the heart of Snap The brilliant design of Scratch from the Lifelong Kindergarten Group at the MIT
37. block which is automatically added at the end of every thread s script by the thread block just runs the next waiting task thread action A run action add to tasks end thread add continuation to tasks set next to item 1 v of tasks input names continuation end thread delete E of tasks Ci 5 next script variables next run x w continuation if not empty tasks set next to item QR of tasks delete 1 of tasks E t when clicked set task to liist thread l l or D 0 Here is a sample script using the thread system i o One thread says numbers the other says letters Sayn or P secs The number thread yields after every prime if prime number while the letter thread yields after every jield vowel So the sequence of speech balloons is 1 2 a 3 b c d e 4 5 f h 1 6 7 J k 1 m n o0 8 9 10 11 thread p q r s t u l 2 l 3 V W X Y Z l 4 l 3 l 6 l ip l 8 30 script variables letter tm or set lotta to unicode as letter Ui say letter for secs if a a i o u contains letter If we wanted this to behave exactly like Snap s own threads we d define new versions of repeat and so on that run yield after each repetition end thread 56 X User Interface Elements In this section we describe in detail the various buttons menus and other clickable elements of the Snap user interface Here again is the map of the Snap window Snap fo i untitled
38. category 1s shown Motion Looks Sound Pen Control Sensing Operators and Variables which also includes the List and Other blocks There are no menus behind these buttons Context Menus for Palette Blocks If you control click right click a primitive block in the palette you see this menu The help option displays a box with documentation about the block Here s an example Tiler 65 Bete lacs MITTEE 65 Berm clacts Tile 120609 Bem clacts TEE 960 EGCG MTCC 9775 EGC Some Unicode values PEE Se an 48 57 digits 0 9 http www unicode org charts 65 90 capital letters A Z There are also unofficial Unicode values for fictional 97 122 lower case letters a z Fai a TOT PRT EE OES 32 space cy The hide option removes that block from the palette This option is available only when clicking the block in the palette itself not in a script The purpose of the option is to allow teachers to present students with a simplified Snap with some features effectively removed The hiddenness of primitives is saved with each project so students can load a shared project and see just the desired blocks If you control click right click a custom user defined block in the palette you see this menu help delete block definition edit The help option for a custom block displays the comment if any attached to the custom block s hat block in the Block Editor Here is an example of a block with a co
39. d or an object with no parent is found the latter case is an error meaning that the user has sent the object a message not in its repertoire Messages can take any number of inputs as in the class instance system but in the prototyping version every method automatically gets the object to which the message was originally sent as an extra first nput We must do this so that 1f a method is found in the parent or grandparent etc of the original recipient and that method refers to a variable or method it will use the child s variable or method if the child has its own version 44 The clone of block below takes an object as its input and makes a child object It should be considered as an internal part of the implementation the preferred way to make a child of an object is to send that object a clone message insert value into _ rt name value into data methods ve input name TH z CD are gt insert into methoc gt i ae into methods E ib aa ds l ames insert fi insert cione report clone of self eee Ld into methods insert delete var delete name from from data in input names CO name Ki insert jdelete metnod delete name from methods ir insert into me Tere E call parent with inputs message report a parent Swi mputs message Siz report iist input names Every object is created with predefined methods for set meth
40. d Tria 50 tia 50 UCICE 100 Bacto MA 36 degrees Wade 180 EEC When you click the green flag you should see one sprite rotate while the other moves back and forth This experiment illustrates the way different scripts can run in parallel The turning and the moving happen together Parallelism can be seen with multiple scripts of a single sprite also Try this example when space Key pressed when space Key pressed forever forever UOCE 10 Meader Maan 15 EE When you press the space key the sprite should move forever in a circle because the move and turn blocks are run in parallel Io stop the program click the red stop sign at the right end of the tool bar Costumes and Sounds To change the appearance of a sprite import a new costume for it There are three ways to do this First select the desired sprite in the sprite corral Then one way is to click on the file icon in the tool bar then choose the Costumes menu item You will see a list of costumes from the public media library and can choose one The second way for a costume stored on your own computer is too click on the file icon and choose the Import menu item You can then select a file in any picture format PNG JPEG etc supported by your browser The third way 1s quicker if the file you want 1s visible on the desktop Just drag the file onto the Snap window In any of these cases the scripting area will be replaced by something like
41. dd five to that multiply three by that and take the factorial of the result Just what we wanted This way of working in which every block is a command that takes a continuation as one of its inputs 1s called contenuation passing style CPS Okay it looks horrible but it has subtle virtues One of them is that each script is just one block long with the rest of the work buried in the continuation given to that one block so each block doesn t have to remember what else to do in the vocabulary of this section the implicit continuation of each block is empty Instead of the usual picture of recursion with a bunch of little people all waiting for each other with GPS what happens 1s that each little person hands off the problem to the next one and goes to the beach so there s only one active little person at a time In this example we start with Alfred an add specialist who computes the value 4 and then hands off the rest of the problem to Francine a factorial specialist She computes the value 24 then hands the problem off to Anne another add specialist who computes 29 And so on until finally Sam a say specialist says the value 2 107757298379527 x 10 which is a very large number 2 107757298379527e 132 Go back to the definitions of these blocks The ones such as add that correspond to primitive reporters are simple they just call the reporter and then call their continuation with its result But the definitio
42. dow 2 IV First Class Lists A data type 1s first class in a programming language if data of that type can be the value of a variable an input to a procedure the value returned by a procedure a member of a data aggregate anonymous not named In Scratch numbers and text strings are first class You can put a number in a variable use one as the input to a block call a reporter that reports a number or put a number into a list But Scratch s lists are not first class You create one using the Make a list button which requires that you sive the lista name You can t put the list into a variable into an input slot of a block or into a list 1tem you can t have lists of lists None of the Scratch reporters reports a list value You can use a reduction of the list into a text string as input to other blocks but this loses the list structure the input is just a text string not a data aggregate A fundamental design principle in Snap is that all data should be first class If it s in the language then we should be able to use it fully and freely We believe that this principle avoids the need for many special case tools which can instead be written by Snap users themselves Note that it s a data type that s first class not an individual value Don t think for example that some lists are first class while others aren t In Snap lists are first class period ie OANE Asnap Ev
43. e Reporter type or Predicate type Each of these types 1s directly below the type of value that that kind of block reports except for Commands which don t report a value at all Thus oval Reporters are related to the Any type while hexagonal Predicates are related to the Boolean true or false type l In Scratch every block that takes a Text type input has a default value that makes the rectangles for text wider than tall The blocks that aren t specifically about text either are of Number type or have no default value so those rectangles are taller than wide At first we thought that Text was a separate type that always had a wide input slot it turns out that this isn t true in Scratch delete the default text and the rectangle narrows but we thought it a good idea anyway so we allow Text shaped boxes even for empty input slots This is why Text comes just above Any in the input type selection box 28 The unevaluated procedure types in the fourth row are explained in Section VLE below In one handwavy sentence they combine the meaning of the procedure types with the appearance of the reported value types two rows higher Of course this isn t quite right for the C shaped command input type since commands don t report values But you ll see later that it s true in spirit Create input name ar Fani A i Tithe text Input name Object E 1 tex Number BM Any type Boolean T F Command S i Reporter
44. e that s an important piece of personally identifiable information When you click OK an email will be sent to the email address you gave with an initial password for your account We keep your email address on file so that if you forget your password we can send you a password reset link We will also email you 1f your account is suspended for violation of the Terms of Service We do not 15 use your address for any other purpose You will never receive marketing emails of any kind through this site neither from us nor from third parties If nevertheless you are worried about providing this information do a web search for temporary email Finally you must read and agree to the Terms of Service A quick summary Don t interfere with anyone else s use of the web site and don t put copyrighted media or personally identifiable information in projects that you share with other users And we re not responsible if something goes wrong Not that we expect anything to go wrong since Snap runs in Javascript in your browser it 1s strongly isolated from the rest of your computer But the lawyers make us say this Once you ve created your account you can log into it using the Login option from the Cloud menu Username Password stay signed in on this computer until logging out OK Cancel Use the user name and password that you set up earlier If you check the Stay signed in box
45. el wee he dana In this dialog the three large buttons at the left select a source of projects Cloud means your Snap account s cloud storage Browser means your browser s localstore data accessible only in that browser on that computer 58 by that user Examples means a collection of sample projects we provide The text box to the nght of those buttons 1s an alphabetical listing of projects from that source selecting a project by clicking shows its thumbnail a picture of the stage when it was saved and its project notes at the right The four buttons at the bottom select an action to perform on the selected project The first button Open loads the project into Snap and closes the dialog box The second button only if Cloud is the source is labeled either Share or Unshare a shared project can be read but not modified by any Snap user not only by you Shared projects are indicated in boldface in the project listing box The next button if Cloud or Browser is the source is Delete and if clicked it deletes the selected project Finally the Cancel button closes the dialog box without opening a project It does not undo any sharing unsharing or deletion you ve done The Save menu option saves the project to the same source and same name that was used when opening the project If you opened another user s shared project or an example project the project will be saved to your own cloud accoun
46. eme 3 Scratch 4 7 17 22 23 24 27 Scratch Team 3 script 4 script pic 68 script variables block 13 41 scripting area 5 66 scripting area background context menu 68 scripts pic option 69 sensors 47 sentence library 61 set block 13 settings icon 62 shapes of blocks 17 Share 59 shortcut 69 73 show all option 73 show option 73 show primitives option 66 shrink grow button 64 sieve 60 Signup 61 simulation 40 Single input 30 Snap logo menu 57 Snap program 4 Snap website option 58 snap berkeley edu 58 solid ellipse tool 71 solid rectangle tool 71 sort 60 source files for Snap 58 special form 39 split block 47 sprite 5 sprite appearance and behavior controls 66 sprite corral 6 73 sprite creation buttons 73 sprite nesting 8 squiral 11 stack of blocks 5 stage 5 Stage resizing buttons 64 Stanford Artificial Intelligence Lab 3 Steele Guy 3 stop block block 21 stop button 64 stop sign 6 stream library 60 Structure and Interpretation of Computer Programs 3 Sussman Gerald J 3 Sussman Julie 3 symbols in title text 31 T text input 7 Text type 28 text based language 64 Thinking Recurswely 21 thread 56 Thread safe scripts 63 thumbnail 66 time 48 tip 70 title text 19 tool bar 5 tool bar features 57 tools library 4 11 25 tr
47. en you drag a reporter block over another block s input slot a white halo appears around that input slot analogous to the white line that appears when snapping command blocks together Here s a simple script that uses a reporter block when clicked forever eh 10 BICIE turn 2 15 degrees 35 3905801 1260056 say xX position for 0 2 secs Here the x position reporter provides the first input to the say block The sprite s X position is its horizontal position how far left negative values or right positive values it is compared to the center of the stage Similarly the Y position is measured vertically in steps above positive or below negative the center You can do arithmetic using reporters in the Operators palette when clicked forever DUCIE 10 BICE Maal 15 ERCE lads 135 Tan round ERATO EH 100 BECIA 0 2 Bete The round block rounds 35 3905 to 35 and the block adds 100 to that By the way the round block 1s in the Operators palette just like but in this script it s a lighter color with black lettering because Snap alternates light and dark versions of the palette colors when a block is nested inside another block from the same palette x position lt 0 gt and y position repeat 4 nove i o O steps turn join p P GO degrees This aid to readability is called zebra coloring A reporter block with its inputs maybe including other report
48. er blocks such as round G9REENER 8 100 9 is called an expression D Predicates and Conditional Evaluation Most reporters report either a number like CEI or a text string like join EA Frond A A predicate is a special kind of reporter that always reports true or false Predicates have a hexagonal shape mouse down The special shape is a reminder that predicates don t generally make sense in an input slot of blocks that are expecting a number or text You wouldn t say ENS Eo TE ES although as you can see from the picture Snap lets you do it if you really want Instead you normally use predicates in special hexagonal input slots like this one The C shaped if block runs its input script if and only 1f the expression in its hexagonal input reports true ff y position lt J A really useful block in animations runs its input script repeatedly until a predicate 1s satisfied point towards Sprite2 x repeat until touching UCE 3 KIGE If while working on a project you want to omit temporarily some commands in a script but you don t want to forget where they belong you can say him 10 EGTE M 15 TECE t faise say l mrnotgoing to do this Bila 2 ETIT CCR 1 KOCR CE A 0 BHE O A TC 90 v Sometimes you want to take the same action whether some condition 1s true or false but with a different input value For this purpose you can use the reporter if block say join monhe
49. ere is a right facing arrowhead after the Input name option Create input name OK Cancel Clicking that arrowhead opens the long input name dialog Create input name Input name v D Obec JE tex mM Any type Boolean T F ws Command z l gt e 5 Reponer J Predicate e tinting Command A Any Boolean C shape unevaluated unevaluated single input Detaun vawe Muitipie inputs value is iist ot inputs upvar make internal variable visible to caller OK Cancel There are twelve input type shapes plus three mutually exclusive categories listed in addition to the basic choice between title text and an input name The default type the one you get if you don t choose anything 27 else is Any meaning that this input slot is meant to accept any value of any type If the size input in your block should be an oval shaped numeric slot rather than a generic rectangle click Number The arrangement of the input types 1s systematic As the pictures on this and the next page show each row of types 1s a category and parts of each column form a category Understanding the arrangement will make it a little easier to find the type you want Create input name E tex BE nye Boolean T F Snap non procedure types gt FER Types that exist in Scratch gt KE EIZ Snap procedure types Wi aee gt Snap unevaluated p
50. erything first class A The list Block At the heart of providing first class lists 1s the ability to make an anonymous list to make a list without simultaneously giving ita name The list reporter block does that CET D gt as n appears in ne variables palette list a tis list H4 gt Clicking the left arrowhead lets you make an empty lisi At the right end of the block are two left and right arrowheads Clicking on these changes the number of inputs to list 1 e the number of elements in the list you are building 22 You can use this block as input to many other blocks T PE ee casne Loves fYou J 2 C 3 A CUPLURI A ISEI SNe zai P Gow or Ae em vowel letter report ISt a a i a u contains letter Snap does not have a Make a list button like the one in Scratch If you want a global named list make a global variable and use the set block to put a list into the variable B Lists of Lists Lists can be inserted as elements in larger lists We can easily create ad hoc structures as needed list list We can also build any classic computer science data structure out of lists of lists by defining constructors blocks to make an example of the structure selectors blocks to pull out a piece of the structure and mutators blocks to change the contents of the structure as needed Here we create binary trees with selectors that check for input of the correct data ty
51. explicit parameters in the ring as discussed in subsection C below An even more important thing to notice about these examples is the ring around the Reporter type input slots in call and map above This notation indicates that the block itself not the number or other value that the block would report when called is the input If you want to use a block itself in a non Reporter type e g Any type input slot you can enclose it explicitly in a ring found at the top of the Operators palette As a shortcut 1f you right click or control click on a block such as the block in this example one of the choices in the menu that appears is ringify or unringify The ring indicating a Reporter type or Predicate value block 5 cr me vac report block type input slot 1s essentially the same idea for reporters as the C shaped input slot with which you re already familiar with a C shaped slot it s the script you put in the slot that becomes the input to the C shaped block Variables in Ring Slots Note that the run block n the definition of the for block page 32 doesn t have a ring around its input variable action When you drag a variable into a ringed input slot you generally do want to use the value of the variable which will be the block or script you re trying to run or call rather than the orange variable reporter itself So Snap automatically removes the ring in this case If you ever do want to use
52. f inputs provided then Snap fills the empty slots from left to right 50 D with inputs fo 2 If exactly one input is provided Snap will fill any number of empty slots with it 29 OED 3 Otherwise Snap won t fill any slots because the user s intention is unclear If the user wants to override these rules the solution 1s to use a ring with explicit input names that can be put into the given block or script to indicate how inputs are to be used This will be discussed more fully below Recursive Calls to Multiple Input Blocks A relatively rare situation not yet considered here is the case of a recursive block that has a variable number of inputs Let s say the user of your project calls your block with five inputs one time and 87 inputs another time How do you write the recursive call to your block when you don t know how many inputs to give it The answer 1s that you collect the inputs in a list recall that when you declare an input name to represent a variable number of inputs your block sees those inputs as a list of values in the first place and then 1n the recursive call you drop that input list onto the arrowheads that indicate a variable input slot rather than onto the input slot Edit input name sizes numbers sizes numbers if length of numbers gt J if length of numbers gt J set size to item GI of numbers set size to item I of numbers d walt 0 3 secs
53. finition of a block that takes any number of lists and reports the list of all possible combinations of one item from each list The important part for this discussion 1s that near the bottom there are two nested calls to map the higher order function that applies an input function to each item of an input list In the inner block the function being mapped is in front of and that block takes two inputs The second the empty List type slot will get its value in each call from an item of the inner map s list input But there is no way for the outer map to communicate values to empty slots of the in front of block We must give an explicit name newitem to the value that the outer map is giving to the inner one then drag that variable into the in front of block By the way once the called block provides names for its inputs Snap will not automatically fill empty slots on the theory that the user has taken control In fact that s another reason you might want to name the inputs explicitly to stop Snap from filling a slot that should really remain empty D Procedures as Data Here s an example of a situation in which a procedure must be explicitly marked as data by pulling a ring from the Operators palette and putting the procedure block or script inside it UCE 10 BIGE if on edge bounce DOIE 10 BIGTE if on edge bounce 37 Here we are making a list of procedures But the list block accepts inputs of any t
54. ft click on the grey striped background of the scripting area gives this menu clean up add comment undrop scripts pic make a block The clean up option rearranges the position of scripts so that they are in a single column with the same left margin and with uniform spacing between scripts This is a good idea if you can t read your own project The add comment option puts a comment box like the picture below in the scripting area It s attached to the mouse as with duplicating scripts so you position the mouse where you want the comment and click to release it You can then edit the text in the comment as desired v add comment here 68 You can drag the bottom right corner of the comment box to resize it Clicking the arrowhead at the top left changes the box to a single line compact form as below so that you can have a number of collapsed comments in the scripting area and just expand one of them when you want to read it in full gt add comment t If you drag a comment over a block in a script the comment will be attached to the block with a yellow line Ure alae 10 E v add comment harea Comments have their own context menu with obvious meanings duplicate delete comment pic Back to the options in the menu for the background of the scripting area clean up add comment undrop scripts pic make a block The undrop option 1s a sort of undo feature for the comm
55. given table key alist Pa to length of alist illo vee tem Ji alist report item found assoc result assoc resutlt report list report not empty assoc f _ o list FY fy Sac id Sge at Sac mn v _ leng 0 4 Tox i list list Ey fy Sac fo Sge mt Sac in There are also commands to insert and delete entries insert name value into table delete key from tabie script variables kv pair for index Bto length of table KV D name table vies O Nist W Sect 1 vie index table if found Kv pair delete index of table KV pal vaiue EC 2 Va pair with stop block else insert name value at E of table As in the class instance version an object is represented as a dispatch procedure that takes a message as its input and reports the corresponding method When an object gets a message it will first look for that keyword in its methods table Ifit s found the corresponding value is the method we want If not the object looks in its data table Ifa value is found there what the object returns is not that value but rather a reporter method that when called will report the value This means that what an object returns 1s always a method If the object has neither a method nor a datum with the desired name but it does have a parent then the parent that 1s the parent s dispatch procedure is invoked with the message as its input Eventually either a match is foun
56. he idea of object oriented programming is often taught in a way that makes it seem as if a special object oriented programming language is necessary In fact any language with first class procedures allows objects to be implemented explicitly this is a useful exercise to help demystify objects The central idea of this implementation is that an object is represented as a dispatch procedure that takes a message as input and reports the corresponding method In this section we start with a stripped down example to show how local state works and build up to full implementations of class instance and prototyping OOP 40 A Local State with Script Variables make a counter script variables count set count to W change co report report count This script implements an object class a type of object namely the counter class In this first simplified version there is only one method so no explicit message passing is necessary When the make a counter block 1s called it reports a procedure the ringed script inside its body That procedure implements a specific counter object an instance of the counter class When invoked a counter instance increases and reports its count variable Each counter has its own local count set counter to make a counter set counter2 to make a counter say call counter1 C 2 ete say call counter1 le 2 ETIT say call counteri le 2 EIT say call counter1 Vie 2 ete l think ca
57. ibrary collection or contribute one To see some examples open the project Codification in the Examples project list Edit the blocks map to Smalltalk map to JavaScript etc to see examples of how to provide translations for blocks Stage Resizing Buttons Still in the tool bar but above the left edge of the stage are two buttons that change the size of the stage The first is the shrink grow button Normally it looks like this Clicking the button displays the stage at half normal size horizontally and vertically so it takes up 1 4 of its usual area When the stage 1s half size the button looks like this and clicking it returns the stage to normal size The main reason you d want a half size stage is during the development process when you re assembling scripts with wide input expressions and the normal scripting area isn t wide enough to show the complete script You d typically then switch back to normal size to try out the project The next presentation mode button normally looks like this Clicking the button makes the stage double size in both dimensions and eliminates most of the other user interface elements the palette the scripting area the sprite corral and most of the tool bar When you open a shared project using a link someone has sent you the project starts in presentation mode While in presentation mode the button looks like this Clicking it returns to normal project development mode Pr
58. if position lt then aargh The technical term for a true or false value is a Boolean value it has a capital B because it s named after a person George Boole who developed the mathematical theory of Boolean values Don t get confused a hexagonal block 1s a predicate but the value it reports 1s a Boolean Another quibble about vocabulary Many programming languages reserve the name procedure for Commands that carry out an action and use the name function for Reporters and Predicates In this manual a procedure is any computational capability including those that report values and those that don t Commands Reporters and Predicates are all procedures The words a Procedure type are shorthand for Command type Reporter type or Predicate type l If you don t see it in the Control palette click on the File button O in the Tool Bar and choose Import tools 10 E Variables Try this script when clicked pen down CU 1 BO 200 move steps turn amp 92 degrees The input to the move block is an orange oval To get it there drag the orange oval that s part of the for block when clicked pen down The orange oval 1s a variable a symbol that represents a value I took this screenshot before changing the second number input to the for block from the default 10 to 200 and before dragging in a turn block For runs its script input repeatedly just like
59. in which that input appears The project live tree in the Examples collection shows how this can be used it features a fractal tree custom block with several inputs and you can see how each input affects the picture by moving a slider This option is per project not per user Clicking sound causes a really annoying sound effect whenever one block snaps next to another in a script Certain very young children and our colleague Dan Garcia like this but if you are such a child you should bear in mind that driving your parents or teachers crazy will result in you not being allowed to use Snap Turbo mode makes most projects run much faster at the cost of not keeping the stage display up to date Snap ordinarily spends most of its time drawing sprites and updating variable watchers rather than actually carrying out the instructions in your scripts So turbo mode isn t a good idea for a project with glide blocks or one in which the user interacts with animated characters but it s great for drawing a complicated fractal or computing the first million digits of LJ so that you don t need to see anything until the final result While in turbo mode the button that normally shows a green flag instead shows a green lightning bolt But when LI clicked hat blocks still activate when the button 1s clicked Flat design changes the skin of the Snap window to a really hideous design with white and pale grey background rectangular rather
60. into the script then click okay square size pen down p Tria 4 move size steps MRA 90 degrees 19 Your block now appears in the Motion palette with an input box You can draw any size square by entering the length of its side in the box and running the block as usual by double clicking it or by putting it in a script B Recursion Since the new custom block appears in its palette as soon as you start editing it you can write recursive blocks blocks that call themselves by dragging the block into its own definition tree size size depth deptn if depth gt 09 move Size steps M 15 EGE tree size x sze depth depth p when clicked p en down MR 40 EEEE P PUM TC O wv tree size x size depth depth p i r 100 PETG ag 25 ETEC p move size steps If recursion is new to you here are a few brief hints It s crucial that the recursion have a base case that 1s some small est case that the block can handle without using recursion In this example it s the case depth 0 for which the block does nothing at all because of the enclosing if Without a base case the recursion would run forever calling itself over and over Don t try to trace the exact sequence of steps that the computer follows in a recursive program Instead imagine that inside the computer there are many small people and if Theresa is drawing a tree of size 100 depth 6 she hires To
61. itives option which is in the menu only if some primitives of this palette are hidden unhides all of them C The Scripting Area The scripting area is the middle vertical region of the Snap window containing scripts and also some controls for the appearance and behavior of a sprite There is always a current sprite whose scripts are shown in the scripting area A dark grey rounded rectangle in the sprite corral shows which sprite or the stage 1s current Note that it s only the visible display of the scripting area that is current for a sprite all scripts of all sprites may be running at the same time Clicking on a sprite thumbnail in the sprite corral makes it current The stage itself can be selected as current in which case the appearance 1s slightly different Sprite Appearance and Behavior Controls At the top of the scripting area are a picture of the sprite and some controls for it Note that the sprite picture reflects its rotation 1f any There are three things that can be controlled here The three circular buttons in a column at the left control the sprite s rotation behavior Sprite costumes are designed to be right side up when the sprite 1s facing toward the right direction 90 Ifthe topmost button is lit the default as shown in the picture above then the sprite s costume rotates as the sprite changes direction If the middle button 1s selected then the costume 1s reversed left right when the s
62. iven list as its input and collecting the results as a list The reported list will always be the same length as the input list Note that the multiplication block has two inputs but here we have specified a particular value for one of them 10 so the call block knows to use the input value given to it just to fill the other empty input slot in the multiplication block In the map definition the input function is declared to be type Reporter and data is of type List Call Run with inputs The call block like the run block has a nght arrowhead at the end clicking on it adds the phrase with inputs and then a slot into which an input can be inserted call _ swith inputs 32 It the left arrowhead 1s used to remove the last input slot the with inputs disappears also The right arrowhead can be clicked as many times as needed for the number of inputs required by the reporter block being called If the number of inputs given to call not counting the Reporter type input that comes first 1s the same as the number of empty input slots then the empty slots are filled from left to right with the given input values If call is given exactly one input then every empty input slot of the called block is filled with the same value call x amp D with inputs If the number of inputs provided is neither one nor the number of empty slots then there 1s no automatic filling Cae of empty slots Instead you must use
63. k block 42 association list 44 associative function 26 B Ball Michael 3 base case 20 binary tree 23 block 5 command 5 hat 5 predicate 10 reporter 8 Block Editor 18 19 27 block library 60 block picture option 68 block shapes 17 28 blocks color of 17 Boole George 10 Boolean 10 Boolean unevaluated type 39 break command 55 breakpoint 64 broadcast and wait block 7 Browser button 58 Build Your Own Blocks 17 C call block 32 35 call w continuation block 53 Cancel button 72 74 cascade 60 catch 55 Chandra Kartik 3 Change password 61 child class 43 Church Alonzo 7 class 41 clean up option 68 clear button 72 clicking on a script 67 Clicking sound 63 clone of block 45 Cloud button 58 cloud icon 61 Codification support 64 color of blocks 17 color palette 71 combine block 26 command block 5 comment box 68 compose 60 constant functions 39 context menu for the palette background 66 context menus for palette blocks 65 continuation 49 continuation passing style 50 Control palette 5 controls in the Costumes tab 70 controls in the Sounds tab 72 controls on the stage 72 costume 5 6 Costumes tab 7 70 counter class 41 CPS 52 crossproduct 37 C shaped block 5 34 C shaped slot 39 current 48 current date or time 48 current sprite 66 custom block in a
64. kes it harder to add an input to a custom block you have to hover the mouse where the plus sign would have been until a single plus sign appears temporarily for you to click on It s intended for people making pictures of scripts in the block editor for use in documentation such as this manual You probably won t need it otherwise Input sliders provides an alternate way to put values in numeric input slots if you click in such a slot a slider appears that you can control with the mouse move 0 steps The range of the slider will be from 25 less than the input s current value to 25 more than the current value If you want to make a bigger change than that you can slide the slider all the way to either end then click on the input slot again getting a new slider with a new center point But you won t want to use this technique to change the input value from 10 to 1000 and it doesn t work at all for non integer input ranges This feature was implemented because software keyboard input on phones and tablets didn t work at all in the beginning and still doesn t on Android devices so sliders provide a workaround It has since found another use in 62 providing lively response to input changes if Input sliders is checked reopening the settings menu will show an additional option called Execute on slider change If this option is also checked then changing a slider in the scripting area automatically runs the script
65. let alone all sprites that are on the left half of the stage nght now Input variants We now turn to the three mutually exclusive options that come below the type array The Single input option In Scratch all inputs are in this category There is one input slot in the block as it appears in its palette Ifa single input is of type Any Number or Text then you can specify a default value that will be shown in that slot in the palette like the 10 in the move 10 steps block In the prototype block at the top of the script in the Block editor an input with name size and default value 10 looks like this _ square size 10 The Multiple inputs option The list block introduced earlier accepts any number of inputs to specify the items of the new list To allow this Snap introduces the arrowhead notation 4 gt that expands and contracts the block adding and removing input slots Custom blocks made by the Snap user have that capability too If you choose the Multiple inputs button then arrowheads will appear after the input slot in the block More or fewer slots as few as zero may be used When the block runs all of the values in all of the slots for this input name are collected into a list and the value of the input as seen inside the script 1s that list of values inputs Ail gt The ellipsis in the orange input slot name box in the prototype indicates a Multi
66. lity of one web site to initiate communication with another site There is an official workaround for this limitation called the CORS protocol Cross Origin Resource Sharing but the target site has to allow snap berkeley edu explicitly and of course most don t To get around this problem you can use third party sites that are not limited by Javascript and that forward your requests An example is corsproxy com it works this way cors http URL le lele 1144 PM Meee el WWW COPSDIOXy CONV Sariin B Hardware Devices Another Javascript security restriction prevents Snap from having direct access to devices connected to your computer such as sensors and robots Mobile devices such as smartphones may also have useful devices built in such as accelerometers and GPS receivers The http block is also used to interface Snap with these external capabilities The idea is that you run a separate program that both interfaces with the device and provides a local HTTP server that Snap can use to make requests to the device Unlike Snap itself these programs have access to anything on your computer so you have to trust the author of the software Our web site snap berkeley edu provides links to drivers for several devices including at this writing the Lego NXT Finch Hummingbird and Parallax S2 robots the Nintendo Wiimote and Leap Motion sensors and the Arduino microcomputer The same server technique can be used for access
67. ll counter2 for 2 secs think call counter2 lm 2 ETIT say call counterl le 2 ETIT i This example will repay careful study because it isn t obvious why each instance has a separate count From the point of view of the make a counter procedure each invocation causes a new count variable to be created Usually such script variables are temporary going out of existence when the script ends But this one is special because make a counter returns another script that makes reference to the count variable so it remains active The script variables block makes variables local to a script It can be used in a sprite s script area or in the Block Editor Script variables can be exported by being used in a reported procedure as here In this approach to OOP we are representing both classes and instances as procedures The make a counter block represents the class while each instance 1s represented by a nameless script created each time make a counter is called The script variables created inside the make a counter block but outside the ring are instance variables belonging to a particular counter 4 B Messages and Dispatch Procedures In the simplified class above there is only one method and so there are no messages you Just call the instance to carry out its one method Here is a more refined version that uses message passing make a counter script variables count set count to J i message next change re
68. ll itself recursively causing an infinite loop We need our if then else block to be able to select only one of the two alternatives to be evaluated We have a mechanism to allow that declare the then and else inputs to be of type Reporter rather than type Any Then when calling the block those inputs will be enclosed in a ring so that the expressions themselves rather than their values become the inputs if test then yes A aise factorial if test report report TA ei j Ta value etse report value cali no In this version the program works with no infinite loop But we ve paid a heavy price this reporter if is no longer as intuitively obvious as the Scratch command if You have to know about procedures as data about rings and about a trick to get a constant value in a ringed slot The id block implements the identity function which reports its input We need it because rings only take reporters as input not numbers What we d like is a reporter if that behaves like this one delaying the evaluation of its inputs but looks like our first version which was easy to use except that it didn t work Such blocks are indeed possible A block that seems to take a simple expression as input but delays the evaluation of that input by wrapping an invisible ring around it and 1f necessary an id like transformation of constant data into constant functions 1s called a special form To turn our if block i
69. m to make a tree of size 70 depth 5 and later hires Theo to make another tree of size 70 depth 5 Tom in turn hires Tammy and Tallulah and so on Each little person has his or her own local variables size and depth each with different values factorial n 120 Cum You can also write recursive reporters like this block to compute the factorial function Note the use of the report block When a reporter block uses this block the reporter finishes its work and reports the value given any further blocks in the script are not evaluated Thus the if else block in the script above could have been just an if with the second report block below it instead of inside it and the result would be the same because when the first report is seen in the base case that finishes the block invocation and the 20 second report is ignored There is also a stop block block that has a similar purpose ending the block invocation early for command blocks By contrast the stop script block stops not only the current block invocation but also the entire toplevel script that called it Here s a shghtly more compact way to write the factorial function factorial n report A n 0 If you don t see the reporter if block in the Control palette click the file button D in the tool bar and choose Import tools For more on recursion see Thinking Recurswely by Eric Roberts Ihe original edition is ISBN 978 0471816522 a
70. mment and its help display Block Editor first word of i b first word of sentence Takes a text string as input divides it into words 2 treating one or more spaces as a word separator script variables index first only spaces count punctuation ts pan of the Takes a text string as input divides it into words J word and reports a text string containing only the treating one or more spaces as a word separator warp first word with no spaces before or after it PA only spaces count punctuation is part of the to E word and reports a text string containing only the to i first word with no spaces before or after it kaS port ECE wees Ei emoty ECTS Eo OK J Apply Cancel J The same comment is also shown while hovering over the custom block in the palette The delete block definition option asks for confirmation then deletes the custom block and removes it from any scripts in which it appears The result of this removal may not leave a sensible script it s best to find and correct such scripts before deleting a block Note that there is no option to ide a custom block The edit option opens a Block Editor with the definition of the custom block Context Menu for the Palette Background Right click control click on the grey background of the palette area shows this menu hide primitives show primitives The hide primitives option hides all of the primitives in that palette The show prim
71. n unevaluated so that Scratch can evaluate them over and over again Since Scratch doesn t have custom blocks 1t can afford to handwave away the distinction between evaluated and unevaluated Booleans but Snap can t The pedagogic value of special forms is proven by the fact that no Scratcher ever notices that there s anything strange about the way in which the hexagonal inputs in the Control blocks are evaluated Also the C shaped slot familiar to Scratch users is an unevaluated procedure type you don t have to use a ring to keep the commands in the C slot from being run before the C shaped block is run hose commands themselves not the result of running them are the input to the C shaped Control block This is taken for granted by Scratch users especially because Commands don t report values so it wouldn t make sense to think of putting commands in the C shaped slot as a composition of functions This is why it makes sense that C shaped is on the fourth row of types in the long form input dialog with other unevaluated types 39 VII Object Oriented Programming Object oriented programming is a style based around the abstraction object a collection of data and methods procedures which from our point of view are just more data that you interact with by sending it a message just a name maybe in the form of a text string and perhaps additional inputs The object responds to the message by carryi
72. n 6 nonlocal exit 55 Number type 28 O object oriented programming 40 Object type 28 objects building explicitly 41 Open option 58 orange oval 11 outlined ellipse tool 71 outlined rectangle tool 71 oval blocks 17 28 P paint brush icon 70 Paint Editor 70 Paint Editor window 71 paintbrush tool 71 palette 5 palette area 65 palette background 66 parallelism 6 parent class 43 parts of nested sprite 8 pause block 64 pause button 64 physical devices 47 pic option 73 Plain prototype labels 62 Predicate block 10 Prefer smooth animations 63 presentation mode button 64 primitive block within a script 67 procedure 10 33 project control buttons 64 Project notes option 58 prototype 18 prototyping 43 pulldown inputs 29 R rectangle tool 71 recursion 20 recursive call 35 recursive operator 38 red halo 35 67 Reference manual option 538 relabel option 67 remove duplicates from 60 rename option 71 repeat block 5 34 repeat blocks 60 repeat until block 10 report block 20 Reporter block 8 reporter if block 10 reporters recursive 20 Reset Password 61 reverse 60 Reynolds Ian 3 ring 33 35 ringify 33 68 Roberts Eric 21 robots 47 rotation 66 rotation point tool 71 72 run 35 run w continuation 55 S Save as option 59 Save option 59 Sch
73. n ACtion p change by 1 This is simplified because it assumes without checking that the ending value is greater than the starting value if not the block should depending on the designer s purposes either not run at all or change the variable by 1 instead of by 1 The for block in Snap s tool library works for ascending or descending values you can read its script by right clicking or control clicking on it and selecting the Edit option The important part of this script is the run block near the end This is a Snap built in command block that takes a Command type value a script as its input and carries out its instructions In this example the value of the input GED i the script that the user puts in the C slot of the for block There is a similar call reporter block for invoking a Reporter or Predicate block Uhe call and run blocks are at the heart of Snaps first class procedure feature they allow scripts and blocks to be used as data in this example as an input to a block and eventually carried out under control of the user s program Here s another example this time using a Reporter type input in a simplified map block see page 22 map function A over data if empty data report call function withinputs item E of data in front of report map phi hE over Bhi ails ae eee Here we are calling the Reporter multiply by 10 three times once with each item of the g
74. n of factorial is more interesting It doesn t just call our original factorial reporter and send the result to its continuation CPS is used inside factorial too It says See if my input is zero Send the true or false result to if If the result is true then call my continuation with the value 1 Otherwise subtract 1 from my input Send the result of that to a recursive call to factorial with a continuation that multiplies the smaller number s factorial by my original input Finally call my continuation with the product You can use CPS to unwind even the most complicated branched recursions By the way I cheated a bit above The if else block should also use CPS it should take one true false input and two continuations It will go to one or the other continuation depending on the value of its input But in fact the C shaped blocks or E shaped like if else are really using CPS in the first place because they implicitly wrap rings around the sub scripts within their branches See if you can make an explicitly CPS if else block 92 B Call Run w Continuation To use explicit continuation passing style we had to define special versions of all the reporters add and so on Snap provides a primitive mechanism for capturing continuations when we need to without using continuation passing throughout a project Here s the classic example We want to write a recursive block that takes a list of numbers as input and rep
75. n someone else s Snap project without worrying that it will delete all your files or infect your computer with a virus But it does make things a little complicated Localstore Find the File icon QQ in the Tool Bar In the menu that appears when you click it choose the option Save as You ll then see a window like this Save Project Tree animal game 5 nET count change SANANE Tri x is AA bn Browser eae Rh SA iF Save Cancel LA l The Browser option 1s selected which means that your project will be saved in a special file that can be read only on the same computer by the same browser connected to the same Snap web page You won t see it in a listing of your files outside of Snap This is how Javascript protects you against malware in saved projects In the picture above the narrow space at the top 1s where you enter the name with which you want to save the project Under that on the left you see a list of projects you ve already saved in the browser s storage On the right are a picture of the stage and a text box for project notes any information you d like a user of the project to know Both of these are saved with the project An important limitation of this way to save projects is that your browser will set a limit on the total amount of storage available for all web sites combined This limit may be settable in your browser s preferences So the locals
76. nd technique above also allows you to import media costumes and sounds into a project Just choose Import and then select a picture or sound file instead of an XML file Snap can also import projects created in BYOB 3 0 or in Scratch 1 4 or with some effort see our web site 2 0 Almost all such projects work correctly in Snap apart from a small number of incompatible blocks BYOB 3 1 projects that don t use first class sprites work too all BYOB 3 1 projects will work in Snap 4 1 16 HI Building a Block The first version of Snap was called BYOB for Build Your Own Blocks This was the first and 1s still the most important capability we added to Scratch he name was changed because a few teachers have no sense of humor You pick your battles The new Scratch 2 0 also has a partial custom block capability A Simple Blocks In the Variables palette at or near the bottom 1s a button labeled Make a block Motion Looks Sound Pen Make a variable r Only if tools loaded Clicking this button will display a dialog window in which you choose the block s name shape and palette color You also decide whether the block will be available to all sprites or only to the current sprite and its children Note You can also enter the Make a block dialog by right click control click on the script area background and then choose Make a block from the menu that appears Make a block
77. next two flip the picture around horizontally or vertically Below these are a color palette a greyscale tape and larger buttons for black white and transparent paint Below these is a solid bar displaying the currently selected color Below that is a picture of a line showing the brush width for painting and drawing and below that you can set the width either with a slider or by typing a number in pixels into the text box Finally the checkbox constrains the line tool to draw horizontally or vertically the rectangle tools to draw squares and the ellipse tools to draw circles You can get the same effect temporarily by holding down the shift key which makes a check appear in the box as long as you hold it down But the Caps Lock key doesn t affect it 71 You can correct errors with the undo button which removes the last thing you drew or the clear button which erases the entire picture Note it does not revert to what the costume looked like before you started editing it If that s what you want click the Cancel button at the bottom of the editor When you re finished editing to keep your changes click OK Note that the ellipse tools work more intuitively than ones in other software you may have used Instead of dragging between opposite corners of the rectangle circumscribing the ellipse you want so that the endpoints of your dragging have no obvious connection to the actual shape in Snap you start at the center of the ellip
78. ng out a method which may or may not report a value back to the asker Some people emphasize the data hiding aspect of OOP because each object has local variables that other objects can access only by sending request messages to the owning object while others emphasize the szmulation aspect in which each object abstractly represents something in the world and the interactions of objects in the program model real interactions of real people or things Data hiding is important for large multi programmer industrial projects but for Snap users it s the simulation aspect that s important Our approach is therefore less restrictive than that of some other OOP languages Technically object oriented programming rests on three legs 1 Message passing There is a notation by which any object can send a message to another object 2 Local state Each object can remember the important past history of the computation it has performed Important means that it need not remember every message it has handled but only the lasting effects of those messages that will affect later computation 3 nhentance It would be impractical if each individual object had to contain methods many of them identical to those of other objects for all of the messages it can accept Instead we need a way to say that this new object is just like that old object except for a few differences so that only those differences need be programmed explicitly T
79. nt It s possible to mix styles in the same program but if the same list 1s used both ways the program will run more slowly because it converts from one representation to the other repeatedly The item of block doesn t change the representation You don t have to know the details of the internal representations but it s worthwhile to use each list in a consistent way D Higher Order List Operations and Rings There s an even easier way to select the even numbers from a list Ce EE mod 2 Bao from list 9 o If you don t have the keep block near the bottom of the Variable palette click the File button in the tool bar and select Import tools The keep block takes a Predicate expression as its first input and a list as its second input It reports a list containing those elements of the input list for which the predicate returns true Notice two things about the predicate input First it has a grey ring around it Second the mod block has an empty input Keep puts each item of its input list one at a time into that empty input before evaluating the predicate Ihe empty input is supposed to remind you of the box notation for variables in elementary school 0 3 7 The grey ring is part of the keep block as it appears in the palette keep items such that What the ring means 1s that this input 1s a block a predicate block in this case because the interior of the ring 1s a hexagon
80. nto a special form we edit the block s prototype declaring the inputs yes and no to be of type Any unevaluated instead of type Reporter The script for the block is still that of the second version including the use of call to evaluate either yes or no but not both But the slots appear as white Any type rectangles not Reporter type rings and the factorial block will look like our first attempt In a special form s prototype the unevaluated input slot s are indicated by a lambda A next to the input name just as if they were declared as Procedure type They are Procedure type really they re just disguised to the user of the block Special forms trade off implementor sophistication for user sophistication That is you have to understand all about procedures as data to make sense of the special form implementation of if then else But any experienced Scratch programmer can use if then else without thinking at all about how it works internally Special Forms in Scratch Special forms are actually not a new invention in Snap Many of Scratch s conditional and looping blocks are really special forms The hexagonal input slot in the if block is a straightforward Boolean value because the value can be computed once before the if block makes its decision about whether or not to run its action input But the forever if repeat until and wait until blocks inputs can t be Booleans they have to be of type Boolea
81. od delete var delete method and clone It has one predefined variable parent Objects without a parent are created by calling new object new object report cione of list 45 As before we provide procedures to call an object s dispatch procedure and then call the method But in this version we provide the desired object as the first method input We provide one procedure for Command methods and one for Reporter methods ask object A message args tell object A message args E call object with inputs message Call os with inputs 0 report object in front of args input list object in front of args Remember that the Input list variant of the run and call blocks is made by dragging the input expression over the arrowheads rather than over the input slot The script below demonstrates how this prototyping system can be used to make counters We start with one prototype counter called counter1 We count this counter up a few times then create a child counter2 and give it its own count variable but not its own total variable The next method always sets counter1 s total variable which therefore keeps count of the total number of times that any counter 1s incremented Running this script should Say and think the following lists 1 1 2 2 3 3 44 15 26 37 58 69 7 10 811 set counter to new object tell counter1 count f0 tell counter1 total f0 tell counter1 Oset BCOUN
82. og will then change to look like this Create input name a OK Cancel The important part to notice 1s the arrowhead that has appeared at the nght end of the text box Click it to see this menu Choose one of the symbols The result will look kind of ugly in the prototype E square gt pointRight t gears i file x fullScreen normalScreen translate this arrowRightOutline that but the actual block will have the symbol you want The available symbols are pretty much the ones that are used in Snap icons 5 gt turtleOutline JI pause But Pd like the arrow symbol bigger and yellow so I edit its name Edit label fragment OK J Delete Cancel speechBubbleOutline i i arrowUp This says to make the symbol 1 5 times as big as the letters n the block text using a color lt gt arrowUpOutline with red green blue values of 255 255 150 each between 0 and 255 Here s the result lt gt arrowDownOutline gt arrowRight translate E a a arrowRightOutline w robot JA VI Procedures as Data A Call and Run In the for block example above the input named action has been declared as type Command C shaped that s why the finished block 1s C shaped But how does the block actually tell Snap to carry out the commands inside the C slot Here is a simple version of the block script 10 action A set i SRGEE repeat until ru
83. oject Control Buttons Above the right edge of the stage are three buttons that control the running of the project Technically the green flag is no more a project control than anything else that can trigger a hat block typing on the keyboard or clicking on a sprite But it s a convention that clicking the flag should start the action of the project from the beginning It s only a convention some projects have no flag controlled scripts at all but respond to keyboard controls instead Shift clicking the button enters Turbo mode and the button then looks like a lightning bolt Shift clicking again turns Turbo mode off Scripts can simulate clicking the green flag by broadcasting the special message __shout__go__ two underscores in each of the three positions shown The pause button suspends running all scripts If clicked while scripts are running the button changes shape to become a play button Clicking it while in this form resumes the suspended scripts There is also a pause block in the Control palette that can be inserted in a script to suspend all scripts this provides the essence of a breakpoint debugging capability The stop button stops all scripts like the stop all block It does not prevent a script from starting again in response to a click or keystroke the user interface 1s always active 64 B The Palette Area At the top of the palette area are the eight buttons that select which palette which block
84. on case of dropping a block somewhere other than where you meant it to go It reattaches the dropped block or script to the mouse like duplicating a block and restores the former contents of the slot into which you dropped it You can then reposition the mouse to put the block where you meant it to go The scripts pic option opens a new browser tab with a picture of all scripts in the scripting area just as they appear but without the grey striped background Note that all scripts in the scripting area means just the top level scripts of the current sprite not other sprites scripts or custom block definitions Finally the make a block option does the same thing as the Make a block button in the Variables palette It s a shortcut so that you don t have to keep switching to Variables 1f you make a lot of blocks 69 Controls in the Costumes Tab If you click on the word Costumes under the sprite controls you ll see something like this Scripts Costumes Sounds The Turtle costume is always present in every sprite 1t is costume number 0 Other costumes can be painted within Snap or imported from files or other browser tabs 1f your browser supports that Clicking on a costume selects it that is the sprite will look like the selected costume Clicking on the paint brush icon opens the Pant Editor in which you can create a new costume Control clicking right clicking on the turtle picture gives this men
85. ons Flat line ends Codification support The Language option lets you see the Snap user interface blocks and messages in a language other than English Note Translations have been provided by Snap users If your native language is missing send us an email The Zoom blocks option lets you change the size of blocks both in the palettes and in scripts The standard size is 1 0 units The main purpose of this option is to let you take very high resolution pictures of scripts for use on posters It can also be used to improve readability when projecting onto a screen while lecturing but bear in mind that it doesn t make the palette or script areas any wider so your computer s command option feature may be more practical Note that a zoom of 2 1s gigantic Don t even try 10 The remaining options let you turn various features on and off Long form input dialog if checked means that whenever a custom block input name 1s created or edited you immediately see the version of the input name dialog that includes the type options default value setting etc instead of the short form with just the name and the choice between input name and title text The default unchecked setting 1s definitely best for beginners but more experienced Snap programmers may find 1t more convenient always to see the long form Plain prototype labels eliminates the plus signs between words in the Block Editor prototype block This ma
86. orts the product of all the numbers product list if empty ist f report 1 report item I of list lt x product But we can improve the efficiency of this block in the case of a list that includes a zero as soon as we see the zero we know that the entire product is zero product list if empty list eport 7 ean Clom vee o report o report item 1 v of Hist x product But this is not as efficient as it might seem Consider as an example the list 1 2 3 0 4 5 We find the zero on the third recursive call the fourth call altogether as the first item of the sublist 0 4 5 What is the continuation of the report 0 block It s Tian EA 2 XE 3 Meme i input names result Even though we already know that result 1s zero we re going to do three unnecessary multiplications while unwinding the recursive calls We can improve upon this by capturing the continuation of the top level call to product product list report product helper list product continuation product helper lst pr call input names product continuation empty ist FP Pe pen pny if pry w continuation Te Pore g TER COE 1 of list run with inputs report item E of list product helper f rs cont 53 eae 2 block takes as its input a one input script as shown in the product example It calls that script with the continuation of the call with continuation block itself as it
87. pe only one selector is shown but the ones for left and right children are analogous a a 00 ts et o ee Oo aa binary tree datum datum left child left right child right lt ipommicgas Dinary treo SELT left right bt datum tree f is tree a ist if RTTE vee a Dinary tree TEE 2 Vail a ATAS COE I ee isn tadinarytrea b stop script else ee CLEN I C mish taDinarytree 23 C Functional and Imperative List Programming There are two ways to create a list inside a program Scratch users will be familiar with the imperatwe programming style which is based on a set of command blocks that modify a list add GP to z ACG wee S igting ia 1 viniz OERE va m ueining As an example here is a block that takes a list of numbers as input and reports a new list containing only the even numbers from the original list evens data script variables result asu to liist for index Bto length of data item index of data mod 2 o add REM index s data to result report result In this script we first create a temporary variable then put an empty list in it then go through the items of the input list using the add to result block to modify the result list adding one item at a time and finally report the result Functional programming is a different approach that is becoming important in real world programming because of parallelism 1 e
88. pen Wea AS square set pen color to change pen color by P Block Editor square pen down repeat 4 UCICE 100 KIGE TA 90 ECE OK Apply Cancel gt Your block appears at the bottom of the Motion palette Here s the block and the result of using it if on edge bounce x position E y position E direction square l This use of the word prototype is unrelated to the prototyping object oriented programming discussed later 18 Custom Blocks with Inputs But suppose you want to be able to draw squares of different sizes Control click or right click on the block choose edit and the Block Editor will open Notice the plus signs before and after the word square in the prototype block If you hover the mouse over one it lights up Block Editor poneret pen down TEELE 4 UOCE 100 Mice MaA 90 Metis tt OK Apply Cancel Cancel Type in the name size and click OK There are other options in this dialog you can choose title text if you want to add words to the block name so it can have text after an input slot like the move steps block Or you can select a more extensive dialog with a lot of options about your input name But we ll leave that for later When you click OK the new input appears in the block prototype square size pen down EPEE 4 CICE 100 WIGTE S turn amp 0 degrees You can now drag the orange variable down
89. ple input report all The third category Upvar make internal variable visible to caller isn t really an input at all but rather a sort of output from the block to its user It appears as an orange variable oval in the block rather than as an input slot Here s an example the uparrow t in the prototype indicates this kind of internal variable name iin 1 ETE 10 end 10 action A 30 The variable i in the block on the right above can be dragged from the for block into the blocks used in its C shaped command slot Also by clicking on the orange i the user can change the name of the variable as seen in the calling script although the name hasn t changed inside the block s definition This kind of variable is called an upvar for short because it is passed upward from the custom block to the script that uses it Prototype Hints We have noted three notations that can appear in an input slot in the prototype to remind you of what kind of input this is Here is the complete list of such notations default value multiple inputs 7 upvar procedure types list Boolean Title Text and Symbols Some primitive blocks have symbols as part of the block name Custom blocks can use symbols too In the Block Editor click the plus sign in the prototype at the point where you want to insert the symbol Then click the title text picture below the text box that s expecting an input slot name The dial
90. port count report f message OS set ini to input names value report count input names message Again the make a counter block represents the counter class and again the script creates a local variable count each time it is invoked The large outer ring represents an instance It is a dispatch procedure it takes a message just a text word as input and it reports a method The two smaller rings are the methods The top one is the next method the bottom one is the reset method The latter requires an input named value In the earlier version calling the instance did the entire job In this version calling the instance gives access to a method which must then be called to finish the job We can provide a block to do both procedure calls in one ask object A message args report Cal call object withinputs message The ask block has two required inputs an object and a message It also accepts optional additional inputs which Snap puts in a list that list is named args inside the block Ask has two nested call blocks The inner one calls the object 1 e the dispatch procedure The dispatch procedure always takes exactly one input namely the message It reports a method which may take any number of inputs note that this 1s the situation in which we drop a list of values onto the arrowheads of a multiple input in the outer call block Note also that this is one of the rare cases in which we mus
91. prite s direction 1s roughly leftward direction between 180 and 359 or equivalently between 180 and 1 If the bottom button 1s selected the costume s orientation does not change regardless of the sprite s direction The sprite s name can be changed in the text box that in this picture says Sprite Finally if the draggable checkbox is checked then the user can move the sprite on the stage by clicking and dragging it The common use of this feature is in game projects in which some sprites are meant to be under the player s control but others are not 66 Scripting Area Tabs Just below the sprite controls are three tabs that determine what is shown in the scripting area Scripts Costumes Sounds Scripts and Blocks Within Scripts Most of what s described in this section also applies to blocks and scripts in a Block Editor Clicking on a script which includes a single unattached block runs it If the script starts with a hat block clicking on the script runs it even if the event in the hat block doesn t happen This is a useful debugging technique when you have a dozen sprites and they each have five scripts with green flag hat blocks and you want to know what a single one of those scripts does The script will have a green halo around it while it s running Clicking a script with such a halo stops the script If the script includes a warp block which might be inside a custom block used in the scri
92. project name xml1 so that Snap will recognize it as a project when you later drag it onto a Snap window This is an alternative to saving the project to your cloud account keeping 1t on your own computer 59 The Export blocks option is used to create a block library It presents a list of all the global for all sprites blocks in your project and lets you select which to export It then opens a browser tab with those blocks in XML format as with the Export project option Block libraries can be imported with the Import option or by dragging the file onto the Snap window The Import tools option imports a library of useful tool blocks that you should think of as Snap primitive blocks even though they are actually written in Snap This manual assumes that the tools library has been imported especially in the explanation of lists The Libraries option presents a menu of useful optional block libraries Import library Iteration composition List utilities Streams lazy lists Variadic reporters Words sentences The libraries and their contents may change but as of this writing the iteration library has these blocks cascade tines So The cascade blocks take an initial value and call a function repeatedly on that value cascade until lt gt gt compose z5 P SIN repeat The compose block takes two functions and reports the function g x until eum The first three repeat blocks are vari
93. pt then Snap may not respond immediately to clicks Hold the mouse button down until it works If a script is shown with a red halo that means that an error was caught in that script such as using a list where a number was needed or vice versa Clicking the script will turn off the halo Control click right clicking a primitive block within a script shows a menu like this one help relabel duplicate delete script pic The help option shows the help screen for the block just as in the palette he other options appear only when a block is right clicked control clicked in the scripting area Not every primitive block has a relabel option When present it allows the block to be replaced by another similar block keeping the input expressions in place For example here s what happens when you choose relabel for an arithmetic operator Note that the inputs to the existing block are displayed in the menu of alternatives also Click a block in the menu to choose it or click outside the menu to keep the original block The duplicate option makes a copy of the entire script starting from the selected block The copy is attached to the mouse and you can drag it to another script or even to another Block Editor window even though you are no longer holding down the mouse button Click the mouse to drop the script copy 67 The block picture underneath the word duplicate is another duplication o
94. ption but it duplicates only the selected block not everything under it in the script Note that if the selected block is a C shaped control block the script inside its C shaped slot 1s included If the block 1s at the end of its script this option does not appear The delete option deletes the selected block from the script The script pic option opens a new browser tab containing a picture of the entire script not just from the selected block to the end You can use the browser s Save feature to put the picture in a file This is a super useful feature if you happen to be writing a Snap manual If the script does not start with a hat block or you clicked on a reporter then there s one more option ringify or if there 1s already a grey ring around the block or script unringify Ringify surrounds the block reporter or the entire script command with a grey ring meaning that the block s inside the ring are themselves data as an input to a higher order procedure rather than something to be evaluated within the script See Section VI Procedures as Data Clicking a custom block in a script gives a similar but different menu help duplicate C delete script pic delete block definition edit There is no relabel option for custom blocks The two options at the bottom for custom blocks only are the same as 1n the palette Scripting Area Background Context Menu Control click shi
95. r so that you can make your own costume for it Of course you could click the first button and then click the paint button in its costumes tab this paint button is a shortcut for all that In the sprite corral you click on a sprite s thumbnail picture to select that sprite to make it the one whose scripts costumes etc are shown in the scripting area You can drag sprite thumbnails but not the stage one to reorder them this has no special effect on your project but lets you put related ones next to each other for example You can right click control click a sprite s thumbnail to get this context menu show duplicate delete export The show option makes the sprite visible 1f it was hidden and also brings it onto the stage if it had moved past the stage boundary The other three options are the same as in the context menu of the actual sprite on the stage discussed above The context menu for the stage thumbnail has only one option pic which takes a picture of everything on the stage just like the same option in the context menu of the stage background 73 Index variable 60 A Abelson Hal 3 About option 57 add comment option 68 AGPL 57 all but first of block 25 Alonzo 7 anchor 8 animation 10 anonymous list 22 Any unevaluated type 39 Any type 28 append 60 arithmetic 9 array dynamic 25 arrow upward pointing 30 arrowheads 22 30 as
96. rather than the value reported by that block Here s the difference lt 25 Evaluating the block without a ring reports true or false evaluating the block with a ring reports the block itself This allows keep to evaluate the predicate repeatedly once for each list item A block that takes another block as input is called a gher order block or higher order procedure or higher order function Snap provides three higher order blocks for operating on lists keep items such that from H combine with items of H You ve already seen keep Map takes a Reporter block and a list as inputs It reports a new list in which each item is the value reported by the Reporter block as applied to one item from the input list That s a mouthful but an example will make its meaning clear EB By the way we ve been using arithmetic examples but the list items can be of any type and any reporter can be used We ll make the plurals of some words Tcomputers f eT RG CCN fs MB EA fst book computer pagel These examples use small lists to fit the page but the higher order blocks work for any size list The map block has arrowheads at the right end because of a little used feature that allows mapping through multiple same length lists in parallel with a multi input reporter expression Don t worry about it for now just make sure when you drag an expression into the list input slot that yo
97. rocedure types gt J pannel im aoe C shape funevaluated unevaluated singe input oorun vane muttipie inputs value is list of inputs vpvar make internal variable visible to caller OK Cancel The second row of input types contains the ones found in Scratch Number Any and Boolean The reason these are in the second row rather than the first will become clear when we look at the column arrangement The first row contains the new Snap types other than procedures Object Text and List The last two rows are the types related to procedures discussed more fully below The List type is used for first class lists discussed in Section IV above The red rectangles inside the input slot are meant to resemble the appearance of lists as Snap displays them on the stage each element in a red rectangle The Object type is reserved for first class sprites coming in Snap 4 1 The Text type is really just a variant form of the Any type using a shape that suggests a text input Procedure Types Although the procedure types are discussed more fully later they are the key to understanding the column arrangement in the input types Like Scratch Snap has three block shapes jigsaw piece for command blocks oval for reporters and hexagonal for predicates A predicate is a reporter that always reports true or false In Snap these blocks are first class data an input to a block can be of Command typ
98. rtain computations more efficient and also allows the tall of stream H creation of lists with infinitely many items such as a list of all the positive DETA O over stream amp See eE integers The first five blocks are stream versions of the list blocks in front of sow stress AGED item 1 of all but first of map and keep Show stream takes a stream and a TACE number as inputs and reports an ordinary list of the first n items of the stream Finally sieve is an example block that takes as input the stream of integers starting with 2 and reports the stream of all the prime numbers 60 The variadic library has these blocks sum These are versions of the associative operators x and and or that take any number of inputs EER a instead of exactly two inputs As with any variadic input you can also drop a list of values onto annem the arrowheads instead of providing the inputs one at a time The word and sentence library has these blocks em hese blocks make it more convenient to think of a text string either as a word made of all but first word of Hi eee letters or as a sentence made of words rather than of individual characters Each word of a SS 6sentence is a string of characters not including a space That is the sentence related blocks a split the string up at space characters Any number of consecutive spaces counts as a single last word of Il separator The names should be self explan
99. s C Formal Parameters The rings around Procedure type inputs have an arrowhead at the right Clicking the arrowhead allows you to give the inputs to a block or script explicit names instead of using empty input slots as we ve done until now 1 o inputnames 1 foo 3 inputnames foo 2 1 input names 1 2 The names 1 2 etc are provided by default but you can change a name by clicking on its orange oval in the input names list Be careful not to drag the oval when clicking that s how you use the input inside the ring The names of the input variables are called the formal parameters of the encapsulated procedure Here s a simple but contrived example using explicit names to control which input goes where inside the ring call join 1 2 1 input names 1 2 with Inputs J Here we just want to put one of the inputs into two different slots If we left all three slots empty Snap would not fill any of them because the number of inputs provided 2 would not match the number of empty slots 3 36 Here is a more realistic much more advanced example crossproduct ists report S LETA Sa LJ over tem i v of lists to crossproduct input list DU oii eof ists combine with append B amp items of Saya map newltem in front of H over small f report map o input names ii newitem item 4E of lists ETE aa lista fy isti 12 f3 This is the de
100. s input In this case that continuation 1s report result input names result reporting to whichever script called product If the input list doesn t include a zero then nothing is ever done with that continuation and this version works just like the original product But if the input list is 1 2 3 0 4 9 then three recursive calls are made the zero is seen and product helper runs the continuation with an input of 0 The continuation immediately reports that 0 to the caller of product without unwinding all the recursive calls and without the unnecessary multiplications I could have written product a little more simply using a Reporter ring instead of a Command ring product list report product heiper list product continuation input names product continuation but it s customary to use a script to represent the input to call w continuation because very often that input takes the form s st gigi Continuation input names continuation ort OOOO so that the continuation is saved permanently and can be called from anywhere in the project That s why the input slot in call w continuation has a Command ring rather than a Reporter ring First class continuations are an experimental feature in Snap and there are many known limitations in it 54 Nonlocal exit Many programming languages have a break command that can be used inside a looping construct such as repeat to end the repetition earl
101. se you want and drag out to the edge When you let go of the button the mouse cursor will be on the curve If you drag out from the center at 45 degrees to the axes the resulting curve will be a circle if you drag more horizontally or vertically the ellipse will be more eccentric Of course 1f you want an exact circle you can hold down the shift key or check the checkbox The rectangle tools though work the way you expect You start at one corner of the desired rectangle and drag to the opposite corner Using the eyedropper tool you can click anywhere in the Snap window even outside the Paint Editor and the tool will select the color at the mouse cursor for use in the Paint Editor You can only do this once because the Paint Editor automatically selects the paintbrush when you choose a color Of course you can click on the eyedropper tool button again The only other non obvious tool is the rotation point tool It shows in the Paint Editor where the sprite s current rotation center is the point around which it turns when you use a turn block 1f you click or drag in the picture the rotation point will move where you click You d want to do this for example 1f you want a character to be able to wave its arm so you use two sprites connected together You want the rotation point of the arm sprite to be at the end where it joins the body so it remains attached to the shoulder while waving Controls in the Sounds Tab There is
102. sual Downloads folder You can then close that tab and return to the Snap tab B Cloud Storage The other possibility 1s to save your project in the cloud at the Snap web site In order to do this you need an account with us Click on the Cloud button in the Tool Bar Choose the Signup option This will show you a window that looks like this User name r Binh date year v v E mail address r Terms of Service Privacy have read and agree to the Terms of Service OK I Cancel You must choose a user name that will identify you on the web site such as Jens or bh If you re a Scratch user you can use your Scratch name for Snap too If you re a kid don t pick a user name that includes your family name but first names or initials are okay Don t pick something you d be embarrassed to have other users or your parents see Ifthe name you want is already taken you ll have to choose another one We ask for your month and year of birth we use this information only to decide whether to ask for your own email address or your parent s email address If you re a kid you shouldn t sign up for anything on the net not even Snap without your parent s knowledge We do not store your birthdate information on our server it 1s used on your own computer only during this initial signup We do not ask for your exact birthdate even for this one time purpose becaus
103. sumably you d do that because you intend to edit one of the copies Delete is obvious The export option opens a new browser tab with a picture of the costume You can then save it to a file or select a different sprite in the Snap tab return to the picture tab and drag the costume onto the Snap tab to copy the costume to another sprite You can drag costumes up and down in the Costumes tab in order to renumber them so that next costume will behave as you prefer The Paint Editor Here is a picture of a Paint Editor window Paint Editor Z DIO a NOOK Brush size 5 Oo Constrain proportions of shapes you can also hold shift OK Cancel If you ve used any painting program most of this will be familiar to you Currently only bitmap costumes jpg png etc can be edited not vector costumes svg etc Unlike the case of the Block Editor only one Paint Editor window can be open at a time The ten square buttons in two rows of five near the top left of the window are the tools The top row from left to right are the paintbrush tool the outlined rectangle tool the outlined ellipse tool the eraser tool and the rotation point tool The bottom row tools are the line drawing tool the solid rectangle tool the solid ellipse tool the floodfill tool and the eyedropper tool Below the tools is a row of four buttons that immediately change the picture The first two change its overall size the
104. t box in Snap itself This work was supported in part by the National Science Foundation grant 1143566 and in part by MioSoft Snap Reference Manual Version 4 0 Snap formerly BYOB is an extended reimplementation of Scratch http scratch mit edu that allows you to Build Your Own Blocks It also features first class lists first class procedures and continuations These added capabilities make it suitable for a serious introduction to computer science for high school or college students To run Snap open a browser window and connect to either http snap berkeley edu run to start with a minimal set of blocks or http snap berkeley edu init to load a small set of additional blocks a little slower startup but recommended for convenience and assumed in this manual I Blocks Scripts and Sprites This secction describes the Snap features inherited from Scratch experienced Scratch users can skip to subsection B Snap is a programming language a notation in which you can tell a computer what you want it to do Unlike most programming languages though Snap 1s a visual language instead of writing a program using the keyboard the Snap programmer uses the same drag and drop interface familiar to computer users Start Snap You should see the following arrangement of regions in the window try ES t untitled Motion Control U Looks Sensing lt draggabdie Sound Operators n Pen Vari
105. t E 2 3 4 ee lt link rel shortcut icon href http snap berkeley edu tavicon png type Fe 6 7 8 lt script type text javascript gt g 11 PELAA setAccount UA 30925559 2 15 Var ga document createElement script ga type text javascript ga async true io E ga src https documentiocation protocol https ssl http www Ig 17 Wee CE EAER U EAE em 25 Bale jenath 437 T alae Se F Anap derelay edu MET Hine v The second input to split is the character to be used to separate the text string into a list of lines or one of a set of common cases such as line which separates on carriage return and or newline characters This might be a good place for a reminder that list watchers scroll through only 100 items at a time The downarrow near the bottom right corner of the speech balloon in the picture presents a menu of hundred item ranges Ihis may seem unnecessary since the scroll bar should allow for any number of items but doing it this way makes Snap much faster There are two important restrictions on the use of the http block to examine arbitrary Web sites First it 1s limited to HTTP not the more secure HTTPS that encrypts the information sent to and from the site and so you can t use Snap for anything that requires sending passwords This 1s probably just as well 47 Second a security restriction in Javascript limits the abi
106. t if logged in or browser localstore The Save as menu option opens a dialog box in which you can specify where to save the project Save Project BYOB3 tutorial3 I know an old lady Mole Mash 4 _ Planetary Simulation Bs Tree Browser acronym animal game cloudtest count change geo icecream icecream visual intro listdemo Save Share Delete Cancel This is much like the Open dialog except for the horizontal text box at the top into which you type a name for the project You can also share unshare and delete projects from here If you are logged in the dialog starts with Cloud selected if not Browser will be selected The Import menu option is for bringing some external resource into the current project rather than loading an entirely separate project You can import costumes any picture format that your browser supports sounds again any format supported by your browser and block libraries XML format previously exported from Snaplitself Imported costumes and sounds will belong to the currently selected sprite imported blocks are global for all sprites Using the Import option is equivalent to dragging the file from your desktop onto the Snap window The Export project option opens a new browser tab containing your complete project in XML notation a plain text format You can then use the browser s Save feature to save the project as an XML file which should be named your
107. t in Reporters can t report scripts so they aren t accepted in a C shaped slot Create input name es Bye Boolean T F E Command J Reponer l J Predica finiine _ Repone edicate Command E E Any Boolean C snape unevaluated unevaluated single input detaut vaue Fl muttipic inputs value is list of inputs amp Upvar make Internal variable visible to caller Why would you ever choose an inline Command slot rather than a C shape Other than the run block discussed below the only case I can think of is something like the C C Java for loop which actually has three command script inputs and one predicate input only one of which is the featured loop body Okay now that we have procedures as inputs to our blocks how do we use them We use the blocks run for commands and call for reporters The run block s script input is an inline ring not C shaped because we anticipate that it will be rare to use a specific literal script as the input Instead the input will generally be a variable whose value is a script The run and call blocks have arrowheads at the end that can be used to open slots for inputs to the called procedures How does Snap know where to use those inputs Ifthe called procedure block or script has empty input slots Snap does the right thing This has several possible meanings 1 If the number of empty slots is exactly equal to the number o
108. t unringify the inner call block whose value when called gives the method set counteri to make a counter te TEE eee CG Sinex Gla 2 ete Y eal CG Sinex le 2 EITT 2 4 say ask counterl CE1 4 for 2 secs 4 say ask counterl fd for 2 secs E 42 C Inheritance via Delegation So our objects now have local state variables and message passing What about inheritance We can provide that capability using the technique of delegation Each instance of the child class contains an instance of the parent class and simply passes on the messages 1t doesn t want to specialize make a buzzer script variables counter set nie to make a counter report temp TTA Call eo with inputs creer input names message This script implements the buzzer class which is a child of counter Instead of having a count a number as a local state variable each buzzer has a counter an object as a local state variable The class specializes the next method reporting what the counter reports unless that result is divisible by 7 in which case it reports buzz Yeah it should also check for a digit 7 in the number but this code is complicated enough already If the message 1s anything other than next though such as reset then the buzzer simply invokes its counter s dispatch procedure So the counter handles any message that the buzzer doesn t handle explicitly Note that in the non next case we call the counter
109. than rounded buttons and monochrome blocks rather than the shaded somewhat 3D looking normal blocks The monochrome blocks are the reason for the flat in the name of this option The only thing to be said for this option is that it may blend in better with the rest of a web page when a Snap project is run in a frame in a larger page Thread safe scripts changes the way Snap responds when an event clicking the green flag say starts a script and then while the script is still running the same event happens again Ordinarily the running process stops where it is ignoring the remaining commands in the script and the entire script starts again from the top This behavior 1s inherited from Scratch and some converted Scratch projects depend on it that s why it s the default It s also sometimes the right thing especially in projects that play music in response to mouse clicks or keystrokes Ifa note is still playing but you ask for another one you want the new one to start right then not later after the old process finishes But if your script makes several changes to a database and is interrupted in the middle the result may be that the database is inconsistent When you select Thread safe scripts the same event happening again in the middle of running a script is simply ignored This is arguably still not the right thing the event should be remembered and the script run again as soon as it finishes We ll probably get around
110. to adding that choice eventually Prefer smooth animations slows down Snap sframe rate time between updates to the display to a fixed 1 30 second like Scratch Ordinarily Snap updates the display as often as possible One reason you might want this explaining the option s name 1s to ensure that sprites move a constant distance from one redisplay to the next so that motion seems smooth rather than jerky Another reason is to ensure that your program runs at the same speed on different computers A third reason somewhat counterintuitive 1s that a project with many scripts running at once for example one that clones sprites repeatedly may run faster 1f more time is available for scripts because less time is spent on the display of the screen Flat line ends affects the drawing of thick lines large pen width Usually the ends are rounded which looks best when turning corners With this option selected the ends are flat It s useful for drawing a brick wall 63 Codification support enables an experimental feature that can translate a Snap project to a text based rather than block based programming language The feature doesn t know about any particular other language instead you can provide a translation for each primitive block using these special blocks Using these primitive blocks you can build a block library to translate into any programming language Watch for such libraries to be added to our l
111. tore way to save projects that s the official name of the browser s storage 1s limited to only a few projects Also if your browser 1s configured to disallow cookies from web sites another preference setting then it won t allow localstore either 14 XML Export The second way to save a project on your computer requires two steps but it doesn t have the limitations of localstore Projects saved in this second way are normal files on your computer and can be shared with friends can be opened in any browser and have no size limitation From the file menu choose Export project The entire Snap window will disappear replaced by a screenful of what looks like gibberish Don t panic This is what s supposed to happen You are looking at your project in a notation called XML The main reason it looks like gibberish is that it includes an encoding of the pictures and other media in the project If you look through the XML the actual scripts of the project are pretty readable although they don t look like Snap blocks Snap has opened a new browser tab for this XML text the actual Snap window 1s still there hiding in its original tab But the point of this XML text isn t for you to read Once you re looking at that tab use your browser s Save command in its File menu or usually with a shortcut of command S Mac or control S everything else You can choose a filename for it and it ll be saved in your u
112. u In this menu you choose the turtle s rotation point which is also the point from which the turtle draws lines The two pictures below show what the stage looks like after drawing a square in each mode tip otherwise known as Jens mode is on the left middle Brian mode on the right gt 2 As you see tip means the front tip of the arrowhead middle is not the middle of the shaded region but actually the middle of the four vertices the concave one If the shape were a simple isosceles triangle instead of a fancier arrowhead it would mean the midpoint of the back edge The advantage of tip mode is that the sprite is less likely to obscure the drawing The advantage of middle mode is that the rotation point of a sprite is rarely at a tip and students are perhaps less likely to be confused about Just what will happen if you ask the turtle to turn 90 degrees from the position shown It s also the traditional rotation point of the Logo turtle which originated this style of drawing Costumes other than the turtle have a different context menu edit rename duplicate delete export 70 The edit option opens the Paint Editor on this costume The rename option opens a dialog box in which you can rename the costume A costume s initial name comes from the file from which it was imported if any or is something like costume5 Duplicate makes a copy of the costume in the same sprite Pre
113. u hit the slot and not the arrowheads The third higher order block combine computes a single result from all the items of a list using a two input reporter as its first input In practice there are only a few blocks you ll ever use with combine CED aires a TD D ars These blocks take the sum of the list items take their product string them into one word combine them into a sentence with spaces between items see if all items of a list of Booleans are true or see if any of the items is true 16 combine with ieee list 17 18 f1 gt md Why but not It only makes sense to combine list items using an associative function one that doesn t care in what order the items are combined left to right or right to left 2 3 4 2 3 4 but 2 3 4 2 3 4 26 V Typed Inputs A Scratch s Type Notation Scratch block inputs come in two types Text or number type and Number type The former is indicated by a rectangular box the latter by a rounded box C Eip A third Scratch type Boolean true false can be used in certain Control blocks with hexagonal slots The Snap types are an expanded collection including Procedure List and Object types Note that with the exception of Procedure types all of the input type shapes are just reminders to the user of what the block expects they are not enforced by the language B The Snap Input Type Dialog In the Block Editor input name dialog th
114. unication with Broadcast Earlier we saw an example of two sprites moving at the same time In a more interesting program though the sprites on stage will interact to tell a story play a game etc Often one sprite will have to tell another sprite to run a script Here s a simple example when clicked eS ari What syourname BOIR 2 Bette broadcast bark and wait Pe a Hi Woot Wnatdo youlike to do BOIN 2 Bette broadcast par and wait say Cie 2 when I receive bar say G 2 ee Inthe ee block the word bark is Just an arbitrary name I made up When you click on the downward arrowhead in that input slot one of the choices the only choice the first time 1s new which then prompts you to enter a name for the new broadcast When this block is run the chosen message 1s sent to every sprite which is why the block is called broadcast In this program though only one sprite has a script to run when that broadcast is sent namely the dog Because the boy s script uses broadcast and wait rather than just broadcast the boy doesn t go on to his next say block until the dog s script finishes That s why the two sprites take turns talking instead of both talking at once Notice by the way that the say block s first input slot is rectangular rather than oval This means the input can be any text string not only a number In the text input slots a space character 1s shown as a brown dot so
115. w the inner call doesn t report at all and neither does the block The throw block s input of 20 becomes the value reported by the catch block and the x block multiplies 10 and 20 J3 Creating a Thread System Snap can be running several scripts at once within a single sprite and across many sprites If you only have one computer how can it do many things at once The answer is that only one is actually running at any moment but Snap switches its attention from one script to another frequently At the bottom of every looping block repeat repeat until forever there 1s an implicit yield command which remembers where the current script 1s up to and switches to some other script each in turn At the end of every script 1s an implicit end thread command a thread is the technical term for the process of running a script which switches to another script without remembering the old one Since this all happens automatically there is generally no need for the user to think about threads But just to show that this too is not magic here 1s an implementation of a simple thread system It uses a global variable named tasks that initially contains an empty list Each use of the C shaped thread block adds a continuation the ringed script to the list The yield block uses run w continuation to create a continuation for a partly done thread adds it to the task list and then runs the first waiting task The end thread
116. y Using first class continuations we can generalize this mechanism to allow nonlocal exit even within a block called from inside a loop or through several levels of nested loops catch break action A catch break input names cont w continuation rum action The upvar break has as its value a continuation that can be called from anywhere in the program to Jump immediately to whatever comes after the catch block in its script Here s an example with two nested invocations of catch with the upvar renamed in the outer one catch outer saten i for i run outer s say I for secs Saree ECR 2 ET aol ahimm BCO 2 EIE As shown this will say 1 then 2 then 3 then exit both nested catches and think Hmm Ifin the run block the variable break is used instead of outer then the script will say 1 2 3 and Hello before thinking Hmm There are corresponding catch and throw blocks for reporters The catch block is a reporter that takes an expression as input instead of a C shaped slot But the throw block is a command it doesn t report a value to its own continuation but instead reports a value which it takes as an additional input in addition to the catch tag to the corresponding catch block s continuation 80 10 eae ee ee o ee aS Without the throw the inner call reports 5 the block reports 8 so the catch block reports 8 and the x block reports 80 With the thro
117. ype so its input slots are not ringed We must say explicitly that we want the block ztself as the input rather than whatever value would result from evaluating the block Besides the list block in the example above other blocks into which you may want to put procedures are set to set the value of a variable to a procedure say and think to display a procedure to the user and report for a reporter that reports a procedure compose fA g report call f with inputs F E Special Forms The primitive if else block has two C shaped command slots and chooses one or the other depending on a Boolean test Because Scratch doesn t emphasize functional programming it lacks a corresponding reporter block to choose between two expressions We could write one in Snap no 3 if test then yes alse no yes Kano A A W test report ni 4 Jens s tum else DR S22 Cens CC enan B stum Bae report i Our block works for these simple examples but if we try to use it in writing a recursive operator it ll fail factorial n report f n The problem is that when any block is called all of its inputs are computed evaluated before the block itself runs The block itself only knows the values of its inputs not what expressions were used to compute them In particular all of the inputs to our if then else block are evaluated first thing That means that even in the base case factorial will try to ca

Download Pdf Manuals

image

Related Search

Related Contents

FY-08PPH7D の取付工事説明書  CLUB3D HD4650 1GB  Kabelsatz Comand 2.5 zum IMU 1451 Cable kit Comand 2.5 to the  Solar-Dinamo Auto  簡易型電文設定器に関するご質問の回答  Project Default User Manual  Technoline Weather Station AMBER  取扱説明書 クリーナー 品番 SC-UR9H  Panasonic MC-V7710 Vacuum Cleaner User Manual    

Copyright © All rights reserved.
Failed to retrieve file