Is reactive text possible?

Question

Is it possible to have text which reacts to changes within the passage (like a cycling link) in the manner of this game? https://lizadaly.com/projects/the-ballroom/

Answer 1

Yes.  Just about anything any web page does (which doesn't require server-side code) can be replicated in Twine.

If you were using SugarCube you would use <<link>> macros which trigger <<replace>> macros that would replace the content within particular <span>s.

That said, by default the results of those <<link>> clicks wouldn't be saved until you go to a new passage, and hitting the "back" button would take you back to the passage in its default state.

Also, writing passages to do that stuff would be kind of tricky.  If you were going to try it, then you might want to first make mini-test Twine games where the links just take you to new passages with the appropriate text changed, and once you had it all worked out, then you could combine all of it into a single passage, like the story you linked to.

Hope that helps!  :-)

Comments

Thanks for the help! Are you aware if this is possible to do via Harlowe? Or is SugarCube my only option if I wanted to do this?

---

I don't know Harlow.  Hypothetically it can do it too, but it may be more difficult.

---

Read this somewhere and it resonated with me, and works with this too:

 "The more complex it gets, the more you work around the engine rather than with it"

So it'll be tricky...

Answer 2

Please use the Question Tags to state the name and full version number of the Story Format you are using, as answers can vary based on that information. Based on your reply to HiEv I will assume you are using Harlowe v3.0.2

I had a quick look at the source code of the HTML page you linked to, it is using links (and JavaScript) to either:

a. hiding sections.of existing content while reveal other related sections.
eg. the replacing of the "shabby muslin dress" link with the "long crinoline gown" link, and vice-versa.

b. replace marked sections of text on the page with alternative text.
eg. the "with disdain" / "with admiration" text switching when the above mentioned two links are selected.

You could use a Hidden Hook combined with the (show:) macro to do the "reveal hidden text" effect.

The (link: "quick")[very quick(show: ?dogcolour)] brown fox jumps over the lazy |dogcolour)[black ]dog.

You could use a Named Hook combined with the (replace:) macro to do the "replace marked section of text" effect.

The quick brown fox (link: "jumps")[jumps(replace: ?lazydog)[disinterested cat]] over the |lazydog>[lazy dog].

There are also the (link-reveal:) macro, the (link-show:) macro, and a number of (click:) related macros to could use.

However as stated by HiEv crafting a Passage to work exactly like the one you linked would take quite a bit of work and would likely require the usage of displaying the content of 'child' passages within the current one (to make the code required to do what you want more readable). And like HiEv I would suggest starting with some smaller/simpler prototying projects/passages to learn how to do each of the effect types to require.