Making your first element

This guide shows you how to make your first element in SandPond, using the SpaceTode language.
It is intended for absolute beginners. For more detailed information, please check out the SpaceTode Documentation.
If you get stuck somewhere, or something seems to be going wrong, please check out the Troubleshooting page.
Please let @todepond know if you want any help :)

Download

Download the SandPond engine in one of the following ways:

• Click here to download the SandPond engine, and then extract it.
  -OR-
• Clone the SandPond engine using the GitHub client.
  -OR-
• Clone the SandPond engine in the terminal by typing git clone https://github.com/l2wilson94/SandPond.

Then, find and open index.html in your web browser to check that SandPond is working.

Name

Find and open CustomElements.js in a text editor. It is in the same folder as index.html.
Write element MyFirstElement inside the middle of the file (or whatever name you want):

SpaceTode `

element MyFirstElement

`

Congratulations! You have written your first element!
But it isn't easy to find your element in the menu. Let's give it some special properties that make it easier to find:

SpaceTode `

element MyFirstElement {
    default true
    category "My Cool Elements"
}

`

default true means that your element is the selected element when the page loads.
category "MyCoolElements" means that your element will be in a category in the menu called "MyCoolElements". You can call the category whatever you want.

Now, when you reload the page, you should be able to place your element in the engine. It should stay still and look grey.

Appearance

Let's give our element a colour:

SpaceTode `

element MyFirstElement {
    default true
    category "MyCoolElements"
    colour "blue"
}

`

Your colour can be any CSS colour value, for example:
colour "blue"
colour "#0000ff"
colour "rgb(0, 0, 255)"

Behaviour

Let's draw a rule for our element to follow:

SpaceTode `

element MyFirstElement {
    default true
    category "MyCoolElements"
    colour "blue"

    @ => _
    _    @
}

`

The @ represents your element.
The _ represents an empty space.
So... the rule makes the element fall down if there's an empty space below it.
Try dropping your element now. It should fall downwards!

More

For more information, please check out the SpaceTode Documentation.