dingusland.fun needs Huh Duh Six Hungeos comparisons

I was recently browsing the dingusland.fun website and explored the headphone cave, when I noticed, that you could listen to every Headphone Recording or the original version from TrackTribe...

But not the recording from Ol' mate Senny! So I edited the code from the website a bit and added a button to put the headphones back on the Freakish Ears on a Stand: With the track switching back and forth between the selected Headphone and the Huh Duh Six Hungeos, as it should be.

The important button, I cant listen to this song without the quality changing in-between

Constrains: I am playing the recordings that are available on the website back and forth: They do not start at the exact same moment, so there is a slight hiccup when switching for some headphones.

For everyone who wants to try it out, copy and paste the below code in the console of your browsers page inspection tool:

// Create the shrek-green button
var button = document.createElement('button');
button.innerHTML = 'Lets put em on the freakish ears on a stand!';
button.id = 'compareAudioButton';
document.body.appendChild(button);

var style = document.createElement('style');
style.innerHTML = `
  #compareAudioButton {
    position: fixed;
    bottom: 30px;
    right: 20px;
    padding: 10px 20px;
    font-size: 16px;
    background-color:rgb(30, 163, 34);
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    z-index: 9999;
  }
  #compareAudioButton:hover {
    background-color: #45a049;
  }
`;
document.head.appendChild(style);

// here the magic happens
function compareAudio() {
    let audioThisHP = getThisHPAudio();
    let audioUrlThisHP = audioThisHP.getAttribute('data-url');
    let thisHPName = audioThisHP.getAttribute('data-title').split('-')[0];
    let audioURLOlMateSenny = 'https://static1.squarespace.com/static/66a72afe45b59c00ef09bb29/t/670603e33bb06074550c30a2/1728447471628/Walk+Through+the+Park+-+Sennheiser+HD600.mp3/original/Walk+Through+the+Park+-+Sennheiser+HD600.mp3';

    let audio1 = new Audio(audioURLOlMateSenny);
    let audio2 = new Audio(audioUrlThisHP);

    // Array of switch timestamps
    let switchTimes = [6.8, 13.5, 19.7, 25, 33]; 

    // Start with OldmateSenny
    let currentAudio = audio1;
    let nextAudio = audio2;
    let switchIndex = 0;

    // function to get the audio for the headphone featured on this site since: It is iconsistently either the first or second one
    function getThisHPAudio() {
        let audioDivs = document.querySelectorAll('.sqs-audio-embed');
        for (let i = 0; i < audioDivs.length; i++) {
            if (audioDivs[i].getAttribute('data-title') === 'Original Source - Walk Through The Park') { 
                continue;
            } else {
                return audioDivs[i];
            }
        }
    }

    // function for dem visuals in the popup
    function showPopup(message) {
        let popup = document.createElement('div');
        popup.innerText = message;
        popup.style.position = 'fixed';
        popup.style.top = '200px';
        popup.style.left = '50%';
        popup.style.transform = 'translateX(-50%)';
        popup.style.background = 'rgba(0, 0, 0, 0.8)';
        popup.style.color = 'white';
        popup.style.padding = '10px 20px';
        popup.style.borderRadius = '10px';
        popup.style.fontSize = '16px';
        popup.style.zIndex = '1000';
        popup.style.opacity = '1';
        popup.style.transition = 'opacity 0.5s ease';

        document.body.appendChild(popup);

        // Fade out after 2 seconds
        setTimeout(() => {
            popup.style.opacity = '0';
            setTimeout(() => popup.remove(), 500);
        }, 2000);
    }

    // function to switch back and forth between the mp3s
    function switchAudio() {
        if (switchIndex >= switchTimes.length) return; // Stop if out of switch times

        let targetTime = switchTimes[switchIndex];
        if (currentAudio.currentTime >= targetTime) {
            currentAudio.pause();
            [currentAudio, nextAudio] = [nextAudio, currentAudio];

            // Start the new audio at the same timestamp
            currentAudio.currentTime = targetTime;
            currentAudio.play();
            showPopup(currentAudio === audio1 ? "Ol' Mate Senny" : thisHPName);

            switchIndex++;
        }
    }

    // Start playing the first audio
    currentAudio.play();
    showPopup(currentAudio === audio1 ? "Huh Duh Six Hungeo's" : thisHPName);

    // Check time continuously every 500ms
    let checkTime = setInterval(switchAudio, 500); 
    currentAudio.onended = nextAudio.onended = () => clearInterval(checkTime);
}

document.getElementById('compareAudioButton').addEventListener('click', compareAudio);