Odd little bug with jQuery hide/show buttons

Authoring Twine
1

Twine: 2.2.1
SugarCube: 2.29.0

I have a widget (<<msg>>) that acts as a wrapper for Chapel’s <<message>> macro.

<!-- <<msg object [owning object]>>-->
<<widget "msg">>
	<<set _uniqueid = msgid($args[0].note)>>
	<<message $args[0].note btn _uniqueid>>
		<<tab>>
		<<print $args[0].text>>
	<</message>>
    
	/* if this message should not be displayed until other message has been clicked */
	<<if def $args[1]>>
		<<set _ownerid = msgid($args[1].note)>>
		<<script>>
			$(function(){
				//Hide self
				$("#macro-message-" + State.temporary.uniqueid).hide();
				
				//Attach function to show self when owning button is clicked
				$("#macro-message-" + State.temporary.ownerid).click(function() {
					$("#macro-message-" + State.temporary.uniqueid).show(500);
				});
			});
		<</script>>
	<</if>>
<</widget>>

The objects passed contain the properties “note” which is a simple string < 7 words, as well as “text” which contain the actual message.

Setting the “Main” msg is as simple as calling <<msg setup.dialogue.chat>>
Setting a “child” msg that only shows after the “main” msg is clicked: <<msg setup.dialogue.secondchat setup.dialogue.chat>>
This works.

The issue now comes when I want to add a “child” msg to the first “child” msg.
<<msg setup.dialogue.thirdchat setup.dialogue.secondchat>>
Suddenly the “secondchat” msg no longer gets hidden at all, and is visible as soon as the passage has finished loaded.
The “thirdchat” msg is still hidden, until “secondchat” is clicked.

Why isn’t the second <<msg>> being hidden when there’s a third <<msg>>?

2

You are executing the following JavaScript to “hide” each “message”…

… and that code relies on a number of things to be true for it to work as you expect:

  1. That the _uniqueid temporary variable contains the correct value at the time the contents of the <<script>> macro is executed.
  2. That the HTML element generated by the widget’s <<message>> macro call has been added to the page’s Document Object Model sometime before the above “hide” code is executed.

And the second requirement may not be true, even though you are using a jQuery trick to hopefully delay the execution of the “hide” code long enough for the target element to exist.

3

I see your point, but it seems odd that this works when there is only 1 child button.
The issue only happens when a child button has a child button.
That it works for the “first” child indicates that the macro call has been added to the DOM before the function to hide it has been executed.

Here’s an example of it with Main->Child and Main->Child->Child

624×616 409 KB

The only thing different between either sides of the session-restart is the addition of <<msg setup.dialogue.thirdchat setup.dialogue.secondchat>>