<kwc-blockly>

[WIP] Reusable code editor based on Blockly that powers Kano Code

• What is it called?
  • kwc-blockly
• What is it made out of?
  • Polymer wrapper for a blockly instance. Uses a customized blockly and adds some features like the onibox
• What variants are needed?
  • [TBD]
• How does it scale?
  • Not targeted to small screens
• What style variables are in use?
  • General colors (background, text colors)

Installation

Clone this repository. Run bower i

Usage

Blockly is installed under blockly_built, You will have to import the blockly library yourself as you can choose the compressed or uncompressed version and you can also choose the generators and language you want to use.

Create a HTML file to import the javascript from blockly_built, as it will deduplicate the import of these scripts:

<script src="/bower_components/kwc-blockly/blockly_built/blockly_compressed.js"></script>
<script src="/bower_components/kwc-blockly/blockly_built/blocks_compressed.js"></script>
<script src="/bower_components/kwc-blockly/blockly_built/msg/js/en.js"></script>
<script src="/bower_components/kwc-blockly/blockly_built/javascript_compressed.js"></script>
<link rel="import" href="/bower_components/kwc-blockly/kwc-blockly.html">

Then use this file to import <kwc-blockly> Wherever you want to use it

Install the Polymer-CLI

First, make sure you have the Polymer CLI installed. Then run polymer serve to serve your element locally.

Viewing Your Element

$ polymer serve

Running Tests

$ polymer test --skip-plugin junit-reporter

Your application is already set up to be tested via web-component-tester. Run polymer test to run your application's test suite locally.

Building blockly

blockly and the closure-library from Google are submodules of this repository. This way, we keep a reference to the sources, and apply our changes on top of it.

To rebuild with patches applied, just run the build_blockly.sh script. It will copy the blockly sources, apply the patches from blockly_patches, rebuild blockly and export this into the blockly_built folder.

To update to a newer version of blockly, run git submodule update --remote to grab the latest changes from blockly and then rebuild with build_blockly.sh. This can and will most likely BREAK things as the patches rely on blockly's internal API to enhance it. Getting a newer version can lead to some work to adapt the changes.