BBlocks is lightweight, flexible, simplist and hackable graphical library for building GUIs based on SVG components. This project is mainly inspired in Blockly and Snap-BYOB awesome projects.

The main idea is make a graphical library with some advanced features for use in a block editor, but can be used in anything. The goal is construct an advanced visual programming editor in top of this project. The editor should be able to be used in production, either individually or as embedded editor, see the BB editor project.

A [live demo][livedemo]. [livedemo]: https://carloslfu.github.io/BBlocks.js/demos/basic/demo.html

• SVG based (uses SVG.js).
• All is nestable.
• Zoomable, resizable and pannabble workspaces.
• Touch Gestures support (uses polymer-gestures).

• Workspace.
• Block (An abstraction similar to Blockly and Snap blocks).
• Field.

• Basic Workspace: resize box, drag box and some styles.

• Svg.
• Button.
• Text.
• Text input.

Some examples and test blocks:

• test: Simple block with a text field.
• test_dev: Block with an animation.
• example: Block with many fields.

See the demos folder. All documentation is in construction... (github wiki coming soon). Visit the BBlocks group for get some feedback.

• Interaction between objects (Workspaces, blocks ...).
• Menu component.
• Dropdown field.
• SVG contextmenu.
• Multiple blocks selection.
• SVG textarea input field.
• Pugins API.
• Styling API.

Last year I learned a lot about web development. I developed web applications with fascinating and very promising technologies. My aim now is to apply this knowledge in the project, build a simple and powerful tool that meets all the objectives of this project. It will simplify their development and much of the complexity associated to the construction of this tool.

This will be done in a new branch and when it has the same functionality of the current branch will replace the master. Here are some advances in architecture to be implemented:

• Architecture: cycle
• Developer experience: cycle-time-travel
• Packaging tools: webpack

Feel free to suggest anything or submit a pull request. Visit the contributing page and the documentation page.

Board on trello BBlocks.