Commit e5800d65 authored by Robert Speicher's avatar Robert Speicher

Use the logo as a loading indicator

Closes #5616
parent c80f75ea
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
...@@ -105,7 +105,7 @@ ...@@ -105,7 +105,7 @@
.tanuki-shape { .tanuki-shape {
transition: all 0.8s; transition: all 0.8s;
&:hover { &:hover, &.highlight {
fill: rgb(255, 255, 255); fill: rgb(255, 255, 255);
transition: all 0.1s; transition: all 0.1s;
} }
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment