Password asterisks instead of letters in textbox?

Authoring Twine
1

Twine 2.35 (Sugarcube)

Hi guys just wondering if anyone knows if it’s possible to make user input in a textbox come up (display) as asterisks rather than letters? I’m trying to work on a local versus game but it’s important that opponents can’t see what you’re typing in.

Thanks so much!

2

Hrm. You want an <input type="password"> element instead of an <input type="text"> one…doesn’t look like there’s a great way to create one, but you can change the type after the fact:

<<textbox "$varName" "">>\
<<run $(document).on(':passagedisplay', function() {$('#textbox-varname').prop('type', 'password')})>>

Note the all-lowercase “varname” in the JavaScript code…

–Josh

1 Like
3

Absolutely legendary Josh, thanks so much!!!

Just so people as noobish as me can understand (I’m including my future self! ;P) …I’m assuming you’re saying that regardless of what uppercase or lowercase letters I use for the variable name in the textbox variable, I have to refer to it by all lowercase inside the <> tags cos Javascript only uses lowercase or something?

Either way it works like a charm! Thanks again!

4

Basically, SugarCube sets the ID of the textbox based on the variable name. If you need to make sure you use the right ID, play that page in your browser, right-click the textbox, do “Inspect element”, and you can see the ID used there.

If you use a temporary variable instead of a story variable, then there will be two dashes after the “textbox” part of the ID.

Hope that helps. :slight_smile:

2 Likes
5

Thanks actually that’s super helpful!