Tooltips are a feature that allows games to show information tooltips when hovering certain keywords.
They are fully configurable and automated. All you need is to create a list of tooltips, and the engine will make them appear automatically.
This tooltip appears when the player hovers the word bread.
How to use tooltips in narrat
To use this feature, the new
tooltips.yaml config file is needed:
Tooltips are created and configured in the
options: width: 350 keywordsPrefix: '@@' tooltips: - keywords: [bread, breads] title: Bread description: Bread is a staple food prepared from a dough of flour (usually wheat) and water, usually by baking. Throughout recorded history and around the world, it has been an important part of many cultures' diet. It is one of the oldest human-made foods, having been of significance since the dawn of agriculture, and plays an essential role in both religious rituals and secular culture.
config.yaml add the path to the file:
General tooltips config
width: Width of tooltip box in pixels
keywordsPrefix: The prefix to use before words in scripts to make the tooltip appear
Options for individual tooltips
keywords: A list of all possible keywords to match for showing this tooltip. It's case insensitive.
title: The title of the tooltip popup that will appear
description: The content of the tooltip popup
Then, to use in scripts, for example:
main: talk player idle "I like @@bread"
Having one of the keywords defined in the tooltips with the
keywordsPrefix before it will make it be detected as a keyword and show the tooltip
You can override css classes used in tooltips to style them, but it's also possible to configure custom css classes for all tooltips or for individual tooltips:
options: styling: textCssClass: test titleCssClass: test cssClass: test tooltips: - keywords: [bread, breads] title: Bread 🍞🥖 styling: textCssClass: test titleCssClass: test cssClass: test
Any of the above css options can be used to make tooltips get custom css classes