> 
 > 
4. Blocks Coding with Web App
Task
Task

The documentation covers methods for managing time-based tasks, including scheduling actions, breaking off tasks, and terminating actions using signals.

Doing Tasks After a Few Seconds

Run after ms with abort control

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><block type=\"Task_runAfter\"><value name=\"ms\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow></value></block></xml>"}

This block is used to do some actions after a few milliseconds and then stop the action immediately.

Parameters:

  • Condition: Number (Default: 0)
  • Task

Output: N/A
Sample code:

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><variables><variable>mainLayout</variable><variable>mainScreen</variable></variables><block type=\"pxt-on-start\" x=\"0\" y=\"0\"><statement name=\"HANDLER\"><block type=\"variables_set\"><field name=\"VAR\">mainLayout</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"ScreenItem_createLayout\"/></value><next><block type=\"variables_set\"><field name=\"VAR\">mainScreen</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Screen_create\"><value name=\"label\"><shadow type=\"text\"><field name=\"TEXT\">Main</field></shadow></value><value name=\"layout\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value></block></value><next><block type=\"Task_runAfter\"><value name=\"ms\"><shadow type=\"math_number\"><field name=\"NUM\">5000</field></shadow></value><value name=\"abortSignal\"><block type=\"Task_createAbortControl\"/></value><statement name=\"HANDLER\"><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">After 5 seconds, it will show this message.</field></shadow></value></block></value></block></statement></block></next></block></next></block></statement></block></xml>"}

Before 5 second, the output: 

Run after ms with abort control - Before Output

After 5 second, the output: 

Run after ms with ms control - After Output

Breaking Off a Few Second

Pause ms

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><block type=\"Task_sleep\"><value name=\"ms\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow></value></block></xml>"}

This block is used to stop some actions. 

Parameters: Condition: Number (Default: 0)
Output: N/A
Sample code:

1000ms means 1 second. 

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><variables><variable>mainLayout</variable><variable>mainScreen</variable></variables><block type=\"pxt-on-start\" x=\"0\" y=\"0\"><statement name=\"HANDLER\"><block type=\"variables_set\"><field name=\"VAR\">mainLayout</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"ScreenItem_createLayout\"/></value><next><block type=\"variables_set\"><field name=\"VAR\">mainScreen</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Screen_create\"><value name=\"label\"><shadow type=\"text\"><field name=\"TEXT\">Main</field></shadow></value><value name=\"layout\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value></block></value><next><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">Before 1 second.</field></shadow></value></block></value><next><block type=\"Task_sleep\"><value name=\"ms\"><shadow type=\"math_number\"><field name=\"NUM\">1000</field></shadow></value><next><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">After 1 second.</field></shadow></value></block></value></block></next></block></next></block></next></block></next></block></statement></block></xml>"}

Before 1000ms, the output:

Pause ms - Before Output

After 1000ms, the output:

Pause ms - After Output

Terminate the Action

Create abort control

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><block type=\"Task_createAbortControl\"/></xml>"}

This block is used to terminate some actions. 

Parameters: N/A
Output: Abort Control
Sample code:

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><variables><variable>mainLayout</variable><variable>mainScreen</variable><variable>imageModel</variable><variable>cameraControl</variable><variable>selectedCameras</variable><variable>recentlySelectedCameras</variable><variable>recentlyUnselectedCameras</variable><variable>value2</variable><variable>abortControl</variable><variable>result</variable></variables><block type=\"pxt-on-start\" x=\"0\" y=\"0\"><statement name=\"HANDLER\"><block type=\"variables_set\"><field name=\"VAR\">mainLayout</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"ScreenItem_createLayout\"/></value><next><block type=\"variables_set\"><field name=\"VAR\">mainScreen</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Screen_create\"><value name=\"label\"><shadow type=\"text\"><field name=\"TEXT\">Main</field></shadow></value><value name=\"layout\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value></block></value><next><block type=\"variables_set\"><field name=\"VAR\">imageModel</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"TeachableMachine_loadImageModel\"><value name=\"baseUrl\"><shadow type=\"text\"><field name=\"TEXT\">https://teachablemachine.withgoogle.com/models/tghdF3FXI/</field></shadow></value></block></value><next><block type=\"Camera_enableCameraFeature\"><value name=\"enable\"><shadow type=\"logic_boolean\"><field name=\"BOOL\">TRUE</field></shadow></value><next><block type=\"variables_set\"><field name=\"VAR\">cameraControl</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Camera_getCameraControl\"/></value><next><block type=\"Control_OptionList_setMultiple\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">cameraControl</field></block></value><value name=\"isMultiple\"><shadow type=\"logic_boolean\"><field name=\"BOOL\">TRUE</field></shadow></value><next><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"variables_get\"><field name=\"VAR\">cameraControl</field></block></value><next><block type=\"Camera_setOnCameraControlChanged\"><value name=\"HANDLER_DRAG_PARAM_selectedCameras\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">selectedCameras</field></shadow></value><value name=\"HANDLER_DRAG_PARAM_recentlySelectedCameras\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">recentlySelectedCameras</field></shadow></value><value name=\"HANDLER_DRAG_PARAM_recentlyUnselectedCameras\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">recentlyUnselectedCameras</field></shadow></value><statement name=\"HANDLER\"><block type=\"pxt_controls_for_of\"><value name=\"VAR\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">value2</field></shadow></value><value name=\"LIST\"><block type=\"variables_get\"><field name=\"VAR\">recentlySelectedCameras</field></block></value><statement name=\"DO\"><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"variables_get\"><field name=\"VAR\">value2</field></block></value><next><block type=\"TeachableMachine_ImageModel_continuouslyPredict\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">imageModel</field></block></value><value name=\"video\"><block type=\"variables_get\"><field name=\"VAR\">value2</field></block></value><value name=\"abortControl\"><block type=\"variables_get\"><field name=\"VAR\">abortControl</field></block></value><value name=\"HANDLER_DRAG_PARAM_result\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">result</field></shadow></value><statement name=\"HANDLER\"><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">This is example of Json Value result:</field></shadow></value></block></value><next><block type=\"Task_AbortControl_abort\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">abortControl</field></block></value><next><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><block type=\"Json_JsonValue_stringify\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"0\" _input_init=\"false\"></mutation><value name=\"jsonValue\"><block type=\"TeachableMachine_ImagePredictionResult_getResultAsJsonValue\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">result</field></block></value></block></value></block></value></block></value></block></next></block></next></block></statement></block></next></block></statement></block></statement><next><block type=\"variables_set\"><field name=\"VAR\">abortControl</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Task_createAbortControl\"/></value></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></statement></block></xml>"}

Before 1 second, the output:

Create abort control - Before Output

After 1 second, the output:

Create Abort control - After Output

Sending Signal to Terminate the Action

Abort Control send abort signal

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><block type=\"Task_AbortControl_abort\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">abortControl</field></block></value></block></xml>"}

This block is used to send the signal to terminate the action and prevent infinite loop. 

Parameters: Abort Control
Output: N/A 
Sample code:

{"blocks":"<xml xmlns=\"https://developers.google.com/blockly/xml\"><variables><variable>mainLayout</variable><variable>mainScreen</variable><variable>imageModel</variable><variable>cameraControl</variable><variable>selectedCameras</variable><variable>recentlySelectedCameras</variable><variable>recentlyUnselectedCameras</variable><variable>value2</variable><variable>abortControl</variable><variable>result</variable></variables><block type=\"pxt-on-start\" x=\"0\" y=\"0\"><statement name=\"HANDLER\"><block type=\"variables_set\"><field name=\"VAR\">mainLayout</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"ScreenItem_createLayout\"/></value><next><block type=\"variables_set\"><field name=\"VAR\">mainScreen</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Screen_create\"><value name=\"label\"><shadow type=\"text\"><field name=\"TEXT\">Main</field></shadow></value><value name=\"layout\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value></block></value><next><block type=\"variables_set\"><field name=\"VAR\">imageModel</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"TeachableMachine_loadImageModel\"><value name=\"baseUrl\"><shadow type=\"text\"><field name=\"TEXT\">https://teachablemachine.withgoogle.com/models/tghdF3FXI/</field></shadow></value></block></value><next><block type=\"Camera_enableCameraFeature\"><value name=\"enable\"><shadow type=\"logic_boolean\"><field name=\"BOOL\">TRUE</field></shadow></value><next><block type=\"variables_set\"><field name=\"VAR\">cameraControl</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Camera_getCameraControl\"/></value><next><block type=\"Control_OptionList_setMultiple\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">cameraControl</field></block></value><value name=\"isMultiple\"><shadow type=\"logic_boolean\"><field name=\"BOOL\">TRUE</field></shadow></value><next><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"variables_get\"><field name=\"VAR\">cameraControl</field></block></value><next><block type=\"Camera_setOnCameraControlChanged\"><value name=\"HANDLER_DRAG_PARAM_selectedCameras\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">selectedCameras</field></shadow></value><value name=\"HANDLER_DRAG_PARAM_recentlySelectedCameras\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">recentlySelectedCameras</field></shadow></value><value name=\"HANDLER_DRAG_PARAM_recentlyUnselectedCameras\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">recentlyUnselectedCameras</field></shadow></value><statement name=\"HANDLER\"><block type=\"pxt_controls_for_of\"><value name=\"VAR\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">value2</field></shadow></value><value name=\"LIST\"><block type=\"variables_get\"><field name=\"VAR\">recentlySelectedCameras</field></block></value><statement name=\"DO\"><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"variables_get\"><field name=\"VAR\">value2</field></block></value><next><block type=\"TeachableMachine_ImageModel_continuouslyPredict\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">imageModel</field></block></value><value name=\"video\"><block type=\"variables_get\"><field name=\"VAR\">value2</field></block></value><value name=\"abortControl\"><block type=\"variables_get\"><field name=\"VAR\">abortControl</field></block></value><value name=\"HANDLER_DRAG_PARAM_result\"><shadow type=\"variables_get_reporter\"><field name=\"VAR\">result</field></shadow></value><statement name=\"HANDLER\"><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">This is example of Json Value result:</field></shadow></value></block></value><next><block type=\"Task_AbortControl_abort\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">abortControl</field></block></value><next><block type=\"ScreenItem_Layout_add\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">mainLayout</field></block></value><value name=\"item\"><block type=\"Control_createTextBlock\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"1\" _input_init=\"true\"></mutation><value name=\"text\"><block type=\"Json_JsonValue_stringify\"><mutation xmlns=\"http://www.w3.org/1999/xhtml\" _expanded=\"0\" _input_init=\"false\"></mutation><value name=\"jsonValue\"><block type=\"TeachableMachine_ImagePredictionResult_getResultAsJsonValue\"><value name=\"this\"><block type=\"variables_get\"><field name=\"VAR\">result</field></block></value></block></value></block></value></block></value></block></next></block></next></block></statement></block></next></block></statement></block></statement><next><block type=\"variables_set\"><field name=\"VAR\">abortControl</field><value name=\"VALUE\"><shadow type=\"math_number\"><field name=\"NUM\">0</field></shadow><block type=\"Task_createAbortControl\"/></value></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></next></block></statement></block></xml>"}

This case will prevent the infinite loop when showing the text below, the output: 

Abort Control send abort signal - Output

Table of Content