0 votes
asked by (530 points)

For whatever reason, this widget won't work if I try to do the reverse version of it? I have this set up for all of my stats and it works for other ones, so I have no clue what I've borked up.

:: StoryInit
<<set $hunger to 50>>
<<set $full to 50>>
<<set $hunger = Math.clamp($hunger, 0, 100)>>

:: hunger #widget #nobr
<<widget "hunger">>
<<set $hunger += $args[0]>>
<<set $full -= $args[0]>>
<</widget>>

:: CSS
.statsb { display: flex; width: 200px; font-size: 10px; color: #000; text-align: center; font-weight: 700; }
.stats { display: inline-block; min-width: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

:: hungertest
<div class="statsb">
<<if $full gte 0>><div class="stats" @style="'width: ' + ($full * 2) + 'px; background-color: #fff;'">full: $full%</div><</if>>
\<<if $hunger gte 0>><div class="stats" @style="'width: ' + ($hunger * 2) + 'px; background-color: #ccc;'">hunger: $hunger%</div><</if>>
</div>

<<hunger -1>>
<<link "refresh" `passage()`>><</link>>

using <<hunger 1>> works to increase $hunger and decrease $full, but <<hunger -1>> (which I believe should increase $full and decrease $hunger) does absolutely nothing.

1 Answer

0 votes
answered by (125k points)
selected by
 
Best answer

warning: You need to use the Math.clamp() function each time the associated story variable is changed, the story variable doesn't remember the mimum or maximum limits.

<<set $hunger += $args[0]>>
<<set $hunger = Math.clamp($hunger, 0, 100)>>


note: The syntax of your TWEE Notation contains a couple of errors:
1. The Passage Tags assigned to a passage should apear as a space sperated list between square brackets.
2. Story Stylesheet / CSS related passages need to be assigned the stylesheet passage tag.

:: CSS [stylesheet]
.statsb { display: flex; width: 200px; font-size: 10px; color: #000; text-align: center; font-weight: 700; }
.stats { display: inline-block; min-width: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }

:: hunger [widget nobr]
<<widget "hunger">>
<<set $hunger += $args[0]>>
<<set $full -= $args[0]>>
<</widget>>

:: StoryInit
<<set $hunger to 50>>
<<set $full to 50>>
<<set $hunger = Math.clamp($hunger, 0, 100)>>

:: hungertest
<div class="statsb">
<<if $full gte 0>><div class="stats" @style="'width: ' + ($full * 2) + 'px; background-color: #fff;'">full: $full%</div><</if>>
\<<if $hunger gte 0>><div class="stats" @style="'width: ' + ($hunger * 2) + 'px; background-color: #ccc;'">hunger: $hunger%</div><</if>>
</div>

<<hunger -1>>
<<link "refresh" `passage()`>><</link>>


If I add the above to a new SugarCube 2 based project and change the name of your hungertest passage to Start, the <<hunger>> widget works correctly when I build & view the story HTML file in a web-browser.

commented by (530 points)
Thanks for the syntax note!

Thanks for your help! I... don't know what was happening because when I tried again the widgets weren't changing, but renaming them and then changing their names to what the original variables had been worked? I wasn't using those variables or a widget with that name anywhere else so idk what the issue was.
Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.
...