Questions tagged [google-blockly]

Google Blockly is a JavaScript library for building visual programming editors. It adds an editor to your app that represents coding concepts as interlocking blocks. It outputs syntactically correct code in the programming language of your choice. It is an open-source project developed and maintained by the google team. Use this tag for questions regarding the implementation of this library or extending the functionality of this library.

Google's Blockly is a web-based, visual programming editor. Users can drag blocks together to build programs. All code is free and open source.

The Blockly library adds an editor to your app that represents coding concepts as interlocking blocks. It outputs syntactically correct code in the programming language of your choice. Custom blocks may be created to connect to your own application.

Blockly is being used by hundreds of projects, most of them educational: Blockly Games, App Inventor, Microsoft MakeCode, Ozo Blockly, micro bit, etc.

Important links

Standard lockup

enter image description here

72 questions
1
vote
1 answer

Blockly - How to alter the generated JavaScript code of the "Change Variable by..." block

I am working on a Blockly Project in which I am passing data from the blocks as JavaScript code. I would like to alter some of the code that is output from the blocks to be a bit more beginner-friendly. It is possible to alter the output JS code…
1
vote
1 answer

Blockly replace sprites path

I am using blockly to create my program. I have blockly downloaded from this github location, and I'm trying to replace blockly images path from this location: https://blockly-demo.appspot.com/static/media/sprites.png to this (relative) location:…
user11955706
1
vote
0 answers

block restoring in blockly

I am trying to restore or generate a block with the XML code on a button click and set it to my workplace. But it does not work properly, somehow it ain't showing nothing. Help will be appreciated. I have tried the following…
Sakhawat Hossain
  • 454
  • 8
  • 23
1
vote
0 answers

Implement Google-Blockly's Block Factory in Angular Project

I want to Implement Block Factory in my Angular Project to create blocks that can be used in my work-space. The link for the block factory demo and github repository are…
Sohel Ahmed
  • 149
  • 2
  • 11
1
vote
0 answers

How dependency injection work in Angular Library

I have created a library using angular, where i have included Blockly library. When i packed my library as .tgz file and installed in another application , here iam not able to access blockly,i need to install blockly again and give reference in…
Sethuraman
  • 654
  • 6
  • 15
1
vote
1 answer

How to get blockly to see a variable's value at runtime instead of what it was when it was added

We're using blockly to control a phaser game and this is set up so that if statements can be made with custom variables from the game, e.g. the speed or direction of an element within the game. The problem we've got is that blockly reads the values…
Rachel
  • 25
  • 8
1
vote
2 answers

How to get latest blockly version on node

I have installed Blockly on Node using the following command npm install blockly it got installed, but its older version 1.0.0 published on 2016. How will i get new latest version of blockly on Node. Please any one post what to do or how to…
Sethuraman
  • 654
  • 6
  • 15
1
vote
2 answers

How do you check what toolbox tab is currently open?

Can you know which tab is currently opened in the blockly toolbox? If so, can anyone show me an example or code snippet?
Timo Herngreen
  • 112
  • 1
  • 9
1
vote
0 answers

Including both Accessible and Standard Blockly

I've been looking over the Accessible Blockly documentation, but I've been having some trouble figuring out exactly how I would do this. We have a React-based app which uses various Blockly workspaces (with a variety of custom blocks and fields).…
Amber B.
  • 1,134
  • 10
  • 20
1
vote
1 answer

What's the event of blockly structure change?

I have a web app that include blockly and I want to be able to save the structure user created on blockly on backend db. I just want to know how to get the current workspace structure so I can post it to server to save it. and then load it again…
1
vote
0 answers

add image for dropdown in blockly

I am developing blockly and I need a dropdown which use image instead of text. My code is like this. Blockly.Blocks['image_dropdown_test']={ init: function(){ var options = [ [{'src': 'canada.svg', 'width': 50, 'height': 25,…
ZhangJoker
  • 11
  • 2
0
votes
0 answers

Why do Blocks in Blockly losing CSS and looking bad

I'm using Blockly to create a block-based programming interface, but I'm having an issue where the blocks sometimes lose their CSS and end up looking bad. I suspect that some other function in my code is damaging the style, but I can't seem to find…
Sleeper
  • 47
  • 4
0
votes
0 answers

Method to execute JS code securely, with control over starting/stopping and also exposing specific API's to the code

I'm using blockly in my electron app, and I wanted a way to be able to execute the user's code. I originally inserted a script into the HTML with the generated code from my preload file, but I'm not able to stop the code from running, because from…
willbill
  • 80
  • 1
  • 9
0
votes
0 answers

Blockly: Changing the print block to output to div, during code execution and not after completion

The default behaviour is for the print block, in blockly, to output print statements in an alert() and outputs are outputted immediately after the block is executed and before the rest of the blocks (in a stack) are executed. In trying to make the…
sw123456
  • 3,339
  • 1
  • 24
  • 42
0
votes
0 answers

How do I fix Blockly error? I'm trying to make an Roku channel builder

I'm am making an Blockly application that generates brightscript code. How do I fix the Blockly error below. I tried many things, all gave worse results. ProgrammableRokuChannel