Odyc.js

💬 Dialogues

Dialogues let you add conversations, hints, or narrative elements to your game.
You can also enhance them with visual effects and color highlights.


✏️ Defining a dialogue

To assign a dialogue to a game element, use the dialog property in the templates section:

createGame({
	templates: {
		'@': {
			dialog: 'Hello world!'
		}
	}
})

Every time the player interacts with the @ element, a dialogue box will display Hello world!.


⛓️‍💥 Splitting a dialogue

To force a line break, use the | character.

'Hello!|How are you?|Have a great day!'

Note

To insert empty lines, just use multiple | in a row.

💥 Adding effects and colors to text

You can make your dialogue more expressive with simple syntax for visual effects and color changes.

Effects

EffectSyntaxDescription
Vertical wave~your text~Letters move up and down
Horizontal wave_your text_Letters wave side to side
Random shakeyour %text%Chaotic shaking
Horizontal shakeyour =text=Left-right shaking
Vertical shakeyour ^text^Up-down shaking
Blinkingyour °text°Flashing on/off

Colors

To apply a color, wrap text in <n>, where n is the index of a color in your palette:

'<3>Blue text<3>'

You can also combine effects and colors:

'~<2>Gray text with wave effect<2>~'

🫥 Displaying special characters

To display a reserved character (like %, ~, _, ^, =, °), escape it with two backslashes \\:

'I only have 56\\% battery left'

will display:

I only have 56% battery left