Scratchblocks Test

This is a test page for scratchblocks integration.

Basic Example

Code:

when flag clicked
move (10) steps

Example with Variables

Code:

when flag clicked
set [counter v] to (0)
forever
  change [counter v] by (1)
  say (counter)
  wait (1) seconds
end

Example with Conditionals

Code:

when flag clicked
forever
  if <key [space v] pressed?> then
    play sound [pop v]
    wait (0.5) seconds
  end
end

Example with Multiple Blocks

Code:

when flag clicked
clear
forever
  pen down
  if <touching [mouse-pointer v]?> then
    switch costume to [button v]
  else
    add (x position) to [list v]
  end
  move (10) steps
  turn ccw (9) degrees
end

How it works

The ScratchblocksRenderer component dynamically loads the scratchblocks npm package on the client and uses its parse/render APIs to turn the provided code prop into Scratch-style block visuals.