Get Stream Title from API

33 Views Asked by At

I had a code that I was using with a API that is now been discontinued, and now, I need to update the JavaScript, to the new API. I want to get the stream title, and separate the artist and the song, to write them separatly.

This is the new API link: https://api.zeno.fm/mounts/metadata/subscribe/0emqj6gcjpzvv and this is the code that I was using (I've already changed the API link and didn't work).

<script>
    
    $var_streamesdg = document.getElementById("streamesdg");
    $var_icon = document.getElementById("playiconesdg");
    
    function playPause() {
    if (streamesdg.paused) {
        streamesdg.play()
        $var_icon.classList.remove('fa-play')
        $var_icon.classList.add('fa-pause')

    } else {
        streamesdg.pause()
        $var_icon.classList.remove('fa-pause')
        $var_icon.classList.add('fa-play')
        }
    }
    
    function stop() {
        streamesdg.pause();
        streamesdg.currentTime = 0;
    }

     
    function updateNowPlaying() {
        fetch('https://api.zeno.fm/mounts/metadata/subscribe/0emqj6gcjpzvv')
            .then(response => response.json())
            .then(data => {
                const currentSong = data.currentSong;
                const currentArtist = data.currentArtist;
                const elementArtist = document.getElementById('npArtist');
                const elementSong = document.getElementById('npSong');
                if (elementArtist, elementSong) {
                    elementArtist.textContent = `${currentArtist}`;
                    elementSong.textContent = `${currentSong}`;
                } else {
                    console.error('Element with id "npArtist" or "npSong" not found.');
                }

                // Add the fetch call for the itunes link inside the function
                fetch(`https://itunes.apple.com/search?term=${currentArtist}+${currentSong}&entity=song&limit=1`)
                    .then(response => response.json())
                    .then(data => {
                        if (data.resultCount === 0) {
                            console.log('No results found.');
                            document.getElementById('artwork').setAttribute('src', '    https://radioesdg.agr1beja.pt/wp-content/themes/radio_esdg/songartwork.png');
                        } else {
                            const artworkUrl = data.results[0].artworkUrl100;
                            document.getElementById('artwork').setAttribute('src', artworkUrl);
                            // Use the artworkUrl to display the artwork.
                        }
                    })
                    .catch(error => {
                        console.error('Error:', error);
                    });
            })
            .catch(error => {
                console.error('Error fetching data from the API:', error);
            });
    }

    setInterval(updateNowPlaying, 5000);
    
    const express = require("express");
    const cors = require("cors");

    const corsOptions = {
      origin: "https://radioesdg.agr1beja.pt/",
    };

    const app = express();
    app.use(cors(corsOptions));
</script>

I was thinking that just by changing the API link, it would work, but I think I need to change the variables names, but I don't know the new ones.

0

There are 0 best solutions below