mirror of
https://github.com/Fluffy-Bean/website.git
synced 2025-05-25 12:54:57 +00:00
31 lines
1.2 KiB
Text
31 lines
1.2 KiB
Text
---
|
|
import leg from "../assets/leg.webp";
|
|
---
|
|
|
|
<a class="button" id="music" href="https://www.last.fm/user/Fluffy_Bean_" target="_blank">
|
|
<img
|
|
src={leg}
|
|
width="64"
|
|
height="64"
|
|
loading="eager"
|
|
alt="Track cover art"
|
|
id="music-image"
|
|
/>
|
|
<ul>
|
|
<li id="music-title" style="font-weight: 600;">Track Name</li>
|
|
<li id="music-artist">by Artist</li>
|
|
<li id="music-album">on Album</li>
|
|
</ul>
|
|
</a>
|
|
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", async () => {
|
|
const request = await fetch("https://lastfm-last-played.biancarosa.com.br/Fluffy_Bean_/latest-song");
|
|
const data = await request.json();
|
|
|
|
( document.querySelector("#music-image") as HTMLImageElement ).src = data["track"]["image"][1]["#text"];
|
|
( document.querySelector("#music-title") as HTMLParagraphElement ).innerText = `${data["track"]["name"]}`;
|
|
( document.querySelector("#music-artist") as HTMLParagraphElement ).innerText = `by ${data["track"]["artist"]["#text"]}`;
|
|
( document.querySelector("#music-album") as HTMLParagraphElement ).innerText = `on ${data["track"]["album"]["#text"]}`;
|
|
});
|
|
</script>
|