Last updated:

Script Canvas I#

Script Canvas is the central working area of the visual builder where automation logic is constructed. It displays script components as blocks on an interactive canvas and provides access to the components panel, script settings, quick commands, and utility tools.

Location: access the section through the left navigation panel, item “Scripts”.

Available actions:

  • view and edit script blocks on the canvas
  • add components through the “Components Panel”
  • switch between script windows
  • enable or disable screen capture protection
  • view and modify the script’s basic parameters
  • open a list of quick commands
  • change the color of selected components on the canvas

Components Panel#

The Components Panel is used to add new blocks to the script. It is located to the left of the canvas and contains all available components grouped by categories.

To add a component, find the required element in the “Components Panel” and drag it onto the canvas. After placement, the component appears on the canvas as a separate block ready for configuration.

Icon “Change window”#

The Icon “Change window” is used to navigate between several active Afina windows. The icon is located in the top right corner of the builder.

How to switch windows:

  1. Click Change window in the top right corner of the canvas.
  2. Select the required script window from the list.

After selection, the canvas switches to the selected window.

Icon “Enable screen capture protection”#

The Icon “Enable screen capture protection” allows blocking screen recording and broadcasting of the builder window by external programs. The protection icon is located in the top right corner of the canvas.

How to enable protection:

  1. Click Enable screen capture protection in the top right corner.
  2. In the “Enable Screen Recording Protection?” window, review the action description.
  3. Click Close to close the window without changes, or confirm activation.

After activation, the builder window will appear as a black screen in most recording and broadcasting programs.

Screen capture protection may affect taking screenshots and streaming. Disable it if you need to capture canvas content.

Script settings window#

The script settings window contains the main settings of the current script. The settings icon is located in the top right corner of the canvas next to other utility buttons.

Click the script settings icon to open the settings window for the current script. The window displays key script parameters that define its behavior during execution: tab closing, browser closing, execution mode, tags, and extra launch arguments.

Quick commands#

Quick commands are a list of hotkeys available in the visual builder. The window opens through the corresponding icon in the top right corner of the canvas.

The list contains shortcuts for saving the script, searching for an element, selecting all components in the workspace, undoing and redoing actions, copying, pasting, and aligning selected components on the canvas.

Window “Settings”#

The Window “Settings” allows adding input fields displayed during script execution. It opens through the Settings icon in the top right corner.

How to use:

  1. Click Settings in the top menu of the builder.
  2. Add the required fields: Add Input, Add Select, or Add Checkbox.
  3. Drag the fields to change their order in the list.
  4. Click Save.

After saving, the form fields become available during script execution and allow passing variable values without editing the script itself.

Icon “Refresh all data”#

The Icon “Refresh all data” is a utility action that reloads the current script state from the database. The refresh icon is located in the top right corner of the canvas.

How to refresh data:

  1. Click Refresh all data.
  2. In the confirmation window, click Confirm.

After confirmation, the script reloads with up-to-date data from the database. Unsaved changes on the canvas will be lost.

Before clicking Confirm, ensure all changes are saved. Unsaved script changes will be lost after the refresh.

Icon “Save script”#

The Icon “Save script” is located in the top right corner of the canvas next to other utility buttons.

Click it to save all current script settings. Saving the script regularly while editing helps avoid losing changes.

Color palette#

The Color palette is used for visually marking components on the canvas. It becomes available after selecting one or multiple blocks on the canvas.

How to change component color:

  1. Select one or multiple components on the canvas.
  2. Open the color palette.
  3. Choose the required color from the list of available options.

After selecting a color, the selected components change their color. This helps visually structure script logic and navigate large schemes faster.

Workflow Scenario#

1

Step 1: Open the builder

Go to the “Scripts” section through the left navigation panel and click the name of the required script. The visual builder with the “Components Panel” on the left and the canvas in the center will open.

2

Step 2: Switch the script window

Click “Change window” in the top right corner to view the list of available Afina windows and switch to the required one.

3

Step 3: Check screen protection

If needed, click “Enable screen capture protection” and review the “Enable Screen Recording Protection?” window. Close the window or confirm protection activation.

4

Step 4: Review settings

Click the script settings icon to review the main parameters. Then click the quick commands icon to view the list of builder hotkeys.

5

Step 5: Configure the form

Open “Settings”, add “Add Input”, “Add Select”, or “Add Checkbox” fields, change their order by dragging, and click “Save”.

6

Step 6: Refresh data

Click “Refresh all data” and confirm the action in the confirmation window. The script will reload with up-to-date data from the database.

7

Step 7: Change block colors

Select the required components on the canvas, open the color palette, and choose a color. This helps visually structure script logic.

Table "Folders"Canvas II