Image for post
Image for post

Getting Started with Beta 6

Daz
Daz
May 10, 2016 · 6 min read

Beta 6 is the current version of the Cyril runtime. It’s open source, and available on GitHub. Currently it only builds on OSX, but we’re working hard to change that. You can get pre-built binary for OSX from the GitHub repo release page.

I didn’t pay to join Apple’s developer program (sorry), so you will get a warning if you try to run Cyril:

Image for post
Image for post

To get past this warning you need to double-click/command-click the icon and select “Open” from the drop down menu:

Image for post
Image for post

You will then get a different warning message, which will let you “Open” Cyril…

Image for post
Image for post

You may want to try different beta versions. If you’re interested, more information is available in the GitHub issue queue regarding what’s in each version. I’ll assume you’re using Cyril Beta 6 for this guide.

Press COMMAND + f to go full screen, press COMMAND + q to exit.

When you start Cyril you will see an (almost) blank screen like this. The cursor is up in the top left corner, and in the middle at the top you’ll see the buffer indicators. The current buffer is underlined in white.

Image for post
Image for post

Hello, world!

box

This is an example of an operation called box being run with it’s default parameters. Many operations have a default mode of operation if you don’t provide the values for the options.

The above program is exactly the same as the following program:

box 1, 1, 1

In this example the options are explicitly stated. This draws the same box, with dimensions 1x1x1. I.e. It has a width of 1, a height of 1 and a depth of 1. You can vary the values to produce different size boxes. For example, to draw a taller box, you could run this program:

box 1, 2, 1

What’s Going On?

Moving Things Around

box
move 2, 0, 0
box

Cyril programs start in the center of the screen. This program draws a box there and then moves 2 places to the right and draws another box. You can also rotate the current drawing location as well, for example:

box
rotate 45
box

This program draws a box, then rotates 45 degrees and draws another box. The final instruction to understand in moving around is the scale instruction. This is like a zoom in or zoom out function. It affects many of the other instructions like box and move in that is changes the scale on which they operate. For example, if you draw a box, move right, scale down by 0.5, then draw another box your second box will be half the size:

box
move 1, 0, 0
scale 0.5
box

Basic Animation

Cyril has many ways to animate objects you create. The most basic way to do this is to access the provided variables TIME and FRAME. Assuming you run with the default setting, and your program is not too complex, then your program will get executed once every 1/60th of a second, or 60 times per second.

Each time your program runs you can do something slightly different by making use of the TIME and FRAME variables. These change each time your program runs. The TIME variable stores the number of milliseconds since the program started, and the FRAME variable stores the number of frames that have happened since the program started.

You can use these as options to any of the Cyril instructions. As an example, lets draw a box that gets bigger as time ticks by. As the time variable increases by 1 per millisecond it is going to get big very quickly, so we reduce it’s effect by dividing the number:

scale TIME / 1000
box

Eventually this gets too big to display. How about rotating instead:

rotate TIME / 10
box

See the full language reference for more commands.

Multiple Workspaces

You can hide the text editor by pressing COMMAND + a. This is useful if you want to view the full effect of the visuals you’ve created, or if you’re using an external editor to edit the programs (see below).

To run a program press COMMAND + r. If there are any errors in your program it will fail to run. You’ll see a red indicator, like this…

Image for post
Image for post

Have you made a typo? Are there any extra non-Cyril characters? Did you miss-spell a function or command? Have you got the same number of push and pop operations? Have you got enough ‘end’ commands to match all blocks of code?

If the program looks OK, then Cyril will add it to the running program list and the text buffer indicator will go white, like this…

Image for post
Image for post

Cyril can not detect all possible bugs. You can break things if your program does something crazy like try to loop an infinite number of times.

External Editor

Now What?

It’s early days for Cyril. Join us on Twitter or in the issue queue at GitHub.

You can see a few old example videos on Vimeo. Also, check out Cyril Patterns, a website setup by Cyril user Dan Hett with examples that help learn the basics.

Cyril Live Coding

The Cyril programming language is designed for fast…

 by the author.

Daz

Written by

Daz

Geocities Developer Expert. Keywords: Angular, TypeScript, JavaScript, Cyril Live Coding, Functional Programming

Cyril Live Coding

The Cyril programming language is designed for fast prototyping of visualisations and live coding visuals.

Daz

Written by

Daz

Geocities Developer Expert. Keywords: Angular, TypeScript, JavaScript, Cyril Live Coding, Functional Programming

Cyril Live Coding

The Cyril programming language is designed for fast prototyping of visualisations and live coding visuals.

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store