`clip_8`

What you see is what you compute.

Demos, for a first impression.

Workflow example session PDF (PDF) for a very first impression, START HERE!

clip_8 is probably best described as a visual virtual machine operating on inline SVG in the browser's DOM.

Instructions and data are implemented as graphical SVG elements.
Graphics elements are visible to humans, just as any other SVG graphics in a web page.
clip_8 interprets them as instructions of a purely visual programming language.
The programmer can observe the entire machine state during program execution.

How it works

The programs can be drawn in vector graphics editors which support SVG output.

clip_8 interprets the SVG image:

Decode the arrangement of circles, lines, rectangles, paths, polygones as instructions, control flow, and data.
Execute one instruction after the other.

a) Instructions manipulate the data elements, i.e. cut, align, resize, or move them.

b) Control flow, defines the order of instructions, alternatives etc.

Why?

clip_8 was designed as a visual thought experiment.

On visuelle-maschine.de you will find more technical projects with a strong commitment on visual experimentation.

Getting Started

Tutorial, learn the language and the tricks.

For recent user information please check the Tutorial and Getting Started Issues.

Klippen, try clip_8 online (no installation required).

Browser compatibility

An experimental Web Assembly module uses ncollide to retrieve rectangles based on their location.
Tested in Chrome, Firefox
Credits go to Andrew Hobden, whose article The Path to Rust on the Web helped a lot in getting Rust and JavaScript to talk to each other.

To run on a local machine, please use a local http server, e.g.:

python -m http.server

Tests / Language documentation

The integration tests are provided in Reference Test Sheets which serve as language reference, simultaneously.

Building

If you want to make changes to clip_8 yourself you might need to do some or all of the following:

Note: These steps are not necessary for using clip_8 online via Klippen.

build the web assembly module

For the wasm modules use make in the rs directory.

build html pages

If you wand to make changes to the demos, tutorials, or tests, the html pages will need a rebuild. Python scripts in bin support these steps:

Build Demos: python svg2demo.py

Build the Tutorials: python buildTutorial.py

Build the Reference Test Sheets: python svg2refsheet.py

Dependencies

Python-Markdown: pip install Markdown or python -m pip install Markdown
tinycss pip install tinycss or python -m pip install tinycss
The utilities in PyBroeModules are currently available as a github project, only. You can clone the project and copy/link the project directory in your local python site-packages.

Copyright

License

The source code of the Clip_8 interpreter (primarily *.js files), the related page generators (primarily *.py files), and other portions of the distribution not explicitly licensed otherwise, are licensed under the GNU GENERAL PUBLIC LICENSE -- see the LICENSE-GPL file in this directory for details.
Except for the graphical language reference, demos and graphics (primarily *.svg, *.pdf, *.jpg, *.png files) not explicitly licensed otherwise are licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License -- see LICENSE-CC-BY-NC-SA file in this directory for details.
The graphical language reference in the refsheet-svg and tests directories as well as the tutorial in the tutorial directory are explicitly excluded from the above creative commons license statement. You may use them as they are published by the author for reference and testing purposes. Please contact the author if you wish to make changes or redistribute any of these files.

broesamle/clip_8

clip_8