web/notify.moe
Code Issues Pull Requests Activity

Added scrolling animation to audio player thumbnail (closes #101)

Browse Source
This commit is contained in:
Eduard Urbach 2018-03-12 00:23:01 +01:00
parent 019b886030
commit 5e552f2541
2 changed files with 15 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
layout/sidebar/audioplayer.scarlet
View File

@ -12,26 +12,24 @@
align-items center align-items center
width 100% width 100%
#audio-player-anime-image #audio-player-anime-link
opacity 0.15 !important width 142px
width 39px height 142px
height 39px overflow-y hidden
border-radius 3px border-radius 3px
object-fit cover opacity 0.75
default-transition
animation rotate-y-once 5s ease infinite alternate
:hover :hover
filter saturate(130%) opacity 1
opacity 1.0 !important
animation rotate-y-once #audio-player-anime-image
0% width 100%
transform rotateY(0) transform translateY(0%)
90% animation bounce-up-down 45s linear infinite
transform rotateY(0)
100% animation bounce-up-down
transform rotateY(90deg) 50%
transform translateY(-30%)
#audio-player-track-title #audio-player-track-title
width 100% width 100%

2
scripts/Actions/Audio.ts
View File

@ -90,7 +90,7 @@ function playAudioFile(arn: AnimeNotifier, trackId: string, trackUrl: string) {
let anime = await animeResponse.json() let anime = await animeResponse.json()
animeLink.title = anime.title.canonical animeLink.title = anime.title.canonical
animeLink.href = "/anime/" + anime.id animeLink.href = "/anime/" + anime.id
animeImage.dataset.src = "//media.notify.moe/images/anime/small/" + anime.id + anime.imageExtension animeImage.dataset.src = "//media.notify.moe/images/anime/medium/" + anime.id + anime.imageExtension
animeImage.classList.remove("hidden") animeImage.classList.remove("hidden")
animeImage["became visible"]() animeImage["became visible"]()
} }