Advanced Puzzles

Use these puzzles to implement advanced features in your apps, such as networking, interation with JavaScript code, data conversion, state saving/restoring and more.

Advanced visual programming blocks

Contents

Puzzles Reference

comment

This puzzle does nothing except places a comment line to make your script easier to grasp. It also adds a JavaScript comment line to visual_logic.js.

Comment visual programming block

exec script

This puzzle executes the specified javascript code. The puzzle uses Ace Editor for displaying and editing the content. See the relevant keyboard shortcuts here: Default Keyboard Shortcuts. The puzzle can be resized to change the editor's width and height.

You can use the following built-in variables:

Visual programming block to exec JavaScript

Specifics of using built-ins regarding to "Init" and other tabs

call external function

Executes a function specified in the JavaScript code of the application. Optionally passes parameters to be used as function arguments.

Call external function visual programming block

In order to add a function to JavaScript code, open the application .js file (for example, my_awesome_app.js located in the my_awesome_app folder in the applications folder) with any text editor. Search for "prepareExternalInterface" and add your function inside that declaration (between the curly brackets), so that it looks like this:

function prepareExternalInterface(app) { app.ExternalInterface.myJSFunction = function(numericArg, textArg) { alert('Got some params from Puzzles: ' + numericArg + ' and ' + textArg); } }

load data

Attempts to load data from a specified location. The puzzles in the "once ready do" slot are interpreted regardless of whether the attempt was a success. The retrieved data can be accessed via the loaded data puzzle.

In the case the request should not be cached, click on the gear icon and activate "disable caching" checkbox. Caching logic in puzzles: when an url is used for the first time with caching - it will be cached and all subsequent uses of the url with caching will use the saved cache, if url used with disabled caching - it will neither create cache nor use the saved cache.

Visual programming block to get data over network

Browsers attempt to keep local copies of assets for optimization purposes. To avoid browser caching, an additional parameter can be used to change the URL each time you make a request. To add this parameter, use the set URL param and elapsed total puzzles:

Fixing issue with browser cache

send data

Attempts to send a specified data to a remote location using an asynchronous POST HTTP request. The puzzles in the "once ready do" slot are interpreted regardless of whether the attempt was a success. If there is any response data, it can be accessed via the loaded data puzzle.

Visual programming block to send data over network

Browsers attempt to keep local copies of assets for optimization purposes. To avoid browser caching, an additional parameter can be used to change the URL each time you make a request. To add this parameter, use the set URL param and elapsed total puzzles:

Fixing issue with browser cache

loaded data

Returns data retrieved by the load data or send data puzzles.

Loaded data visual programming block

read JSON

Interprets text (or Data URI) as JavaScript Object Notation data which is returned in a dictionary.

Read JSON visual programming block

read CSV

Interprets text (or Data URI) as comma-separated values. Returns a list of table rows, with each row represented as a list of values. The delimiter can be selected with the drop-down to correspond a CSV file's export settings. "From row" value denotes how many rows will be skipped starting from the top.

Read CSV visual programming block

Table rows and values are accessed by their numeric indices starting from 0.

Read CSV example

connector

This puzzle facilitates connecting other puzzles with each other, to make it more convenient to move, delete and use them in other puzzles. The most notable application is to join load sound or load video puzzles into a single group to organize preloading of media resources in your application.

Connector visual programming block

connector (slot-based)

This puzzle facilitates connecting other puzzles with each other, to make them more convenient to move, delete, comment, and use in the Library.

Connector (slot-based) visual programming block

save state

Saves the state of specified objects and/or the values of variables specified by their names. The objects are cloned and stored in memory. The values of the variables are retrieved and stored in memory for each specified variable name.

Save state visual programming block

If this puzzle is called several times, the states are saved in sequence so that it is possible to return to any previous state with the undo state puzzle.

undo state

Restores the state of objects and/or variables saved with the save state puzzle.

Undo state visual programming block

If this puzzle is called several times, the states are restored from the saved sequence (if any) which makes it possible to return to any previously saved state from the stack. Sometimes you need to catch the situation when there is no saved state present in the undo history, e.g to make changes in the UI. For that, use the state counter variable:

Save/undo state example

all variable names

Returns a list with the names of all variables used in Puzzles.

Visual programming block to get all variables

variable value by name

Returns the value of a variable specified by its name. This puzzle works similarly to the standard variable value puzzle, yet does not require to select a variable from the predefined dropdown menu.

Visual programming block to get variable by name

JavaScript object

Returns a given JavaScript object.

Visual programming block to work with JavaScript objects

You can get the following JavaScript objects with this puzzle:

window
Return the top-level window object as dictionary value.
arguments
Returns the list of arguments of the currently executed function. Can be used to get arguments of Puzzles procedures or additional arguments passed to internal Puzzles callbacks (see below).
this
JavaScript this value.

The arguments option can be used to retrieve additional puzzles options. For example, when using when clicked puzzle, you can get the internal JavaScript event which triggers the puzzle logic using the first argument of the callback executed behind the do slot. In the example below we use this event to get X and Y coordinates of the mouse pointer:

Working with JavaScript objects

The following puzzles support advanced options:

wait promise

Wait for the promise to be resolved or rejected and return its value (or rejection reason) in the promise value puzzle.

Wait promise visual programming block

This puzzle may be required to get value of the export to gltf and generate normal map puzzles. Being async puzzles by their nature, these puzzle do not return resolved values immediately. Instead, they return promise values which are resolved in the puzzles they are used as inputs. In some rare cases, however, this resolving does not happen. In these cases you should use wait promise to resolve promise values.

promise value

Resolved promise value (in case of resolved promise) or error string (in case of rejected promise).

get procedure

This puzzle can be used to obtain a procedure defined in Puzzles. The returned value can be assigned to a variable or passed into another procedure as a parameter and then executed later via the call procedure puzzle.

Get procedure visual programming block

call procedure

Executes Puzzles' procedure obtained through the get procedure puzzle. Optionally passes parameters to be used as procedure arguments. There are 2 variants of the "call procedure" puzzle - with and without a return value.

Call procedure visual programming block

add event listener

Adds a listener to the specified event type, i.e. executes Puzzles' procedure obtained through the get procedure puzzle when the specified event type is raised.

Visual programming block to add event listeners

remove event listener

Removes listener from the specified event type, i.e. removes given procedure from the event type listener.

Visual programming block to remove event listeners

dispatch event

Trigger an event of the specified type. Optionally passes parameters to be used as procedure arguments (i.e. the same arguments for each procedure).

Visual programming block to dispatch events

Having Troubles with Puzzles?

Seek help on the forums!