Advanced Techniques

In TyranoScript, the screen is composed of stacked elements called layers.
You can think of layers as transparent sheets stacked on top of each other, which makes the concept easier to understand.

TyranoScript includes the following types of layers:

Base Layer
There is only one base layer on the screen. It is always positioned at the back and is used for displaying the background. To specify this layer, use layer="base".
To hide the image on this layer, use [freeimage layer="base"] to remove the background image.

Foreground Layers
These layers are used to display characters and images. By default, three layers are provided, and you can specify them like layer="0", layer="1", etc.
To clear the images on a foreground layer, use the [freeimage] tag.
(The default number of layers is 10. You can freely increase or decrease this number by modifying Config.tjs.)

Message Layers
These layers are used to display messages. By default, there are two message layers.
You can switch between message layers that output text by using [current layer="message0"] or [current layer="message1"]. (The default number of message layers is 2, but you can change this by modifying Config.tjs.)

Free Layer
You cannot specify this layer using something like layer="free".
This area displays graphic buttons, clickables, HTML elements, etc.
By default, this layer is hidden, but when you use one of the above-mentioned tags, it appears in the frontmost position and pauses the story.

When you insert the [cm] tag, the free layer becomes hidden and its contents are cleared. In other words, if the free layer is currently visible, you need to provide a jump from that state and use the [cm] tag after the jump to allow the story to continue.

For example, you could display choices using graphic buttons → when one is clicked, [cm] is used to hide the free layer and continue the story.
Fix Layer

Specify it using "layer=fix". It is also called a "fixed layer". This layer is for displaying elements that should always remain visible on screen.

The fix layer will not be cleared by any other tag unless you explicitly use [clearfix].

Except for the free layer, every single layer in TyranoScript has a concept of a front (fore) and back (back) side.

In other words, each layer consists of two pages: a front page and a back page.

The back page is always hidden and never directly shown on the game screen.
So, why does it exist? It's because when you execute the [trans] (transition) tag, the front and back pages can be swapped.

This might be a bit hard to visualize at first, so let’s look at a real example.
Below is the typical method for switching background images.

;Copy the front page to the back page
[backlay]

;Set a new background image on the back page — ☆ it's not visible on the screen yet!
[image storage=image.jpg layer="base" page=back visible=true ]

;Gradually display the back page over the front page (over 2000 milliseconds)
[trans time=2000]

;Wait for the transition to complete
@wt

As you can see, by specifying page="back" and creating a back page screen, then using [trans] to transition it into view, you can create a wide variety of effects.

That said, TyranoScript includes newer tags like [chara] and [back] that are optimized for visual novels, so using those will generally be easier for visual novel development.
If you want to create more elaborate effects, consider using transitions.