Display "moving" string

Nathaniel_Sachell

Sooo, getting back to Twine, and I wanted to add some flair to my text.
I'm trying to substring a string, and increment the min & max values for the substring by one, and print the substring (Essentially it'd look like the text on car-stereos "Hello this"->"ello this "->"llo this i" etc)
Here's what I got so far

<span id="warning"></span>
<<silently>>
	<<set $min = 0, $max = 12>>
	<<repeat 100ms>>
		<<set $warn = $warnings.substr($min, $max)>>
		<<set $min++, $max++>>
		<<if $max gt 185>> //Hardcoded string-length
			<<set $max = 12, $min = 0>>
		<</if>>
		<<replace "#warning">>$warn<</replace>>
	<</repeat>>
<</silently>>

It works, buuut it behaves oddly. For some reason, the gap between min & max becomes larger, making the length of the substring longer, the longer it runs, until $max hits the if-statement, where the substring starts shrinking. Once the substring's length is 0, it repeats again.

greyelf

You need to state the name and full version number of the Story Format you are using, as answers can be different for each one. Based on your tag I will assume you are using SugarCube v2.18.0

The main issue with your example is that you're using Javascript's substr() method , which expects a length as it's second parameter and you're supplying an end-point. You can either change how you calculate the second parameter's value or switch to using the substring() method instead.

The following is a slightly modified and a little more generic version of your example, which also handles the reset event a little better.

@\
\
<<silently>>
	/% The message to display and the size of the text slice to show. %/
	<<set $message to "The quick brown fox jumps over the lazy dog.">>
	<<set $sliceWidth to 12>>

	<<set _length to $message.length>>
	<<set _start to 0>>
	<<set _loops to 0>>

	<<repeat 100ms>>
		<<set _end to Math.min(_start + $sliceWidth, _length)>>

		<<set _text to $message.substring(_start, _end)>>
		<<replace "#output">>_text<</replace>>

		<<set _start++>>
		<<if _start is _length>>
			<<set _start to 0>>
			<<set _loops++>>
		<</if>>
		
		<<if _loops is 5>>
			<<stop>>
			<<replace "#output">><</replace>>
		<</if>>
	<</repeat>>
<</silently>>

... the above also includes a condition that stops the <<repeat>> macro after a set number of loops, which I do because time based looping can interfere with a user's ability to interact with the screen.

note: It would be relatively easy to convert the above into a <<widget>> that accepts 3-4 parameters. eg. The message, the slices size, the target element, number of loops.

Nathaniel_Sachell

Thank you greyelf
Works like a charm.
And I'll remember to add full version numbers next time.

amcanomer

why dont u just use some html & css or good ol marquee ?