{
(set: $artNumber to "1")
<!-- Set the text to show -->
(set: $typewriterText to "Small Moment Story
By: Elliot Marfia
At Florida I had to go to different hotels!")
(append: ?SideBar)[\
<div class="actions">[[Next Page->The Drive]]</div>
(display: "Typewriter")
]
<div class="top"></div>
}{
<!-- Create a variable to track the position within the $typewriterText string -->
(set: $typewriterPos to 1)
<!-- Create a hook to hold the typed text -->
|typewriterOutput>[]
<!-- Set a delay of 20ms seconds per loop -->
(live: 20ms)[
<!-- Add the next character to the hook -->
(append: ?typewriterOutput)[(print: $typewriterText's $typewriterPos)]
<!-- Update the position -->
(set: $typewriterPos to it + 1)
<!-- If it's gone past the end, stop -->
(if: $typewriterPos is $typewriterText's length + 1)[
(stop:)
]
]
}{
(set: $artNumber to "1")
<!-- Set the text to show -->
(set: $typewriterText to "“Are we there yet” I asked my dad. “No” said my dad.
Can I have Waze please I asked my dad. ”Okay” said my dad.
“We're almost there.” I'm so excited.")
(append: ?SideBar)[\
<div class="actions">[[Next Page->The Door]]</div>
(display: "Typewriter")
]
<div class="top">
(display: "Art")
</div>
}{
(set: $artNumber to "2")
<!-- Set the text to show -->
(set: $typewriterText to "First hotel we were at the door was locked.
My dad had to break in my dad used his shoe lace.
My mom showed my dad a video to show how to do it. ")
(append: ?SideBar)[\
<div class="actions">[[Next Page->The inside]]</div>
(display: "Typewriter")
]
<div class="top">
(display: "Art")
</div>
}{
(set: $image to "3")
(set: $typewriterText to "Next I sat on the couch and it was wet.
The balcony's door was broken and the bathroom's roof was broken. ")
(append: ?SideBar)[\
<div class="actions">[[Next Page->Driving around]]</div>
(display: "Typewriter")
]
<div class="top">
(display: "Art")
</div>
}{
(set: $image to "4")
(set: $typewriterText to "We were driving all I could say was “is that it”.
I looked at Waze and we are almost there. ")
(append: ?SideBar)[\
<div class="actions">[[Next Page->End]]</div>
(display: "Typewriter")
]
<div class="top">
(display: "Art")
</div>
}{
(set: $image to "5")
(set: $typewriterText to "My dad got us a new room.
We got in the new room.
It was beautiful we stayed in it for a week. ")
(append: ?SideBar)[\
<div class="actions"></div>
(display: "Typewriter")
]
<div class="top">
(display: "Art")
</div>
}<div class="art_wrapper">
(print: "<img src=\"/art-" + $artNumber + ".png\" />")
</div><div class="profile_wrapper">
(print: "<img src=\"file:///C:/Users/Chris/Downloads/elliot-" + $expression + ".png\" />")
</div>