Injecting Variables into a workspace

[Vivek Kb]

Hi, I have just started using Blockly and have integrated with my html web page.

I have a set of variables in my database which I need to  bring into the workspace in order to make user create blocks using them.

Is there a way in which I can populate a set of variables from a database into my  current Blockly workspace?

[kushal bhattacharya]

Could you please elaborate as to how you will be using the variables from database ?

[Amber B]

Try something like this:

var createVariables = ['variable_one', 'variable_two', 'variable_three'];
var workspace_ = Blockly.inject('my-workspace-id', options);


Blockly.JavaScript.variableDB_.setVariableMap(workspace_.getVariableMap());


createVariables.forEach(function(varName) {
    workspace_.createVariable(varName);
});

Of note is that this will automatically generate its own variable IDs. For your purposes this is probably fine, but for other purposes, you may want to specify the variable ID parameter. Likewise, this doesn't include variable types, but you could specify those by changing the createVariables array to be an array of objects with the varName and varType (as well as varId if desired) and then just pass those into createVariable. Likewise, if you need access to those variables later, you can change the forEach loop to a map loop which returns the result of createVariable and then use that array later. You can see more documentation on createVariable here.

Depending on how you intend to set the variable values, you may need to get a bit creative when generating code to prevent the automatic variable definition at the top from occurring. If you're stuck on this step, let me know and I'll dig up an example of where we did just that in order to give you a pointer.

[Vivek Kb]

Hi,

I am not able to call the function setVariableMap as it says function variableDB does not exist.

This is the error I'm getting ->  Uncaught TypeError: Cannot read property 'setVariableMap' of undefined

This is my code -

var workspace = Blockly.inject('blocklyDiv',

{media: '../../media/',

toolbox: document.getElementById('toolbox')});

var createVariables = ['variable_one', 'variable_two', 'variable_three'];

Blockly.JavaScript.variableDB_.setVariableMap(workspace.getVariableMap());

createVariables.forEach(function(varName) {

console.log('name -' + varName);

workspace.createVariable(varName);

});

On Wed, Feb 6, 2019 at 7:46 PM Amber B <abla...@citizendeveloper.com> wrote:

This message is eligible for Automatic Cleanup! (abla...@citizendeveloper.com) Add cleanup rule | More info

--
You received this message because you are subscribed to the Google Groups "Blockly" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Vivek Kb]

Yes the function 'Blockly.Javascript.variableDB_' is defined in the javascript.js file that is imported

On Wednesday, February 6, 2019 at 4:52:28 PM UTC+5:30, Vivek Kb wrote:

[Vivek Kb]

It is not present in the Blockly.Javascript object when i tried on the console ,

However it is present in the javascript_compressed.js file,

On Wednesday, February 6, 2019 at 4:52:28 PM UTC+5:30, Vivek Kb wrote:

[Vivek Kb]

The compressed version of the file. Is there something wrong with that?

On Wednesday, February 6, 2019 at 4:52:28 PM UTC+5:30, Vivek Kb wrote:

[kushal bhattacharya]

var createVariables = ['variable_one', 'variable_two', 'variable_three'];

 

 

 

createVariables.forEach(function(varName) {

                    console.log('name -' + varName);

                    workspace.createVariable(varName);

                  });

Use this code.This is creating variables in the variable category.No need to pass the rest of the code above posted earlier

 

[Vivek Kb]

I included the uncompressed version of the file.

When i print the object it is not present in it.

On Wednesday, February 6, 2019 at 4:52:28 PM UTC+5:30, Vivek Kb wrote:

[kushal bhattacharya]

use the updated code i posted above.

var createVariables = ['variable_one', 'variable_two', 'variable_three'];

createVariables.forEach(function(varName) {

                    console.log('name -' + varName);

                    workspace.createVariable(varName);

                  });

[kushal bhattacharya]

When i use this code i get :-

[kushal bhattacharya]

the behaviour you are getting is the obvious and correct one.Since you haven't yet called the init method of the generator object.

So 'Blockly.JavaScript.variableDB_' hasn't been instatiated yet.

[Vivek Kb]

Thanks a lot Kushal:) This worked perfectly.

On Wednesday, February 6, 2019 at 4:52:28 PM UTC+5:30, Vivek Kb wrote:

[Amber B]

Oops, sorry about that confusion -- I based that code off of a similar setup we have where that line is necessary and missed removing it. Glad you got it figured out! Thanks, Kushal!

[kushal bhattacharya]

most welcome :)

[Madhumati hosamani]

Hi Amber, Can we make same variable visible across workspace ?

[Amber B]

Do you mean having them sync up such that adding/deleting a variable to/from one workspace affects the other instantaneously, or?

[Madhumati hosamani]

yes Amber.. Can we achieve that ?

[Amber B]

Oof, that would be a tough one... the way we set it up involved populating variables when a workspace loaded, not totally syncing them. I think you might be able to set up both workspaces with the same variable map in order to do this? Otherwise, you'd have to add event listeners on both workspaces and ensure that creating, deleting or renaming a variable on one did it on the other.

[Madhumati hosamani]

Thank you Amber. 

at present I solved this by maintaining variable map globally available for all the workspace and creating and deleting them on load for each workspace.

while creating variable, it takes workspace as one of the parameter. can we not set multiple workspace for variable ?

[Amber B]

I don't believe that we can set multiple workspaces for variables, unfortunately... you'd need to file a feature request or pull request with the changes on the Blockly project on git