Zine

Scripty Basics

Intro

Zine uses SuperMD (an extension of Markdown) for content and SuperHTML (an extension of HTML5) for templating.

Both SuperMD and SuperHTML extend their respective original file formats by embedding Scripty expressions in key places.

For example this is how you can print a link to a page in SuperHTML:

<ctx about="$site.page('about')">
  <a href="$ctx.about.link()" text="$ctx.about.title"></a>
</ctx>

And this is how you can do the same in SuperMD:

Check out our [about page]($link.page('about')).

The Scripty expressions in the previous two examples were the following:

You might be wondering why it’s so different to embed a link in the two languages. We’ll touch upon this topic more later in this page, but for now suffice to say that content and templates have vastly different needs and their respective Super- languages tailor their usage of Scripty accordingly.

Scrypty Syntax

Scripty is a very small language designed to be embedded in a string.

For this reason Scripty doesn’t have statements or blocks of any kind and can only be used to build expressions.

More precisely, Scripty expressions are always rooted in a global scope from which the expression navigates fields and calls functions.

All variables available in the global scope are prefixed with a $ which means in turn that all Scripty expressions start with a $.

Literals

Scripty supports also a limited set of literals:

Field navigation

Navigating fields of structured values can be done with . concatenation:

Function call

Functions can be called with ().

Any argument can be placed between the parenthesis and separated with a , (trailing commas are allowed). Arguments can be both literals and other Scripty expressions.

Global Scope and Semantics

Scripty is designed to only produce expressions embedded inside strings because it’s meant to be embedded into other languages.

For this reason it’s entirely up to the host language to define which variables are available in the global scope and their semantics.

For example, SuperHTML offers (among others) $page and $site in its global scope and all functions called on them are just meant to navigate all kinds of assets (pages, translations, images, etc) present in the site.

In contrast, SuperMD offers (among others) $link, $image, and $video and calling functions on those values changes their internal state ultimately defining a structured description of a {link, image, video} that must be embedded in the document.

To learn what global variables are available to you in a given context, and the semantics of the operations allowed on them, you must read the documentation specific to the host language that embeds Scripty.

Next steps

If you haven’t done it yet, read the main Documentation page fully, otherwise see: