From 26703c467a5aa02a5125ae8ef7927494a6b37068 Mon Sep 17 00:00:00 2001
From: Eduard Urbach <e.urbach@gmail.com>
Date: Sun, 11 Mar 2018 13:03:13 +0100
Subject: [PATCH] Started working on custom track player

---
 mixins/SoundTrack.pixy                | 5 ++++-
 pages/soundtrack/soundtrack.pixy      | 2 +-
 pages/soundtracks/soundtracks.scarlet | 5 +++++
 scripts/Actions/Audio.ts              | 2 +-
 4 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/mixins/SoundTrack.pixy b/mixins/SoundTrack.pixy
index 68100fff..cfe44600 100644
--- a/mixins/SoundTrack.pixy
+++ b/mixins/SoundTrack.pixy
@@ -12,7 +12,10 @@ component SoundTrackContent(track *arn.SoundTrack, media *arn.ExternalMedia)
 			a.sound-track-anime-link.ajax(href="/anime/" + track.MainAnime().ID)
 				img.sound-track-anime-image.lazy(data-src=track.MainAnime().Image("medium"), data-webp="true", alt=track.MainAnime().Title.Canonical, title=track.MainAnime().Title.Canonical)
 
-		ExternalMedia(media)
+		if track.File != "" && media.Service == "Youtube"
+			img.soundtrack-image.action.lazy(data-action="playAudio", data-trigger="click", data-audio-src="https://notify.moe/audio/" + track.File, data-src="https://img.youtube.com/vi/" + media.ServiceID + "/maxresdefault.jpg", alt=track.Title)
+		else
+			ExternalMedia(media)
 
 component SoundTrackFooter(track *arn.SoundTrack)
 	.sound-track-footer
diff --git a/pages/soundtrack/soundtrack.pixy b/pages/soundtrack/soundtrack.pixy
index 62c5f5c0..f1017f6f 100644
--- a/pages/soundtrack/soundtrack.pixy
+++ b/pages/soundtrack/soundtrack.pixy
@@ -16,7 +16,7 @@ component Track(track *arn.SoundTrack, user *arn.User)
 					
 					if user != nil && media.Service == "Youtube" && track.File != ""
 						.buttons
-							button.action(data-action="playAudio", data-trigger="click", data-src="/audio/" + track.File)
+							button.action(data-action="playAudio", data-trigger="click", data-audio-src="/audio/" + track.File)
 								Icon("play")
 								span Play in background
 
diff --git a/pages/soundtracks/soundtracks.scarlet b/pages/soundtracks/soundtracks.scarlet
index 22f114db..a98d01cd 100644
--- a/pages/soundtracks/soundtracks.scarlet
+++ b/pages/soundtracks/soundtracks.scarlet
@@ -17,6 +17,11 @@
 	iframe
 		width 100%
 
+.soundtrack-image
+	object-fit cover
+	width 100%
+	height 200px
+
 .sound-track-footer
 	text-align center
 	margin-bottom 1rem
diff --git a/scripts/Actions/Audio.ts b/scripts/Actions/Audio.ts
index d0973dc6..23f0536b 100644
--- a/scripts/Actions/Audio.ts
+++ b/scripts/Actions/Audio.ts
@@ -24,7 +24,7 @@ export function playAudio(arn: AnimeNotifier, button: HTMLButtonElement) {
 
 	// Request
 	let request = new XMLHttpRequest()
-	request.open("GET", button.dataset.src, true)
+	request.open("GET", button.dataset.audioSrc, true)
 	request.responseType = "arraybuffer"
 
 	request.onload = () => {