flash.moe/assets/makai.js/dev-index.js

#include utility.js
#include xhr.js

const MakaiDevIndex = npInterval => {
    let headerBackground;
    let originalHeaderBackground;
    const defaultCoverImage = 'https://lastfm.freetls.fastly.net/i/u/174s/2a96cbd8b46e442fc41c2b86b821562f.png';
    let indexIsPlaying = false;
    let indexPlayingDefaultCover = false;
    let indexPlayingContainer;
    let indexPlayingCover;
    let indexPlayingTitle;
    let indexPlayingArtist;
    let indexLastNp;
    let indexPlayingInterval;
    let homeInterval;

    if(!sessionStorage.getItem('header-bgs') || sessionStorage.getItem('header-bgs-loaded') < Date.now() - 86400000)
        $x.get('/header-bgs.json').then(output => {
            if(output.status !== 200)
                return;

            sessionStorage.setItem('header-bgs', output.body());
            sessionStorage.setItem('header-bgs-loaded', Date.now());
        });

    const getNowListening = callback => {
        if(!callback)
            return;

        $x.get('https://now.flash.moe/get.php?u=flashwave_').then(output => {
            if(output.status !== 200)
                return;

            let info = output.json();
            if(info.length < 1)
                return;

            info = info[0];

            callback({
                name: info.name,
                now_playing: !!info.nowplaying,
                url: info.url,
                cover: info.images?.large ?? '',
                artist: {
                    name: info.artist?.name ?? '',
                    url: info.url.split('/_/')[0]
                },
            });
        });
    };

    const updateIndexNowListening = () => {
        getNowListening(info => {
            if(!indexLastNp || indexLastNp.url != info.url || indexLastNp.now_playing != info.now_playing) {
                if(!indexLastNp)
                    originalHeaderBackground = getRandomHeaderBackground();
                indexLastNp = info;
            } else return;

            indexIsPlaying = info.now_playing;
            indexPlayingDefaultCover = !info.cover || info.cover === defaultCoverImage;
            indexPlayingContainer.classList[info.now_playing ? 'remove' : 'add']('header-now-playing-hidden');
            indexPlayingCover.alt = indexPlayingCover.src = (info.cover !== defaultCoverImage ? info.cover : '//now.flash.moe/resources/no-cover.png');
            indexPlayingTitle.textContent = indexPlayingTitle.title = info.name;
            indexPlayingTitle.href = info.url;
            indexPlayingArtist.textContent = indexPlayingArtist.title = (info.artist || {}).name || '';
            indexPlayingArtist.href = (info.artist || {}).url || '';
            switchHeaderBackground(
                info.now_playing && !indexPlayingDefaultCover
                    ? indexPlayingCover.src
                    : originalHeaderBackground
            );
        });
    };

    const getRandomHeaderBackground = () => {
        var set = JSON.parse(sessionStorage.getItem('header-bgs'));
        if(!set)
            return '/images/404.jpg';
        return set[parseInt(Math.random() * set.length) - 1];
    };

    const setRandomHeaderBackground = () => {
        switchHeaderBackground(getRandomHeaderBackground());
    };

    const getCurrentHeaderBackground = function() {
        return headerBackground.querySelector('img').src;
    };

    let headerBackgroundIsChanging = false;
    const switchHeaderBackground = function(url) {
        if(headerBackgroundIsChanging || getCurrentHeaderBackground() === url)
            return;
        headerBackgroundIsChanging = true;
        var newImg = document.createElement('img'),
            oldImg = headerBackground.querySelector('img');
        newImg.alt = newImg.src = url;
        newImg.style.opacity = '0';
        oldImg.style.zIndex = '-1';
        newImg.style.zIndex = '0';
        headerBackground.appendChild(newImg);
        newImg.onload = () => {
            setTimeout(() => {
                newImg.style.opacity = null;
                setTimeout(() => {
                    newImg.style.zIndex = null;
                    headerBackground.removeChild(oldImg);
                    headerBackgroundIsChanging = false;
                }, 500);
            }, 50);
        };
        newImg.onerror = () => {
            headerBackgroundIsChanging = false;
            switchHeaderBackground(originalHeaderBackground);
        };
    };

    headerBackground = $q('.header-background');
    originalHeaderBackground = headerBackground.querySelector('img').src;

    if(!indexPlayingContainer) {
        indexPlayingContainer = document.querySelector('.header-now-playing');
        indexPlayingCover = indexPlayingContainer.querySelector('.header-now-playing-cover img');
        indexPlayingCover.onerror = () => { indexPlayingCover.src = '//now.flash.moe/resources/no-cover.png'; }
        indexPlayingTitle = indexPlayingContainer.querySelector('.header-now-playing-title a');
        indexPlayingArtist = indexPlayingContainer.querySelector('.header-now-playing-artist a');
    }

    if(indexPlayingInterval) {
        clearInterval(indexPlayingInterval);
        indexPlayingInterval = undefined;
    }

    updateIndexNowListening();
    indexPlayingInterval = setInterval(updateIndexNowListening, (npInterval || 30) * 1000);
};