const getID = (id) => document.getElementById(id) || undefined;
const fadeOut = (el) => {
    let fadeEffect = setInterval(function() {
        if (!el.style.opacity) {
            el.style.opacity = 1;
        }
        if (el.style.opacity > 0) {
            el.style.opacity -= 0.05;
        } else {
            el.style.display = 'none';
            clearInterval(fadeEffect);
        }
    }, 1);
};

function getStats() {
    $.getJSON('https://nowhits.co.uk/album.php', (data) => {
        $("#albumart")
            .attr("src", data.track_pic);
    });
}

window.onload = () => {
    let audio = getID('audio');
    if (localStorage.getItem('volume') == undefined) audio.volume = 0.5;
    else audio.volume = localStorage.getItem('volume') / 100;
    getID('vol')
        .value = audio.volume * 100;
    audio.play();
    if (audio.paused) {
        let vol = getID('vol');
        let control = getID('control');
        control.children[0].className = 'fas fa-play';
        vol.style.display = 'none';
    }
    getID('vol')
        .oninput = () => {
            audio.volume = getID('vol')
                .value / 100;
            localStorage.setItem('volume', getID('vol')
                .value);
        };
    updateStats();
    setInterval(() => updateStats(), 1000);
    getStats();
    setInterval(() => getStats(), 1000);
    if (window.location.protocol == 'http:') window.location.protocol = 'https:';
    /*$('.ml13').each(function(){
      $(this).html($(this).text().replace(/([^\x00-\x80]|\w)/g, "<span class='letter'>$&</span>"));
    });*/
    /*$("#adverth-1").fadeIn("slow");*/
    /*setInterval(() => autoSlider(), 90000);*/
};

function updateStats() {
    let xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            var data = JSON.parse(this.responseText);
            getID('listeners')
                .innerHTML = data.listeners.current;
            getID('dj')
                .innerHTML = data.live.is_live ? 'DJ ' + data.live.streamer_name : 'AutoDJ';
            getID('song')
                .innerHTML = data.now_playing.song.text;
            let dj = data.live.is_live ? 'DJ ' + data.live.streamer_name : 'AutoDJ';
        }
    };
    xhttp.open('GET', 'https://radio.nowhits.uk/api/nowplaying/1', true);
    xhttp.send();
}

const adswitch = (adID) => {
    switch (adID) {
        case 1:
            if (getID('adverth-1')
                .style.display == 'none') $('#adverth-1')
                .fadeIn('slow');
            if (getID('adverth-2')
                .style.display != 'none') $('#adverth-2')
                .fadeOut('slow');
            if (getID('adverth-3')
                .style.display != 'none') $('#adverth-3')
                .fadeOut('slow');
            getID('advert-next-1')
                .className = 'ad-control-active';
            getID('advert-next-2')
                .className = '';
            getID('advert-next-3')
                .className = '';
            break;
        case 2:
            if (getID('adverth-1')
                .style.display != 'none') $('#adverth-1')
                .fadeOut('slow');
            if (getID('adverth-2')
                .style.display == 'none') $('#adverth-2')
                .fadeIn('slow');
            if (getID('adverth-3')
                .style.display != 'none') $('#adverth-3')
                .fadeOut('slow');
            getID('advert-next-1')
                .className = '';
            getID('advert-next-2')
                .className = 'ad-control-active';
            getID('advert-next-3')
                .className = '';
            break;
        case 3:
            if (getID('adverth-1')
                .style.display != 'none') $('#adverth-1')
                .fadeOut('slow');
            if (getID('adverth-2')
                .style.display != 'none') $('#adverth-2')
                .fadeOut('slow');
            if (getID('adverth-3')
                .style.display == 'none') $('#adverth-3')
                .fadeIn('slow');
            getID('advert-next-1')
                .className = '';
            getID('advert-next-2')
                .className = '';
            getID('advert-next-3')
                .className = 'ad-control-active';
            break;
    }
};

function autoSlider() {
    setTimeout(() => {
        adswitch(2);
    }, 30000);
    setTimeout(() => {
        adswitch(3);
    }, 60000);
    setTimeout(() => {
        adswitch(1);
    }, 90000);
}

const playpause = () => {
    let audio = getID('audio');
    let vol = getID('vol');
    let control = getID('control');
    if (audio.paused) {
        control.children[0].className = 'fas fa-pause';
        audio.play();
        vol.style.display = 'inline-block';
    } else {
        control.children[0].className = 'fas fa-play';
        audio.pause();
        vol.style.display = 'none';
    }
};



$("#slideshow > div:gt(0)")
    .hide();

setInterval(function() {
    $('#slideshow > div:first')
        .fadeOut(2000)
        .next()
        .fadeIn(2000)
        .end()
        .appendTo('#slideshow');
}, 3000);