Keyboard Controls?

Authoring Twine
1

Before I start my next Twine 2.0 project I’m curious to know if there’s any way using any of the available story formats to somehow, even if I have to add scripting for each passage individually, have keyboard controls?

For instance if I’ve got a single link to continue on to the next passage it could say “Continue [Enter]” and it could either be clicked or you could just press the enter/return key instead. In the case of several choices it could come down to number keys, etc.

Is this at all doable, if so, how would you suggest I go about doing it? Thanks!

1 Like
2

When I’m playing, I just use the normal browser keyboard controls: that is, Tab or Shift-Tab to switch between links, Space or Enter to activate them.

If you have no links in the body of your text, only choices or continue at the end, you could auto-focus the first one. Hmm…I would have thought it would be easy in SugarCube, but it seems to interfere with the focus and I’m not sure how to work around that. Putting the following in the Story JavaScript almost works but it doesn’t show the dotted outline:

$(document).on(':passageend', function(ev) {
	var firstLink = document.querySelector('#passages a')
	if(firstLink) window.setTimeout(()=>firstLink.focus(), 100)
})
3

The exact method for doing that depends on what Twine story format you’re using. I have some keyboard navigation sample code, for use with the SugarCube story format, that will automatically mark any links in your story for you for navigation using the number keys. (Click “Jump to Start” in the UI bar there to see other sample code.)

Also, I should mention that using “Enter” or the spacebar for navigation is bad, since they already have other specific uses for navigation on web pages.

Hope that helps! :slight_smile: