As you may have seen, I’ve been exploring the hyperlinks feature of Bisquixe. Don’t get the wrong idea, yes, I’ve been asking for help, but it’s a great tool for authors.
Parser fans are likely familiar with Dialog’s hyperlink feature. Try for yourself:
I don’t think anyone would disagree if I asserted that Famliar Problems is the current high-water mark for parser hyperlinks, both in terms of presentation and interface. Try and see for yourself. Could Bisquixe recreate this experience? Hm… not in my hands, no. It’s a good target to aim for, though!
Let’s start at a simpler level. A hyperlink–in Dialog or Bisquixe–is essentially a shortcut that enters a command at the prompt. Links aren’t “smart”; they don’t access actions or data. They inject text into the input field. We as authors can decide what that text is, and how it should appear as a link.
the description of lab is "A curious [statue] towers above."
the statue is scenery in lab.
to say statue:
hyperlink "statue" as "examine statue".
To hyperlink something is to declare a special kind of text. Above, we state that a hyperlink will appear as the word “statue”, and that the command “examine statue” will be executed when the hyperlink is clicked. The text on the left is what’s printed, and the text on the right is the verbatim command to be entered at the prompt.
We can use this as a text substitution, and we do so above in our description of the lab.
Perhaps we’d like to streamline insertion of links in our descriptions. Can it be done without so much typing? Yes! We can lay out a rule for printing the names of things.
rule for printing the name of a thing (called the item in question):
Let H be "[printed name of the item in question]" in upper case;
hyperlink "[H]" as "EXAMINE [H]";
This will cause thing names to print as links automatically if we do something like
The description of the orchard is "You stand near a laden [apple tree]."
Provided there is a thing called an “apple tree” in the orchard, the player can examine it by clicking the link. Names printed automatically (“which do you mean”, inventory lists, etc.) will also generate links according to this rule.
That’s a “big” rule, though, so it might make sense to break things up. Perhaps you would prefer different rules for different occasions:
rule for printing the name of a thing (called T) while listing nondescript items:
hyperlink "[printed name of T]" as "examine [printed name of T]".
And so forth. Links are in many ways like other forms of text, so we have a lot of flexibility when deciding how, when, and where to print them.
Formatting Links
While styles allow us to format individual passages differently, links are less flexible. At least, they are to my untrained eye. In the wider world, links have a general default designation that covers every link on a page. We can tap into this if we want to set presentation details for links in our game.
when play begins:
css-set-fast "a:link; color; #190A1B";
css-set-fast "a:link; font-weight; bold";
css-set-fast "a:link; font-size; 14.5px";
This isn’t so different from formatting tasks we’ve already performed. Configuring color in the .BufferWindow relies on the same principles that govern link color. I have yet to discover a way to configure different links within a game differently, and I suspect that it isn’t possible. That’s OK! There remain many styling options.
We can still use styles to format things like background, padding, and so forth. The link is like an island within the styling we set out. First, let’s make a style. We can apply it the way we apply built-in styles like [italic type] or ``[fixed letter support]‘’. We start by giving our style a name. I’m using links for verbs, so we can just call it “verb”.
to say verb type:
set-any-class "verb".
Once we have a name, we’ll want to load it into CSS. We can’t use it until we do, so when play begins is a good time. I’ll say that I want a background color:
when play begins:
css-set-fast ".Style_verb;background-color; #03112A";
note the construction .Style_verb; Yes, that’s our name! Note that the capital S in “Style” is important; the CSS won’t work without it.
Once it’s set up, we can use [verb] just as we would [bold type], fitting it into our texts. This works, for instance:
hyperlink "[verb]LOOK" as "LOOK"
We can do better, I think. Let’s pad the edges, increase the line height, and give the backgrounds a rounded, button-like appearance:
css-set-fast ".Style_verb;font-family; Roboto Mono";
css-set-fast ".Style_verb;font-size; 14px";
css-set-fast ".Style_verb;position; relative";
css-set-fast ".Style_verb;display; list";
css-set-fast ".Style_verb;width; 110vw";
css-set-fast ".Style_verb;background-color; #D7D7D7";
css-set-fast ".Style_verb;line-height; 35px";
css-set-fast ".Style_verb:before; border-radius; 50% 50% 50% 50%";
css-set-fast ".Style_verb;border-radius; 20px 20px 20px 20px";
css-set-fast ".Style_verb;padding; 5px 7px";
(credit to the example posted here)
Let’s see what that looks like!
(each button and white space occupies 12 spaces)
Some notes: you can add a hyperlink to a list, or even to a table. You can perform regular expression matching to the text of a hyperlink, in case you need to find one in a list or table. Because they are treated as text, Inform has a powerful toolset for manipulating, storing, and retrieving them.
Note that, in terms of formatting, A link is a block of contiguous text. In the photo above, I could put multiple links in a sentence and format them together, but I can’t take separate links (ie, repeating through a list or table) and then group them for formatting. They will likely wind up as buttons or entries on individual lines. Which isn’t bad! For the most part, the dialog games operate either as sentences or separate, lineated entries. Quality games can be made in this way.
What else? If you are really committing to a “mouse only” game, situations once dealt with via “if the player consents” (and the like) will require a bit of creativity or elbow grease. But not too much, I don’t think.
My plan is to make an “all mouse” version of my next large game, so I’m sure I’ll be picking up more tricks along the way. I’d like a navigation aid of some sort, for instance. We’ll see!