Here is code I developed in Twee3 format to implement a quiz in a Twine project using Twine 2.10.0 and Sugarcube 2.37.3 — utilizing three widgets I made, combined with passages that present quiz items.

Radio buttons are used for multiple-choice ABCD responses. It's a simple 10-item quiz. The $knight* variables are setup in the :: StoryInit passage of my Twee3 source.

Here is a download of the code, and below is a listing of it.

I'm proud of a programming accomplishment I've made: I've been developing an introductory tutorial series covering Twine 2.10.0 and Sugarcube 2.37.3 — for an interested coworker.

I've been naming the tutorial passages after this convention:

TwineLesson001Passage001
TwineLesson001Passage002
etc.

Well, I had been using a block of Twinescript like the following in order to implement some cute back/forward navigation icons (shown below):

But I got to thinking to myself, "Self, there has to be a way to use a widget or function so that I'm not pasting the equivalent of a small paragraph in every single tutorial passage, just to implement this."

It took me awhile to incrementally write code, test, repeat to get the above. Just three lessons into a tutorial series (weighing in at 51 passages), my Twee3 file was 39 Kb. Using the above widget allowed me to trim that down to 27 Kb.

Put the following code into the Javascript section of your Twine project:

/* Anchor Link to Passage - Start */
if ("onhashchange" in window) {  // event supported
    window.onhashchange = function () {
            hashChanged();
    };
} else {  // event not supported
    window.setInterval(function () {
            if (window.location.hash != setup.storedHash) {
                    hashChanged();
            }
    }, 100);
}
function hashChanged() {
    if (Engine.isIdle()) {
            if (window.location.hash && (setup.storedHash != window.location.hash)) {
                    setup.storedHash = window.location.hash;
                    var anchor = decodeURI(window.location.hash.substring(1));
                    if (Story.has(anchor) && (passage() !== anchor)) {
                            Engine.play(anchor);
                    }
            } else {
                    // Comment out the following line of code if you don't want the
                    // anchor link of the current passage displayed in the URL bar.
                    window.location.hash = encodeURI(passage());
            }
            // Comment out the following line of code if you don't want the
            // title of the page set to the passage name.
            document.title = passage();
    } else {
            setTimeout(hashChanged, 100);
    }
}
$(document).on(':passageend', function () { hashChanged(); });
/* Anchor Link to Passage - End */

Next, put the following into a header passage, but feel free to restrict its use with passage tags.

It's not terribly difficult to implement passwording in a Twine work. First, you'd drop this into your story javascript passage:

/* hashStr - Start */
window.hashStr = function(txt) {
    var hash = 0, i, chr;
    if (txt.length === 0) return hash;
    for (i = 0; i < txt.length; i++) {
            chr   = txt.charCodeAt(i);
            hash  = ((hash << 5) - hash) + chr;
            hash |= 0; // Convert to 32bit integer
    }
    return hash;
};
/* hashStr - End */

Next, you'd need to go here (or message me and I'll help you) and use the Enter text here textbox to enter the desired password. For example, if your desired password is redrum, the hash will return -934876071 Copy that number to the clipboard, because we'll use it in the next step.

Step 3: Finally, you'll need to put the following code into a Twine passage and specify the number you got in step 2. This is a textbox where users can try to enter the correct password:

You can view the raw text here, online...

I get a bit frustrated that I don't find myself making dazzling progress in coding works of Twine. However, I realized this afternoon while doing a lot of reading on http://intfiction.org, https://twinery.org, https://twinelab.net/twine-resources/#/, and other forums that it is this reading, interspersed with trying out snippets of Twinescript and Javascript, that make learning possible.

I know enough about learning theory to appreciate that sometimes periods of apparent non-productivity are in fact allowing the brain to percolate and make mental connections between concepts — even to have occasional epiphanies.

And so, I'll continue to read Reddit posts that are Twine-related. I'll read them trolling for valuable snippets, but also because they encourage me when I see that many other people have (1) many of the same questions I have, and (2) have creative aspirations in common with my own.

The preferred way to implement menus in SugarCube 2 is to add the following code to your javascript section:

/* Trigger the following code at the start of navigation to a new passage. */
$(document).on(":passagestart", function (event) {
    /* Make sure the current passage doesn't have a "noreturn" tag. */
    if (!tags().includes("noreturn")) {
        /* If it doesn't, then set $return to the current passage name. */
        State.variables.return = passage();
    }
});

And then, tag any menu passages (however deeply nested they may be) with 'noreturn', adding the following link to those menu passages:

<<link "Return" $return>><</link>>