Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Collapse/expand text in Harlowe

As part of a menu sidebar, I'm trying to have the menu items open collapsible blocks of inline text - rather than go to a new passage. I was being stymied by the fact of hooks being single-use-only, but after ennead figured out this workaround I've tried implementing it.

The problem is, instead of giving me a single link that I can click to either show or hide the block of text, it's making the entire block of text clickable and attaching the action to it. I'm not sure why, since I'm only attaching the click macro to the menu-item hook, but it's attaching the click macro to the "big" hook.

I currently have three passages, which I've added whitespace to in order to make what I did more obvious.

"menu" passage:
<div id="statmenu">(display: "hide stats")
"show stats" passage:
|stats>[''Your Profile'']
Honesty: (print: $player's Honesty)
Bravery: (print: $player's Bravery)
Wits: (print: $player's Wits)
Kindness: (print: $player's Kindness)

(click: ?stats)[
(replace: ?statlist)[]
(replace: ?stats)[(display: "hide stats")]
"hide stats" passage:
[''Your Stats'']<stats|
(click: ?stats)[
(replace: ?stats)[(display: "show stats")]
Is there something I'm missing, or a better way of doing this without resorting to Actual Javascript?


  • The answers is that you have two hooks named "stats", one in the "hide stats" passage and one in the "show stats", and after you click the "Your Stats" link they end up one within the other. The following extract of the HTML generated shows this:

    <tw-expression type="macro" name="display" title="(display: &amp;quot;hide stats&amp;quot;)">
    <tw-enchantment class="link enchantment-link">
    <tw-hook class="" name="stats" title="Hook: ?stats">
    <tw-expression class="" type="macro" name="display" title="(display: &amp;quot;show stats&amp;quot;)">
    <tw-hook class="" name="statlist" title="Hook: ?statlist">
    <tw-enchantment class="link enchantment-link">
    <tw-hook name="stats" title="Hook: ?stats">
    <b class="">Your Profile</b>
    The (click: ?stats) contained within the "show stats" passage is being applied to both stats hooks.

    A (replace:) macro replaces the contents of a hook, not the hook itself.
  • Ah-hah! That's exactly what I was missing, thank you. (That, and the fact that I did not read aforementioned workaround example nearly thoroughly enough and did a couple other things wrong. Whoops.)

    I got it to work now! For posterity's sake:

    <div id="statmenu">[]<statlink|
    (replace: ?statlink)[(display: "hide stats")]</div>
    "hide stats"
    Your Profile {
    (click: ?statlink)[
    (replace: ?statlink)[(display: "show stats")]
    (replace: ?stats)[(display: "statlist")]
    "show stats"
    Your Profile {
    (click: ?statlink)[
    (replace: ?statlink)[(display: "hide stats")]
    (replace: ?stats)[]
Sign In or Register to comment.