[Sugarcube] Click anywhere to proceed to the next passage

Authoring Twine
,
1

I’m trying to make some kind of a point-and-click pixel game, where there would be a dialogue box, and if you click anywhere you can proceed to the next passage and/or it would trigger a link-replace. Basically, if the player clicks anywhere (instead of just clicking the link itself), or at least just clicking inside the dialogue box, it would trigger an internal link. Is that possible in twine?

2

It may be more or less complex, depending on what you mean by “dialogue box”, but it’s definitely possible. Basically, just about anything you see on a web page can be done in Twine.

If you have specific questions about how to implement that, you’ll need to note which story format you’re using in Twine (e.g. Harlowe, SugarCube, etc…).

4

I’m talking about a div dialogue box at the bottom of the screen where the characters talk. Here’s the code I’m using for it:

@@.typed-speed13;<div id="txt"><img src="avatar.png" class="avatar">This is placeholder text.</div>
@@

I’m using Sugarcube 2.28.2

5

Since you’re using SugarCube, you can put this in your JavaScript section:

$(document).on(":passagerender", function (ev) {  /* Triggers on passage render event. */
	var links = $(ev.content).find("a").toArray();  /* Look for links. */
	if (links.length == 1) {  /* If there's only one link, mark it. */
		links[0].id = "NextLink";
		$("html").on("click", function (ev) {  /* Look for click event */
			if ((ev.target == $("html")[0]) || ($("#passages")[0].contains(ev.target))) {  /* Check click location. */
				$("html").off("click");  /* Stop looking for click. */
				$("#NextLink").click();  /* Click the link. */
			}
		});
	}
});

That will make it so that if there’s only one link in the passage, and you click anywhere other than the UI bar, then it will act as though you clicked on that one link. If there are two links in the passage, then clicking does nothing, since you don’t want it to trigger the wrong link.

If that isn’t what you were looking for and you can’t fix it yourself, let me know how you want it to work and I can help fix it for you.

6

No worries, it works for me. Thanks!