Download a snaphot/screenshot of the workspace

[Noor HM]

Hello All,

I'm working on my Blockly App via the official npm package, and i was wondering if there's an option to turn off/on the snap mode, where it downloads a screenshot of the blocks added to the workspace.

I've seen this cool feature once in the "advanced playground" demo , and it works fine there, so is there a way i can include that by relaying on the official npm package? 

i'v seen a sample that achieves the same functionality but they used the "@blockly/dev-tools" package, would this be reliable as well or what exactly?

A sample of how the blocks would look like in the screenshot downloaded:

[Mark Friedman]

That sample uses the same code as the advanced playground (i.e. the "@blockly/dev-tools" package), and would be the best way to get that functionality.

-Mark

--
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.
To view this discussion visit https://groups.google.com/d/msgid/blockly/2927d82e-1804-4850-9a57-1028a6251438n%40googlegroups.com.

[Noor HM]

Alright got it, will give this a try,

One more thing, would it be possible to display the XML blocks visually, more like an image or static background, rather than loading them into a fully interactive Blockly workspace? Basically, I want to show the blocks (from XML) as a visual representation (like a wallpaper) without parsing the XML into DOM elements and rendering them inside a functional workspace with toolboxes and controls.  

[Mark Friedman]

I don't believe that there is any way to render an XML representation of blocks other than the usual way of rendering them in a Workspace.  That said, you don't have to show the workspace to your users. You could also have an empty toolbox, provide the minimal Workspace options, make the workspace read-only, etc.

Hope this helps.

-Mark

To view this discussion visit https://groups.google.com/d/msgid/blockly/92feb96f-6014-4c69-aec2-dfbf84c16b7dn%40googlegroups.com.

[Noor Alhamoud]

Yup this is what i meant with the xml "representation" which is just rendering them in a workspace, i managed to get my logic to work (turning the rendered XML to svg via putting it in a minimal workspace and turning that one to svg), but they are turning out like this, what could be the reason?
P.S when i try to look for the text inside the blocks, it is there but since the svg is turning black they are not appearing

To view this discussion visit https://groups.google.com/d/msgid/blockly/CAOk7GcQNcbkXJH%3Dx229UH8qL9tR9avZ6H2XnSEyP%2BwHoh4Lr%3Dw%40mail.gmail.com.

[Mark Friedman]

That looks like a CSS issue to me.  I'm not a CSS expert, so maybe someone else can chime in here on what might be causing the issue.  In case it helps, here is the source code for the downloadWorkspaceScreenshot function that I assume you are calling.

-Mark

To view this discussion visit https://groups.google.com/d/msgid/blockly/CAKvyzG%3Dds-CNQwB%2BqsKbjwLNHqH%3DNiA1kJP5OQm0uzjoGmOEZA%40mail.gmail.com.

[ewpa...@gmail.com]

I recall seeing something similar when we were implementing block export for App Inventor. You can take a look at our implementation, and in particular in svgAsDataUri you can see where we copy the CSS.

Regards,

Evan