Text-box and the 'Enter' Key Query

Authoring Twine
1

Hey there folks. I’ve successfully got this code to work, however, when I enter the name in the browser and hit the return key, it doesn’t work straight away, it needs the tab key pressed a few times to then get the return / enter key to ‘confirm’.

Is there a way for it to automatically have the

Greetings, please confirm identity and click Enter.<br><<textbox "$playerName" "Type your name here"  autofocus>><<button "Enter">>
	<<replace "#name">>@@.fade-in;$playerName, name confirmed.@@<</replace>><</button>>
<span id="name"></span>
<<set $score to 0>>
[[Confirm Identity|Start 1][$score +=1]]

Maybe I should just code it so the button ‘enter’ will jump to the next passage?

Thoughts appreciated.

2

If you want it to work with the ENTER key, then you’d probably want to do it like this:

Greetings, please confirm identity and click Enter.
<<textbox "$playerName" "Type your name here" "Start 1" autofocus>>
<<set $score = 1>>

Now hitting the ENTER key after typing in the name will send you to the “Start 1” passage.

There wouldn’t be any “confirm” step, but since you see the text within the textbox, there probably really isn’t any need for that anyways.

If you want something a bit fancier, you could do this:

Greetings, please confirm identity and click Enter.
<span id="plc"><<textbox "$playerName" "" "Start 1" autofocus>></span>
<<set $score = 1>>
<<script>>
	$(document).one(":passagerender", function (event) {
		$(event.content).find("#plc input").attr("placeholder", "Type your name here");
	});
<</script>>

and that would show “placeholder” text within the textbox, which goes away as soon as there’s any text in the textbox.

Please let me know if you have any questions on any of that code.

Enjoy! :slight_smile:

1 Like
3

Wow, you really are the guru with that, the second one works GREAT!
Thanks a lot H.