Blockly - Blocks collate

177 views
Skip to first unread message

Sreenivas T

unread,
Feb 2, 2018, 1:38:46 PM2/2/18
to Blockly
Hi Guys,

I am new to this group and i am looking for the below details for Blockly API


1. Is there any feature/method in Blockly API which will support Blockly work space on Web UI for collating blockly blocks with mouse right click (For Auto align of all the blocks) ? (As currently we need manually drag each drag and align next to the block. My web UI is not dependent on the blockly block flow) 

2. What are the available attributes which i can inject to Blockly API which will be displayed in HTML code for testers to uniquely identify the each block (For test automation) in my blockly work space. (My current blockly work space is inside the SVG container)

Thanks in advance


Thanks,
Sreenivas

Andrew n marshall

unread,
Feb 2, 2018, 6:57:50 PM2/2/18
to blo...@googlegroups.com

Hi Sreenivas,

Let me see if I can answer your questions.

1. Is there any feature/method in Blockly API which will support Blockly work space on Web UI for collating blockly blocks with mouse right click (For Auto align of all the blocks) ? (As currently we need manually drag each drag and align next to the block. My web UI is not dependent on the blockly block flow) 

We do not have such a feature, but we have components that might be useful to create such a feature.

Blockly.Xml.appendDomToworkspace() is a method that will append a block DOM on the workspace in a manner aligned with the existing blocks. It is not a method we use often, but so it might have some unknown edge cases, but they are probably easy to fix.
Second, Blockly.Xml.blockToDom() will get the XML DOM for a block and all of its descendents.
Finally, workspace.getTopBlocks() will get you a list of all of the blocks directly on the workspace. That is, the one that does not have another block as a parent. It takes a boolean to ensure the list is ordered in the same way as the workspace is serialized.

Maybe you see where I am going with this:
  • Get the ordered list of top blocks.
  • For all but the first top block, capture the XML DOM then remove them from the workspace.
  • Add them back to the workspace using the append method to align them.
I think it would give you the alignment you desire.

 
2. What are the available attributes which i can inject to Blockly API which will be displayed in HTML code for testers to uniquely identify the each block (For test automation) in my blockly work space. (My current blockly work space is inside the SVG container)

Internally, all blocks have an ID. If you are dealing with test files loaded from disk, you can relatively easily assign the IDs with predefined, human readable versions. Just overwrite the id=".." attributes of the <block> elements.

If you need something to be visible in the UI, maybe comments will work for you. You can attach a comment to any block, and it will create a blue question mark on that block.

Again, if I assume you want to identify a specific block from a test file, this is pretty trivial to do in XML:

  <block type="controls_repeat_ext" id="123">
    <comment>id=123</comment>

Voila! Now a tester can easily identify a block in the UI.  Example!

You can also automate the custom comments by using Events, workspace.getAllBlocks(), and block.comment.

With respect to ids, I would be wary of overwriting them at runtime. We've occasionally talked about a developer mode that assigns human readable ids, but never implemented it. That said, the line that assign the block id is pretty straightforward, and getUid() can be replaced with almost anything.


Andrew n marshall

unread,
Feb 5, 2018, 1:39:55 PM2/5/18
to blo...@googlegroups.com

On Fri, Feb 2, 2018 at 3:57 PM, Andrew n marshall <a...@anm.me> wrote:
1. Is there any feature/method in Blockly API which will support Blockly work space on Web UI for collating blockly blocks with mouse right click (For Auto align of all the blocks) ? (As currently we need manually drag each drag and align next to the block. My web UI is not dependent on the blockly block flow) 

We do not have such a feature.

As Rachel pointed out, we do have exactly this method: WorkspaceSvg.cleanUp()

Apologies for the misinformation.







 

Sreenivas T

unread,
Feb 6, 2018, 2:29:31 PM2/6/18
to Blockly






Thank your time and info Andrew. I see cleanUp() is able to order blocks in column but unable to combine each one on other when i add a block without arranging. I need to auto arrange and combine/attach all blocks in column.

Will check if the first approach helps me

Thanks,
Sreenivas 
 

Sreenivas T

unread,
Feb 15, 2018, 2:59:53 PM2/15/18
to Blockly
Is there any other methods which will help to collate the blocks automatically adding/using mouse right click option ?

Andrew n marshall

unread,
Feb 15, 2018, 4:36:44 PM2/15/18
to blo...@googlegroups.com
I'm not sure what you're looking for.

On a normal workspace with two or more blocks, right clicking on the workspace pops up a menu that include "Clean up Blocks". This is what calls the WorkspaceSvg.cleanUp() I mentioned earlier.

--
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+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Sreenivas T

unread,
Feb 16, 2018, 1:47:22 PM2/16/18
to Blockly
Hi Andrew,


I tried the cleanup(), it helps to align to form blocks in single column but not able to auto attach with other blocks to make blockly work space valid. Sorry if my wording is bit confusing.. i had attached screen pic which shows the details.

My application doesn't requires that block to be in proper work flow, it can be random and auto arrange will help a lot for me.



On Friday, 2 February 2018 11:38:46 UTC-7, Sreenivas T wrote:
Tst.JPG

Andrew n marshall

unread,
Feb 20, 2018, 12:02:39 PM2/20/18
to blo...@googlegroups.com
"...auto-attach with other blocks to make blockly workspace valid."

When you say "attach", it sounds like you are talking about connecting blocks to each other, either in the next/previous connections, or the input/output connections. Is that correct?

 We can't automatically determine where to connect blocks in a way that you make your program valid. Blockly know very little about the nature of your program domain and underlying language. You'll need to write some code to identify the proper parent and child and then attach them at the right connections.

--

Sreenivas T

unread,
Feb 20, 2018, 1:25:50 PM2/20/18
to Blockly
Hi Andrew,

Thank you for your response. will look into that
To unsubscribe from this group and stop receiving emails from it, send an email to blockly+u...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages