show now listening

aberigle · Nov 6, 2023 · 7e16eca · 7e16eca
1 parent 1dc25a5
commit 7e16eca
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 5 deletions.
diff --git a/src/lib/apis/image.ts b/src/lib/apis/image.ts
@@ -2,7 +2,7 @@ const url : string = "https://image-api-chi.vercel.app/api/image"
 
 const example : string = '{ "startdate": "20231103", "fullstartdate": "202311032300", "enddate": "20231104", "url": "/th?id=OHR.BisonSnow_ES-ES4930036956_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp", "urlbase": "/th?id=OHR.BisonSnow_ES-ES4930036956", "copyright": "Bisonte americano, Parque Nacional de Yellowstone, Wyoming, EE.UU. (© Gary Gray/Getty Images)", "copyrightlink": "https://www.bing.com/search?q=Bisonte+americano&form=hpcapt&filters=HpDate%3a%2220231103_2300%22", "title": "Diseñados para el frío", "quiz": "/search?q=Bing+homepage+quiz&filters=WQOskey:%22HPQuiz_20231103_BisonSnow%22&FORM=HPQUIZ", "wp": true, "hsh": "9be7486cd3645e3c9e7b3d346653c21e", "drk": 1, "top": 1, "bot": 1, "hs": [] }'
 
-export default async function getImage() {
+export async function getImage() {
   if (!import.meta.env.PROD) return JSON.parse(example)
 
   const response = await fetch(url)

diff --git a/src/main.ts b/src/main.ts
@@ -1,6 +1,7 @@
-import getImage from './lib/apis/image'
+import { getImage } from './lib/apis/image'
+import { getNowPlaying } from './lib/apis/last-fm'
 import { getSVGIcon } from './lib/icons'
-import './style.css'
+import './styles/'
 
 document.querySelectorAll<HTMLElement>(".icon")
 .forEach(async (element: HTMLElement) => {
@@ -11,7 +12,20 @@ document.querySelectorAll<HTMLElement>(".icon")
 })
 
 async function checkListening() {
+  const track = await getNowPlaying("jayle23")
+  const element : HTMLElement = document.querySelector<HTMLElement>("#lastfm")!
 
+  if (!track) return element.classList.remove("show")
+
+  const img    : HTMLImageElement      = element.querySelector<HTMLImageElement>(".art")!
+  const artist : HTMLElement = element.querySelector<HTMLElement>(".artist")!
+  const song   : HTMLElement = element.querySelector<HTMLElement>(".song")!
+
+  img.src          = track.image[track.image.length -1]["#text"]
+  song.innerText   = track.name
+  artist.innerText = track.artist["#text"]
+
+  return element.classList.add("show")
 }
 
 async function checkBackground() {
@@ -20,11 +34,13 @@ async function checkBackground() {
   const copyright : HTMLAnchorElement = document.querySelector<HTMLAnchorElement>("#copyright")!
 
   element.style.backgroundImage = `url('https://bing.com${image.url}}')`
-  copyright.href = image.copyrightlink
+  copyright.href        = image.copyrightlink
   copyright.textContent = image.copyright
-  
+
   copyright.onmouseenter = () => document.body.classList.add("clean")
   copyright.onmouseleave = () => document.body.classList.remove("clean")
+
+  return true
 }
 
 checkListening()