Procedure (aka function) is a named group of puzzles that performs a specific task. By organizing your puzzles in procedures you can make your scenarios more compact and maintainable.

Creating Procedures

A new procedure can be created by dragging out the procedure definition puzzle from the toolbox:

Procedures in visual programming editor

A newly created procedure puzzle can be renamed and filled up with other puzzles to perform some task:

Example of a visual logic procedure

Calling Procedures

To be able to trigger (to call) a procedure, drag out the corresponding puzzle from the toolbox:

Running visual programming procedure

A procedure can be triggered several times and from several places of a Puzzles scenario. This may allow for re-using puzzles rather than straight-copying similar set of puzzles several times. For example, an animation can be launched whenever the user clicks the object itself or an HTML button (thus securing duplicate controls).

Running visual programming procedure multiple times

A procedure may have additional input parameters (aka arguments). To add an input to your procedure, click the gear icon and drag out a parameter puzzle from the toolbox on the left, sticking it in the inputs puzzle:

Arguments of visual programming procedures

To be able to use an input parameter inside a procedure, drag out the corresponding "get" variable puzzle created automatically in "Variables":

Procedure params shown as variables in the visual logic editor

This variable can be used as a substitute for actual data (such as object names) to perform some task with.

Example of procedure argument

When triggering a procedure with inputs, provide the data for each trigger puzzle.

Calling visual programming procedures with arguments multiple times

You can jump from a trigger puzzle to the corresponding procedure definition puzzle using the right-click menu:

Jump to procedure in visual logic editor

Procedures can also be called by using the get procedure and call procedure puzzles. This way a procedure can be obtained, stored in a variable, passed into another procedure as a parameter and called later whenever needed.

Procedures with Return Value

A procedure may output a computed value to its caller (aka return value). To create such a procedure, from the toolbox drag out the variant of the procedure puzzle with the return slot.

Returning value from visual programming procedure

Using "if return" Puzzle

A procedure may return a value upon some condition before all inside puzzles are interpreted. In this case the procedure stops running prematurely.

Early return from visual logic procedure

Calling Procedures from JavaScript

To execute Puzzles procedures from JavaScript code use either the puzzles argument of the runCode() function of your_app_name.js module or the built-in puzzles variable inside the exec script puzzle:


Having Troubles with Puzzles?

Seek help on the forums!