Moving block-specific help files to own directory.
@@ -2,7 +2,7 @@
|
||||
|
||||
Did you just get this error message?
|
||||
|
||||

|
||||

|
||||
|
||||
If so, then you are probably attempting to run the uncompiled version of Blockly and you are missing the dependency on [Closure Library](https://developers.google.com/closure/library/).
|
||||
|
||||
@@ -16,6 +16,6 @@ svn checkout https://github.com/google/closure-library/trunk closure-library-rea
|
||||
|
||||
Once you have the Closure files, place them next to Blocky's root directory and ensure that the directory is named ` closure-library-read-only `. This is the directory structure you want:
|
||||
|
||||

|
||||

|
||||
|
||||
That's it. Blockly should now work in uncompiled mode.
|
||||
@@ -21,7 +21,7 @@ Blockly.Blocks['text_length'] = {
|
||||
};
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
* ` text_length ` is the name of the block. Since all blocks share the same namespace, it is good to use a name made up of your category (in this case ` text `) followed by your block's function (in this case ` length `).
|
||||
* ` init ` is a function which defines the look and feel of the block.
|
||||
@@ -61,7 +61,7 @@ The URL of the page which should open when the user right-clicks on the block an
|
||||
```
|
||||
Blockly uses a [Hue-Saturation-Value](https://en.wikipedia.org/wiki/HSL_and_HSV) (HSV) colour model. Saturation and Value are hard-coded into Blockly, whereas the Hue is defined on each block. This ensures that developers have the freedom to choose from a wide range of colours, while still guaranteeing that all the blocks will fit together visually. It also allows the entire Blockly look and feel to be made brighter (for children) or more depressing (for businesses) by simply adjusting the two hard-coded Saturation and Value constants.
|
||||
|
||||

|
||||

|
||||
|
||||
To find a good colour, visit this [HSV picker](http://www.rapidtables.com/web/color/color-picker.htm), enter Blockly's Saturation and Value constants (the defaults are 45% and 65% respectively), then slide the Hue as desired. Use this Hue value as the argument to the ` this.setColour ` function. Note the British spelling. Failure to set the colour results in a black block.
|
||||
|
||||
@@ -71,7 +71,7 @@ To find a good colour, visit this [HSV picker](http://www.rapidtables.com/web/co
|
||||
this.setOutput(true, 'Number');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Value blocks (as opposed to statements) need an output tab. Blocks with an output tab may not also have a previous statement notch.
|
||||
|
||||
@@ -85,7 +85,7 @@ In the event that the block could return more than one type of value, use an arr
|
||||
this.setPreviousStatement(true);
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Creates a notch at the top of the block, so that it may be plugged into a stack of statements. Normally combined with ` setNextStatement ` (see below). Blocks with a previous statement notch may not also have an output tab.
|
||||
|
||||
@@ -97,7 +97,7 @@ Optionally (and not typically), this function can take a second argument to limi
|
||||
this.setNextStatement(true);
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Creates a notch at the bottom of the block, so that other statements may be stacked below it. Unless this block terminates flow (e.g. break, return, or end), this is normally combined with ` setPreviousStatement ` (see above).
|
||||
|
||||
@@ -118,7 +118,7 @@ Optionally (and not typically), this function can take a second argument to limi
|
||||
.appendField('do');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Each block has a list of input rows. There are three types of inputs:
|
||||
|
||||
@@ -160,7 +160,7 @@ Once an input has been created and appended to a block with ` appendInput `, one
|
||||
input.appendField('hello');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
An input row can contain any number of field elements. The simplest field element is text. Blockly's convention is to use all lowercase text, with the exception of proper names (e.g. Google, SQL).
|
||||
|
||||
@@ -169,7 +169,7 @@ An input row can contain any number of field elements. The simplest field eleme
|
||||
input.appendField(textInput, 'NAME');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Another field element is a text input. First, create the field, then append it to the input row. Since the code generators will eventually need to access the data in this field element, be sure to give it a name (in this case ` 'NAME' `). This name is never seen by the user and should be consistent across all human language versions of the block.
|
||||
|
||||
@@ -180,7 +180,7 @@ Optionally, the ` FieldTextInput ` constructor can also take a second argument w
|
||||
input.appendField(dropdown, 'MODE');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Another field element is a drop-down menu. Just like the text input field, the drop-down menu is created separately, then appended to the input row. The ` FieldDropdown ` object is created with a list of menu options, or with a generator function.
|
||||
|
||||
@@ -191,7 +191,7 @@ Another field element is a drop-down menu. Just like the text input field, the
|
||||
input.appendField(variable, 'VAR');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Another field element is a variable selection menu. The ` FieldVariable ` object is created with the default variable name to use (in this case ` 'item' `). If this name is omitted, the variable will be a new unique variable (e.g. ` 'i' `, ` 'j' `, ` 'k' `...).
|
||||
|
||||
@@ -200,7 +200,7 @@ Another field element is a variable selection menu. The ` FieldVariable ` objec
|
||||
input.appendField(checkbox, 'TOGGLE');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Another field element is a checkbox. The ` FieldCheckbox ` object is created with an initial state, either ` 'TRUE' ` or ` 'FALSE' `.
|
||||
|
||||
@@ -211,7 +211,7 @@ Optionally, the ` FieldCheckbox ` constructor can also take a second argument wh
|
||||
input.appendField(colour, 'COLOUR');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Another field element is a colour picker. The ` FieldColour ` object is created with an initial colour, in hexadecimal ` '#rrggbb' ` format. Note the British spelling.
|
||||
|
||||
@@ -222,7 +222,7 @@ Optionally, the ` FieldColour ` constructor can also take a second argument whic
|
||||
input.appendField(image);
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Another field element is a static image. The ` FieldImage ` object is created with the image URL and the desired height and width. The image will be scaled to within the specified dimensions, while preserving the aspect ratio. The block will expand as needed to accommodate the image. An optional fourth argument specifies the alternate text for use when the block is collapsed.
|
||||
|
||||
@@ -234,7 +234,7 @@ If the image is being served locally on a relative URL, use ` Blockly.pathToBloc
|
||||
this.setInputsInline(true);
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Value and variable inputs are by default each on separate lines (as shown on the left). By setting inputs inline, one can create a more compact block (as shown on the right).
|
||||
|
||||
@@ -256,7 +256,7 @@ Tooltips may also be defined as a function instead of a static string. This all
|
||||
this.setMutator(new Blockly.Mutator(['controls_if_elseif', 'controls_if_else']));
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
Mutators allow advanced blocks to change shape, most notably as a result of users opening a dialog to add, remove or rearrange components. Creating a mutator is not trivial and is the subject of a separate page: [Creating Mutators](wiki/CreatingMutators).
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ Drop-down menus can be somewhat complicated field elements used in creating bloc
|
||||
input.appendField(dropdown, 'MODE');
|
||||
```
|
||||
|
||||

|
||||

|
||||
|
||||
The ` FieldDropdown ` object is created with a list of menu options. Each option is made up of two strings. The first is the human-readable text to display. The second is a string constant which is used when saving the option to XML. This separation allows a dropdown menu's setting to be preserved between languages. For instance an English (` en/ `) version of a block may define ` [['left', 'LEFT'], ['right', 'RIGHT']] ` while a German (` de/ `) version of the same block would define ` [['links', 'LEFT'], ['rechts', 'RIGHT']] `.
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@ Code generators are used to convert Blockly's programs into JavaScript, Python,
|
||||
|
||||
Consider the following assembly of blocks.
|
||||
|
||||

|
||||

|
||||
|
||||
If the generators were not aware of operator precedence, the resulting JavaScript code would be:
|
||||
```
|
||||
|
||||
@@ -137,7 +137,7 @@ Of course, if you have a different path to ` _soy ` or wish to generate "en\_us.
|
||||
|
||||
Before checking in code, developers should do a full i18n build by following the instructions in comments at the top of [apps/common.soy](https://code.google.com/p/blockly/source/browse/trunk/apps/common.soy). The below diagram shows the build process. It is followed by a description of each step.
|
||||
|
||||

|
||||

|
||||
|
||||
#### SoyMsgExtractor.jar
|
||||
|
||||
@@ -252,7 +252,7 @@ Synonym definitions may appear anywhere in ` messages.js ` after the right-hand
|
||||
|
||||
Ideally, translators should be given sentences, rather than bits of pieces of text to be concatenated with data. This can sometimes be provided through message interpolation, as in this example:
|
||||
|
||||

|
||||

|
||||
```
|
||||
/// block title - Title of [https://code.google.com/p/blockly/wiki/Loops#count_with count with] blocks.
|
||||
Blockly.Msg.CONTROLS_FOR_INPUT_WITH = 'count with';
|
||||
|
||||
BIN
help/.DS_Store
vendored
Normal file
@@ -9,13 +9,13 @@ Blockly users can choose, create, and blend colours. Colours are primarily used
|
||||
|
||||
The simplest way to get a colour is with the **colour picker**. It appears as a red rounded rectangle. When the user clicks on it, a palette of colours pops open, from which the user can choose the desired colour by again clicking.
|
||||
|
||||

|
||||

|
||||
|
||||
## Creating a colour from red, green, and blue components
|
||||
|
||||
The **colour with** block allows the user to specify the desired percent of red, green, and blue. This block builds a colour with the maximum amounts of red and blue and no green (making purple):
|
||||
|
||||

|
||||

|
||||
|
||||
Note that we use [a range from 0 to 100 (inclusive) for each component](http://www.december.com/html/spec/colorper.html), not the less intuitive range of 0 to 255 generally used by programmers and graphic designers.
|
||||
|
||||
@@ -25,7 +25,7 @@ The ability to specify colours with changing numbers allows some beautiful turtl
|
||||
|
||||
The **random colour** block generates colours at random.
|
||||
|
||||

|
||||

|
||||
|
||||
Specifically, each of the red, green, and blue components is a number from 0 to 255 (inclusive), with equal likelihood.
|
||||
|
||||
@@ -33,7 +33,7 @@ Specifically, each of the red, green, and blue components is a number from 0 to
|
||||
|
||||
Unlike traditional turtle graphics systems, Blockly provides a means for blending two colours, as though one were blending two different colours of paint. The following block provides the colour that would be obtained by mixing equal amounts of red paint (actually, [red light](http://www.newton.dep.anl.gov/askasci/gen99/gen99557.htm)) and yellow paint:
|
||||
|
||||

|
||||

|
||||
|
||||
If the ratio were 0, the result would have no red and all yellow. If the ratio were 1, the result would be all red and no yellow.
|
||||
|
||||
@@ -41,7 +41,7 @@ If the ratio were 0, the result would have no red and all yellow. If the ratio
|
||||
|
||||
Blockly colours are represented as text of the form "#rrggbb" where "rr", "gg", and "bb" represent the red, green, and blue components, respectively, in the hexadecimal range 00 to ff. Since colours are usually passed to the "set colour" block in the turtle graphics application, most users are never aware of this, but it is exposed by the following program:
|
||||
|
||||

|
||||

|
||||
|
||||
which prints "#ff0000".
|
||||
|
||||
@@ -14,7 +14,7 @@ See [additional information about conditional statements](https://en.wikipedia.o
|
||||
|
||||
The simplest conditional statement is an **if** block, as shown:
|
||||
|
||||

|
||||

|
||||
|
||||
When run, this will compare the value of the variable **x** to 100. If it is larger, "What a big number!" will be printed. Otherwise, nothing happens.
|
||||
|
||||
@@ -22,7 +22,7 @@ When run, this will compare the value of the variable **x** to 100. If it is la
|
||||
|
||||
It is also possible to specify that something should happen if the condition is _not_ true, as shown in this example:
|
||||
|
||||

|
||||

|
||||
|
||||
As with the previous block, "What a big number!" will be printed if **x** > 100; otherwise, "That's not very big." will be printed.
|
||||
|
||||
@@ -32,7 +32,7 @@ An **if** block may have zero or one **else** sections but not more than one.
|
||||
|
||||
It is also possible to test multiple conditions with a single **if** block by adding **else if** clauses:
|
||||
|
||||

|
||||

|
||||
|
||||
The block first checks if **x** > 100, printing "What a big number!" if it is. If it is not, it goes on to check if **x** = 42. If so, it prints "That's my lucky number." Otherwise, nothing happens.
|
||||
|
||||
@@ -42,7 +42,7 @@ An **if** block may have any number of **else if** sections. Conditions are eva
|
||||
|
||||
As shown here, **if** blocks may have both **else if** and **else** sections:
|
||||
|
||||

|
||||

|
||||
|
||||
The **else** section guarantees that some action is performed, even if none of the prior conditions are true.
|
||||
|
||||
@@ -52,14 +52,14 @@ An **else** section may occur after any number of **else if** sections, includin
|
||||
|
||||
Only the plain **if** block appears on the toolbar:
|
||||
|
||||

|
||||

|
||||
|
||||
To add **else if** and **else** clauses, the user needs to click on the plus sign, which opens a new window:
|
||||
|
||||

|
||||

|
||||
|
||||
The user can then drag **else if** and **else** clauses into the **if** block, as well as reordering and removing them. When finished, the user should click on the minus sign, which closes the window, as shown here:
|
||||
|
||||

|
||||

|
||||
|
||||
Note that the shapes of the blocks allows any number of **else if** subblocks to be added but only up to one **else** block.
|
||||
Note that the shapes of the blocks allows any number of **else if** subblocks to be added but only up to one **else** block.
|
||||
@@ -10,38 +10,38 @@ As in everyday speech, a Blockly list is an ordered collection of items, such as
|
||||
|
||||
The simplest list is the empty list, which is created with the **create empty list** block:
|
||||
|
||||

|
||||

|
||||
|
||||
## create list with
|
||||
|
||||
### basic usage
|
||||
The **create list with** block allows the user to specify the initial values in a new list. In this example, a list of words is being created and placed in a variable named **letters**:
|
||||
|
||||

|
||||

|
||||
|
||||
For this document, we'll denote this list as ["alpha", "beta", "gamma"], and we will refer below to the variables defined in this section.
|
||||
|
||||
This shows the creation of a list of numbers:
|
||||
|
||||

|
||||

|
||||
|
||||
This creates a list of colours:
|
||||
|
||||

|
||||

|
||||
|
||||
It is less common, but possible, to create a list with values of different types:
|
||||
|
||||

|
||||

|
||||
|
||||
### changing number of inputs
|
||||
|
||||
To change the number of inputs, click on the plus ("+") icon. This opens a new window:
|
||||
|
||||

|
||||

|
||||
|
||||
You can then drag **item** sublocks from the left side of the window into the **if** block on the right side to add a new input, as shown:
|
||||
|
||||

|
||||

|
||||
|
||||
While the new item was added at the bottom in this example, it can be added anywhere. Similarly, unwanted **item** subblocks can be dragged off the **if** block to the left.
|
||||
|
||||
@@ -50,7 +50,7 @@ While the new item was added at the bottom in this example, it can be added anyw
|
||||
|
||||
The **create list with item** block lets you create a list that has the specified number of copies of an item. For example, the following blocks set the variable **words** to the list containing ["very", "very", "very"].
|
||||
|
||||

|
||||

|
||||
|
||||
# Checking a List's Length
|
||||
|
||||
@@ -58,7 +58,7 @@ The **create list with item** block lets you create a list that has the specifie
|
||||
|
||||
The value of an **is empty** block is **true** if its input is the empty list and **false** if it is anything else (including a non-list). IS THIS TRUE? The value of the following blocks would be **false** because the variable **colours** is not empty: it has three items.
|
||||
|
||||

|
||||

|
||||
|
||||
Note the similarity to the ["is empty" block for text](https://code.google.com/p/blockly/wiki/Text#Checking_for_empty_text).
|
||||
|
||||
@@ -66,11 +66,11 @@ Note the similarity to the ["is empty" block for text](https://code.google.com/p
|
||||
|
||||
The value of the **length of** block is the number of elements in the list used as an input. For example, the value of the following blocks would be 3 because colour has three items.
|
||||
|
||||

|
||||

|
||||
|
||||
Note that the **length of** block tells you how many items are in the list, not how many _different_ items are in it. For example, the following has the value 3, even though **words** consists of three copies of the same text (["very", "very", "very"]).
|
||||
|
||||

|
||||

|
||||
|
||||
Note the similarity to the ["length of" block for text](https://code.google.com/p/blockly/wiki/Text#Text_length).
|
||||
|
||||
@@ -78,15 +78,15 @@ Note the similarity to the ["length of" block for text](https://code.google.com/
|
||||
|
||||
These blocks find the position of an item in a list. For example, the following has a value of 1 because the first appearance of "very" is as the beginning of the **words** list (["very", "very", "very"]).
|
||||
|
||||

|
||||

|
||||
|
||||
The result of the following is 3 because the last appearance of "very" in **words** is in position 3.
|
||||
|
||||

|
||||

|
||||
|
||||
If the item is nowhere in the list, the result is in the value 0, as in this example:
|
||||
|
||||

|
||||

|
||||
|
||||
These blocks are analogous to [the ones for finding letters in text](https://code.google.com/p/blockly/wiki/Text#Finding_text).
|
||||
|
||||
@@ -96,42 +96,42 @@ These blocks are analogous to [the ones for finding letters in text](https://cod
|
||||
|
||||
Recall the definition of the list **colours**:
|
||||
|
||||

|
||||

|
||||
|
||||
The following block gets the color <font color='blue'>blue</font> because it is the second element in the list (counting from the beginning on the left):
|
||||
|
||||

|
||||

|
||||
|
||||
This gets <font color='green'>green</font> because it is the second element counting from the right end:
|
||||

|
||||

|
||||
|
||||
This gets the first element, <font color='red'>red</font>:
|
||||
|
||||

|
||||

|
||||
|
||||
This gets the last element, <font color='orange'>yellow</font>:
|
||||
|
||||

|
||||

|
||||
|
||||
This randomly selects an item from the list, returning any of <font color='red'>red</font>, <font color='blue'>blue</font>, <font color='green'>green</font>, or <font color='orange'>yellow</font> with equal likelihood.
|
||||
|
||||

|
||||

|
||||
|
||||
### Getting and removing an item
|
||||
|
||||
A dropdown menu on the **in list ... get** block changes it to **in list ... get and remove**, which provides the same otuput but also modifies the original list:
|
||||
|
||||

|
||||

|
||||
|
||||
This example sets the variable **first letter** to "alpha" and leaves **letters** as: ["beta", "gamma"].
|
||||
|
||||

|
||||

|
||||
|
||||
### Removing an item
|
||||
|
||||
Selecting "remove" on the dropdown causes the plug on the left of the block to disappear:
|
||||
|
||||

|
||||

|
||||
|
||||
This removes the first item from **letters**.
|
||||
|
||||
@@ -139,15 +139,15 @@ This removes the first item from **letters**.
|
||||
|
||||
The **in list ... get sublist** block is similar to the **in list ... get** block except that it extracts a sublist, rather than an individual item. There are several options for how the start and end of the sublist can be specified:
|
||||
|
||||

|
||||

|
||||
|
||||

|
||||

|
||||
|
||||
A few languages (notably Hungarian) require text following the right socket (hole). This is referred to as a "tail" message.
|
||||
|
||||
In this example, a new list **first letters** is created. This new list has two elements: ["alpha", "beta"].
|
||||
|
||||

|
||||

|
||||
|
||||
Note that this block does not modify the original list.
|
||||
|
||||
@@ -157,7 +157,7 @@ Note that this block does not modify the original list.
|
||||
|
||||
The **in list ... set** block replaces the item at a specified location in a list with a different item.
|
||||
|
||||

|
||||

|
||||
|
||||
For the meaning of each of the dropdown options, see the [previous section](wiki/Lists#Getting_Items_from_a_List).
|
||||
|
||||
@@ -165,13 +165,13 @@ The following example does two things:
|
||||
1. The list **words** is created with 3 items: ["very", "very", "very"].
|
||||
1. The third item in the list is replaced by "good". The new value of **words** is ["very", "very", "good"].
|
||||
|
||||

|
||||

|
||||
|
||||
## in list ... insert at
|
||||
|
||||
The **in list ... insert at** block is obtained by using the dropdown menu on the **in list ... set** block:
|
||||
|
||||

|
||||

|
||||
|
||||
It inserts a new item into the list at the specified location, before the item previously at that location. The following example (built on an earlier one) does three things:
|
||||
|
||||
@@ -179,7 +179,7 @@ It inserts a new item into the list at the specified location, before the item p
|
||||
1. The third item in the list is replaced by "good". The new value of **words** is ["very", "very", "good"].
|
||||
1. The word "you're" is inserted at the beginning of the list. The final value of **words** is ["You're", "very", "very", "good"].
|
||||
|
||||

|
||||

|
||||
|
||||
# Related Blocks
|
||||
|
||||
@@ -187,15 +187,15 @@ It inserts a new item into the list at the specified location, before the item p
|
||||
|
||||
The [print block](wiki/Text#Printing_text) in the Text category can print lists. The result of the following program is the shown alert box:
|
||||
|
||||

|
||||

|
||||
|
||||

|
||||

|
||||
|
||||
## Doing something for each item in a list
|
||||
|
||||
The [for-each block](wiki/Loops#for_each) in the Control category performs an operation on every item in a list. For example, these blocks individually print each item in the list:
|
||||
|
||||

|
||||

|
||||
|
||||
This does not remove the items from the original list.
|
||||
|
||||
@@ -12,7 +12,7 @@ Boolean values (also called _conditions_) are used in these control block, which
|
||||
|
||||
One of the many examples from those pages is:
|
||||
|
||||

|
||||

|
||||
|
||||
If the value of the variable **x** is greater than 100, the condition is **true**, and the text "What a big number!" is printed. If the value of **x** is not greater than 100, the condition is **false**, and "That's not very big." is printed.
|
||||
|
||||
@@ -26,19 +26,19 @@ If a block expects a Boolean value as an input, it interprets an absent input as
|
||||
|
||||
A single block, with a dropdown specifying either **true** or **false**, can be used to get a boolean value:
|
||||
|
||||

|
||||

|
||||
|
||||
## not
|
||||
|
||||
The **not** block converts its Boolean input into its opposite. For example, the result of:
|
||||
|
||||

|
||||

|
||||
|
||||
is false.
|
||||
|
||||
As mentioned above, if no input is provided, a value of **true** is assumed, so the following block produces the value **false**:
|
||||
|
||||

|
||||

|
||||
|
||||
Leaving an input empty is not recommended, however.
|
||||
|
||||
@@ -10,7 +10,7 @@ The **Control** category holds blocks that control whether other blocks placed i
|
||||
|
||||
The simplest "repeat" block runs the code in its body the specified number of times. For example, the following block will print "Hello!" ten times.
|
||||
|
||||

|
||||

|
||||
|
||||
### repeat while
|
||||
|
||||
@@ -23,7 +23,7 @@ Imagine a game in which a player rolls a die and adds up all of the values rolle
|
||||
1. The variable **total** gets increased by **roll**.
|
||||
1. The end of the loop having been reached, control goes back to step 2.
|
||||
|
||||

|
||||

|
||||
|
||||
When the loop completes, any subsequent blocks (not shown) would be run. In our example, the loop would end after some number of random numbers in the range 1 to 6 had been printed, and the variable **total** would hold the sum of these numbers, which would be guaranteed to be at least 30.
|
||||
|
||||
@@ -33,23 +33,23 @@ For more information, see https://en.wikipedia.org/wiki/While_loop.
|
||||
|
||||
"Repeat while" loops repeat their bodies _while_ some condition is true. Repeat-until loops are similar except that they repeat their bodies _until_ some condition is true. The following blocks are equivalent to the previous example because the loop contains until **total** is greater than or equal to 30.
|
||||
|
||||

|
||||

|
||||
|
||||
## count with
|
||||
|
||||
The **count with** block (called a [for loop](https://en.wikipedia.org/wiki/For_loop) in most programming languages) advances a variable from the first value to the second value by the increment amount (third value), running the body once for each value. For example, the following program prints the numbers 1, 3, and 5.
|
||||
|
||||

|
||||

|
||||
|
||||
As shown by the two following loops, each of which prints the numbers 5, 3, and 1, the first input may be larger than the second. The behavior is the same whether the increment amount (third value) is positive or negative.
|
||||
|
||||

|
||||

|
||||
|
||||
## for each
|
||||
|
||||
The **for each** block (see https://en.wikipedia.org/wiki/Foreach) is similar, except instead of giving the loop variable values in a numeric sequence, it uses the values from a list in turn. The following program prints each element of the list: "alpha", "beta", "gamma".
|
||||
|
||||

|
||||

|
||||
|
||||
# Loop Termination Blocks
|
||||
|
||||
@@ -61,10 +61,10 @@ The **continue with next iteration** (called [continue](https://en.wikipedia.org
|
||||
|
||||
The following program prints "alpha" on the first iteration of the loop. On the second iteration, the **continue with next iteration** block is run, skipping the printing of "beta". On the final iteration, "gamma" is printed.
|
||||
|
||||

|
||||

|
||||
|
||||
## break out of loop
|
||||
|
||||
The **break out of loop** block provides [an early exit from a loop](https://en.wikipedia.org/wiki/Control_flow#Early_exit_from_loops). The following program prints "alpha" on the first iteration and "breaks out" of the loop on the second iteration when the loop variable is equal to "beta". The third item in the list is never reached.
|
||||
|
||||

|
||||

|
||||
@@ -13,15 +13,15 @@ Text can contain letters (which may be lower-case or upper-case), numbers, punct
|
||||
## Text creation
|
||||
The following block creates the piece of text "hello" and stores it in the variable named ` greeting `.
|
||||
|
||||

|
||||

|
||||
|
||||
The **create text with** block combines (concatenates) the value of the ` greeting ` variable and the new text "world" to create the text "helloworld". Note that there is no space between them, since none was in either original text.
|
||||
|
||||

|
||||

|
||||
|
||||
To increase the number of text inputs, click on the plus sign, which changes the view to:
|
||||
|
||||

|
||||

|
||||
|
||||
Additional inputs are added by dragging an "item" block from the gray toolbox on the left into the "join" block.
|
||||
|
||||
@@ -29,37 +29,37 @@ Additional inputs are added by dragging an "item" block from the gray toolbox on
|
||||
|
||||
The **to...append text** block adds the given text to the specified variable. In this case, it changes the value of the variable ` greeting ` from "hello" to "hello, there!"
|
||||
|
||||

|
||||

|
||||
|
||||
|
||||
## Text length
|
||||
|
||||
The **length of** blocks count the number of letters, numbers, etc., in each text. The length of "We're #1!" is 9, and the length of the empty text is 0.
|
||||
|
||||

|
||||

|
||||
|
||||

|
||||

|
||||
|
||||
## Checking for empty text
|
||||
The **is empty** block checks whether the given text is empty (has length 0). The result is **true** in the first case and **false** in the second.
|
||||
|
||||

|
||||

|
||||
|
||||

|
||||

|
||||
|
||||
## Finding text
|
||||
|
||||
These blocks can be used to check whether a piece of text is in another piece of text and, if so, where it appears. For example, this asks for the first occurrence of "e" in "hello". The result is 2.
|
||||
|
||||

|
||||

|
||||
|
||||
This asks for the _last_ occurrence of "e" in "hello", which, is also 2.
|
||||
|
||||

|
||||

|
||||
|
||||
Whether **first** or **last** is selected, this block will give the result 0, since "hello" does not contain "z".
|
||||
|
||||

|
||||

|
||||
|
||||
## Extracting text
|
||||
|
||||
@@ -67,23 +67,23 @@ Whether **first** or **last** is selected, this block will give the result 0, si
|
||||
|
||||
This gets "b", the second letter in "abcde":
|
||||
|
||||

|
||||

|
||||
|
||||
This gets "d", the second _to last_ letter in "abcde":
|
||||
|
||||

|
||||

|
||||
|
||||
This gets "a", the first letter in "abcde":
|
||||
|
||||

|
||||

|
||||
|
||||
This gets "e", the last letter in "abcde":
|
||||
|
||||

|
||||

|
||||
|
||||
This gets any of the 5 letters in "abcde" with equal probability:
|
||||
|
||||

|
||||

|
||||
|
||||
None of these modify the text on which the extraction is performed.
|
||||
|
||||
@@ -100,7 +100,7 @@ and ending with:
|
||||
|
||||
In the following example, "abc" is extracted.
|
||||
|
||||

|
||||

|
||||
|
||||
## Adjusting text case
|
||||
|
||||
@@ -111,7 +111,7 @@ This block creates a version of the input text that is either:
|
||||
|
||||
The result of the following block is "HELLO".
|
||||
|
||||

|
||||

|
||||
|
||||
Non-alphabetic characters are not affected. Note that this block on text in languages without case, such as Chinese.
|
||||
|
||||
@@ -124,13 +124,13 @@ The following block removes space characters from:
|
||||
|
||||
The result of the following block is "hi there". (Spaces in the middle of the text are not affected.)
|
||||
|
||||

|
||||

|
||||
|
||||
## Printing text
|
||||
|
||||
The **print** block causes the input value to be displayed in a pop-up window, as shown:
|
||||
|
||||

|
||||

|
||||
|
||||
If the code is exported as JavaScript, Python, or Dart, it will be printed to the console (screen). In no case is it sent to the printer, as the name might suggest.
|
||||
|
||||
@@ -138,12 +138,12 @@ If the code is exported as JavaScript, Python, or Dart, it will be printed to th
|
||||
|
||||
The following block creates a pop-up window that prompts the user to enter a name. The result is stored in the variable **name**:
|
||||
|
||||

|
||||

|
||||
|
||||
This is what the current version of the pop-up window looks like:
|
||||
|
||||

|
||||

|
||||
|
||||
There is also a version of the block for getting a number from the user:
|
||||
|
||||

|
||||

|
||||
@@ -17,7 +17,7 @@ While users can choose any name for a variable, core Blockly provides a default
|
||||
|
||||
Clicking on a variable's dropdown symbol (triangle) gives the following menu:
|
||||
|
||||

|
||||

|
||||
|
||||
The menu provides the following options.
|
||||
* the names of all variables defined in the program.
|
||||
@@ -30,13 +30,13 @@ The menu provides the following options.
|
||||
|
||||
The **set** block assigns a value to a variable, creating the variable if it doesn't already exist. For example, this sets the value of the variable named "age" to 12.
|
||||
|
||||

|
||||

|
||||
|
||||
## Get
|
||||
|
||||
The **get** block provides the value stored in a variable, without changing it.
|
||||
|
||||

|
||||

|
||||
|
||||
It is possible, but a bad idea, to write a program in which a **get** appears without a corresponding **set**.
|
||||
|
||||
@@ -44,6 +44,6 @@ It is possible, but a bad idea, to write a program in which a **get** appears wi
|
||||
|
||||
Consider the following example code:
|
||||
|
||||

|
||||

|
||||
|
||||
The first row of blocks creates a variable named "age" and sets its initial value to the number 12. The second row of blocks gets the value 12, adds 1 to it, and stores the sum (13) into the variable. The final row displays the message: "Happy birthday! You are now 13"
|
||||
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.6 KiB |
|
Before Width: | Height: | Size: 9.8 KiB After Width: | Height: | Size: 9.8 KiB |
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 30 KiB After Width: | Height: | Size: 30 KiB |
|
Before Width: | Height: | Size: 7.2 KiB After Width: | Height: | Size: 7.2 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 31 KiB |
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.7 KiB |
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 1.1 MiB After Width: | Height: | Size: 1.1 MiB |
|
Before Width: | Height: | Size: 8.3 KiB After Width: | Height: | Size: 8.3 KiB |
|
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 919 KiB After Width: | Height: | Size: 919 KiB |
|
Before Width: | Height: | Size: 7.2 KiB After Width: | Height: | Size: 7.2 KiB |
|
Before Width: | Height: | Size: 8.8 KiB After Width: | Height: | Size: 8.8 KiB |
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.7 KiB |
|
Before Width: | Height: | Size: 7.5 KiB After Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 4.0 KiB |
|
Before Width: | Height: | Size: 8.6 KiB After Width: | Height: | Size: 8.6 KiB |
|
Before Width: | Height: | Size: 8.6 KiB After Width: | Height: | Size: 8.6 KiB |
|
Before Width: | Height: | Size: 8.6 KiB After Width: | Height: | Size: 8.6 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 8.7 KiB After Width: | Height: | Size: 8.7 KiB |
|
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 6.8 KiB After Width: | Height: | Size: 6.8 KiB |
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 5.2 KiB After Width: | Height: | Size: 5.2 KiB |
|
Before Width: | Height: | Size: 5.5 KiB After Width: | Height: | Size: 5.5 KiB |
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
|
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 9.8 KiB After Width: | Height: | Size: 9.8 KiB |
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 4.0 KiB |
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 4.0 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
Before Width: | Height: | Size: 17 KiB After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 5.5 KiB After Width: | Height: | Size: 5.5 KiB |
|
Before Width: | Height: | Size: 9.6 KiB After Width: | Height: | Size: 9.6 KiB |
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 6.8 KiB After Width: | Height: | Size: 6.8 KiB |
|
Before Width: | Height: | Size: 4.3 KiB After Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 3.1 KiB After Width: | Height: | Size: 3.1 KiB |
|
Before Width: | Height: | Size: 9.5 KiB After Width: | Height: | Size: 9.5 KiB |
|
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 4.7 KiB After Width: | Height: | Size: 4.7 KiB |
|
Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 5.3 KiB |
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 4.0 KiB After Width: | Height: | Size: 4.0 KiB |
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 19 KiB |
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 19 KiB |
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 9.9 KiB After Width: | Height: | Size: 9.9 KiB |
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 6.0 KiB After Width: | Height: | Size: 6.0 KiB |
|
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 16 KiB |