Home

Getting Started

Scratch Blocks is designed to easily install into any web application. The blocks are 100% client-side, requiring no support from the server. There are no 3rd party dependencies and everything is open source.

Scratch Blocks is based on Google's Blockly project. For a full API reference please see Google's Custom Blocks documentation.

Installation

First, download the source code from GitHub. As this project is quickly being updated we recommend you use git but you are more than welcome to download the code directly as well.

Once you have the code, point your browser at tests/horizontal_playground.html and verify that blocks can be dragged around.

Configuration

Name	Type	Description
horizontalLayout	boolean	If true, uses the horizontal grammar for displaying blocks. Defaults to false.
rtl	boolean	If true, mirror the editor (for Arabic or Hebrew locales). Defaults to false.
media	string	Path from page (or frame) to the Scratch Blocks media directory.
scrollbars	boolean	Sets whether the workspace is scrollable or not. Defaults to true if the toolbox has categories, false otherwise.
sounds	boolean	If false, don't play sounds (e.g. click and delete). Defaults to true.
zoom	object	Configures zooming behavior. See zoom API details.

---

Building

Before sharing with users, we recommend that you build and compress Scratch Blocks. Building requires Python 2 and an internet connection as it uses Google's online Closure Compiler. Once you are ready, you can build by running the following in your console:

python build.py

This will export multiple files including:

blockly_uncompressed_vertical.js
blockly_uncompressed_horizontal.js
blockly_compressed_vertical.js
blockly_compressed_horizontal.js
blocks_compressed.js
msg/js/en.js

These can then be used in your project by updating the HTML of your application:

<script src="blockly_compressed_horizontal.js"></script>
<script src="blocks_compressed.js"></script>
<script src="msg/js/en.js"></script>