spill

a brand new live coding language that doesn’t exist yet.

see the emerging engine at pastagang.codeberg.page/spill.

run this repo

this repo is a full-screen example of spill.

try it locally by running it as a file server.

i like to use deno's file server to do this but you can use any. for example... if you have node, you can run npx serve from your terminal.

the spill language

omg it's work in progress! there's gonna be a text editor in front of the world! you will be able to type spill into it!

the spill library

under the hood, the spill language uses the spill library to do things. you can also use the spill library directly, if you want.

use the spill library

add spill.js to your project and use the createSpill function.

import { createSpill } from "spill.js";
const spill = createSpill();

to actually see the spill, you need to add the spill's element to somewhere in your document.

document.body.append(spill.element);

now you can do things with the spill. let's draw a pink dot in the center of the world.

import { setCellAppearanceAtScreenPosition } from "spill.js";
setCellAppearanceAtScreenPosition(
 spill,
 { x: 0.5, y: 0.5 },
 { colour: { red: 255, green: 0, blue: 255, alpha: 255 } }
);

you can get the things to happen on their own by adding behaviours. let's make a behaviour that increases the brightness of each cell.

function BrightenBehaviour(_spill, cell) {
 const { colour } = cell.appearance;
 setCellAppearance(cell, {
 colour: {
 red: colour.red + 10,
 green: colour.green + 10,
 blue: colour.blue + 10,
 alpha: colour.alpha,
 },
 });
}

use the behaviour by passing it to the createSpill function when you run it.

const spill = createSpill({
 behaviours: [BrightenBehaviour],
});

to find out all the available functions from spill, try exporting everything into a single object. then you can use your editor's autocomplete to see everything.

import * as Spill from "spill.js";
Spill.setWorldToFill(
 spill,
 { width: 100, height: 100 },
 { colour: { red: 255, green: 0, blue: 0, alpha: 255 } }
);

history

spill started as jam-written documentation for an imaginary language. it's out of date now but you can read it here.