adding text after a choice in SugarCube

RadOwl

Hello,

I'm currently wondering if this can be done at all i've searched all over the forum and find nothing that seemed to work for me maybe I just didn't saw what i was looking for; or i'm just to dumb with this programming thing.

So here is the thing I have this in a passage which currently link to passages named "fight" and "run"

You have to do something fight the strange man or run

what I would like is when i click on the link let say "fight" it either display the text of "fight" after the text and disable or erase the links

OR

to replace the text after the

You have to do something

part.

and if it's not too much to ask is there a way to do it without the passages "fight" and "run"?

greyelf

note: I have used Twine's end a line with a \ to remove trailing new-line feature to format the code over multiple lines to help make it more readable.

You can use the <<click>> and <<replace>> macros and a HTML span / div tag with an ID to handle the link click and <<display>> passage part of your question.

You have to do something <<click "fight">>\
<<replace "#output">><<display "fight">><</replace>>\
<</click>> the strange man or <<click "run">>\
<<replace "#output">><<display "run">><</replace>>\
<</click>>

<span id="output"></span>

If you don't want to have the fight and run passages then just replace the <<display "fight">> and <<display "run">> parts in the above like so:

You have to do something <<click "fight">>\
<<replace "#output">>The text to show when the fight link is clicked<</replace>>\
<</click>> the strange man or <<click "run">>\
<<replace "#output">>The text to show when the run link is clicked<</replace>>\
<</click>>

<span id="output"></span>

You can add more HTML span tags with an ID to handle the disabling of the fight and run links:

You have to do something <span id="fight">\
<<click "fight">>\
<<replace "#fight">>fight<</replace>><<replace "#run">>run<</replace>>\
<<replace "#output">><<display "fight">><</replace>>\
<</click>>\
</span> the strange man or <span id="run">\
<<click "run">>\
<<replace "#fight">>fight<</replace>><<replace "#run">>run<</replace>>\
<<replace "#output">><<display "run">><</replace>>\
<</click>></span>

<span id="output"></span>

If you need any of the above described in greater detail just ask.

Sage

I had a couple of mis-steps with the above. I could only get it to work like this:

You have to do something. Either \
<span id="fight">\
	<<click "fight">>\
		<<replace "#fight">>fight <</replace>>\
		<<replace "#run">>run.<</replace>>\
		<<replace "#output">>
        You have chosen to fight. He begins to remove his jacket.<</replace>>\ 
	<</click>> \
</span>\
the strange man or \
<span id="run">\
		<<click "run">>\
		<<replace "#fight">>fight <</replace>>\
		<<replace "#run">>run.<</replace>>\
		<<replace "#output">>
        You have chosen to run. He takes out his radio.<</replace>>\ 
	<</click>> \
</span>.\

<span id="output"></span>\

But it works for me now. Not sure what I did wrong. Either way, this is SUPER helpful. Thanks GreyElf

RadOwl

greyelf you are my hero,

it look so simple when I look at it like that, I used the third options by the way.

what I would like to know is what the <span id="thing"> means and different way to use it or at the least a link to a page that explain all that. Also why does it use simple "< >" and not double like everything?

oh and what is the meaning of the " # " in the <<replace "#thing">> i understand that it's there to tell to change the "thing" in the <<click "thing">> why it needs to be there?

Sage

The span is basically saying that this particular area is where the related items are... and if you want to affect the items in this area, you would use the associated ID. Does that make sense? If you see the way I entered in my code I used a lot of indentation to show the different segments.

So you will see a "fight" section (with related code). A "run" section, and an "output" section.

The output section doesn't have anything in it yet, because it is meant to be blank until the user makes a decision. Then it gets filled with stuff.

Does that help?
―Sage

greyelf

Twine passages can contain standard HTML tags/elements like <span> as well as Twine script macros. HTML elements are wrapped in a single < and >, unlike Twine macros which use << and >>.

HTML elements can be given an unique ID which can be used in both CSS and Javascript. So I gave the <span> tag an ID of output so I could do something with it.

When looking for elements using CSS, Javascript, and some SugarCube macros like <<replace>>, you add a # to the start to indicate that you are looking for an ID.

RadOwl

Okay thanks to both of you I think I understand better now, this whole post was very helpful.