Hyperlapse » Animating the page indicators
Animating the page indicators
One more thing needs fixing: the page indicators keep insisting that we’re on the first page.
In the same page.on "change:currentPage"
we’ll do two more things.
First, we use page_index
to set the active dots. The dot representing the current page, and those to its left, should all be solid.
for i in [0..page_index]
allSolidDots[i].animate "active"
All the remaining dots should be set to their ‘default’ state (= zero opacity).
We check if page_index
is less than 3
, because when it’s equal to 3, we’ll be on the fourth page (where they’re all solid).
if page_index < 3
for i in [page_index..2]
allSolidDots[i+1].animate "default"
All together it should look like this:
page.on "change:currentPage", ->
user_has_swiped = yes
page_index = page.horizontalPageIndex page.currentPage
switch page_index
when 0
Video_1_Bridge.player.play()
music_2.mute yes
when 1
music_2.mute no
Video_2_Clouds.player.play()
music_3.mute yes
when 2
music_3.mute no
Video_3_train.player.play()
music_4.mute yes
when 3
music_4.mute no
Video_4_people.player.play()
for i in [0..page_index]
allSolidDots[i].animate "active"
if page_index < 3
for i in [page_index..2]
allSolidDots[i+1].animate "default"