46 lines
1.0 KiB
CoffeeScript
46 lines
1.0 KiB
CoffeeScript
|
NProgress.configure(showSpinner: false)
|
||
|
|
||
|
defaultClass = 'tanuki-shape'
|
||
|
highlightClass = 'highlight'
|
||
|
pieces = [
|
||
|
'path#tanuki-right-cheek',
|
||
|
'path#tanuki-right-eye, path#tanuki-right-ear',
|
||
|
'path#tanuki-nose',
|
||
|
'path#tanuki-left-eye, path#tanuki-left-ear',
|
||
|
'path#tanuki-left-cheek',
|
||
|
]
|
||
|
timeout = null
|
||
|
|
||
|
clearHighlights = ->
|
||
|
$(".#{defaultClass}").attr('class', defaultClass)
|
||
|
|
||
|
start = ->
|
||
|
clearHighlights()
|
||
|
work(0)
|
||
|
|
||
|
stop = ->
|
||
|
window.clearTimeout(timeout)
|
||
|
clearHighlights()
|
||
|
|
||
|
work = (pieceIndex) =>
|
||
|
# jQuery's addClass won't work on an SVG. Who knew!
|
||
|
$piece = $(pieces[pieceIndex])
|
||
|
$piece.attr('class', "#{defaultClass} #{highlightClass}")
|
||
|
|
||
|
timeout = setTimeout(=>
|
||
|
$piece.attr('class', defaultClass)
|
||
|
|
||
|
# If we hit the last piece, reset the index and then reverse the array to
|
||
|
# get a nice back-and-forth sweeping look
|
||
|
if pieceIndex + 1 >= pieces.length
|
||
|
nextIndex = 0
|
||
|
pieces.reverse()
|
||
|
else
|
||
|
nextIndex = pieceIndex + 1
|
||
|
|
||
|
work(nextIndex)
|
||
|
, 200)
|
||
|
|
||
|
$(document).on 'page:fetch', start
|
||
|
$(document).on 'page:change', stop
|