Added play in background button

pages/soundtrack/soundtrack.pixy

@@ -13,6 +13,12 @@ component Track(track *arn.SoundTrack, user *arn.User)
 					h3.widget-title= media.Service
 					.sound-track-media.video-container
 						iframe.lazy.video(data-src=media.EmbedLink(), allowfullscreen="allowfullscreen")
+					
+					if user != nil && media.Service == "Youtube" && (user.Role == "admin" || user.Role == "editor") && track.File != ""
+						.buttons
+							button.action(data-action="playAudio", data-trigger="click", data-src="/audio/" + track.File)
+								Icon("play")
+								span Play in background
 
 			.widget.mountable
 				h3.widget-title Anime

scripts/Actions.ts

@@ -1,3 +1,4 @@
+export * from "./Actions/Audio"
 export * from "./Actions/AnimeList"
 export * from "./Actions/Diff"
 export * from "./Actions/Editor"

scripts/Actions/Audio.ts

@@ -0,0 +1,13 @@
+import { AnimeNotifier } from "../AnimeNotifier"
+
+// Play audio file
+export function playAudio(arn: AnimeNotifier, button: HTMLButtonElement) {
+	if(!arn.audio) {
+		arn.audio = document.createElement("audio") as HTMLAudioElement
+		let source = document.createElement("source") as HTMLSourceElement
+		source.src = button.dataset.src
+		arn.audio.appendChild(source)
+	}
+
+	arn.audio.play()
+}

scripts/AnimeNotifier.ts

@@ -32,6 +32,7 @@ export class AnimeNotifier {
 	mainPageLoaded: boolean
 	isLoading: boolean
 	lastReloadContentPath: string
+	audio: HTMLAudioElement
 
 	elementFound: MutationQueue
 	elementNotFound: MutationQueue