HTML/CSS/JavaScript Developer Console Animation with Menu Hover Responses

geUserData.php

<?php
// Get user name and/or IP
function get_user_data_processing_function(){
    $name = [];
    // Sanitize $_GET parameters to avoid XSS and other attacks
    $urlName = preg_replace('/[^-a-zA-Z0-9_]/', '', $_GET['n']);
    if($urlName){
        // Get user name from URL variable
        $name['name'] = $urlName;
    }
    // Get URL IP address if available
    $ipaddress = '';
    if (getenv('HTTP_CLIENT_IP'))
        $ipaddress = getenv('HTTP_CLIENT_IP');
    else if(getenv('HTTP_X_FORWARDED_FOR'))
        $ipaddress = getenv('HTTP_X_FORWARDED_FOR');
    else if(getenv('HTTP_X_FORWARDED'))
        $ipaddress = getenv('HTTP_X_FORWARDED');
    else if(getenv('HTTP_FORWARDED_FOR'))
        $ipaddress = getenv('HTTP_FORWARDED_FOR');
    else if(getenv('HTTP_FORWARDED'))
        $ipaddress = getenv('HTTP_FORWARDED');
    else if(getenv('REMOTE_ADDR'))
        $ipaddress = getenv('REMOTE_ADDR');
    else
        $ipaddress = 'Hmmm... Mystery User';

    $ipaddress = explode (',', $ipaddress);  
    $name['ip'] = $ipaddress[0];
    return $name;
}
// Create page inputs with user info
add_action('wp_footer', 'getUserIP'); 
function getUserIP() { 
    $userData = get_user_data_processing_function();
    echo '<input type="hidden" class="userIP" value="'.$userData["ip"].'" name="userIP" />'; 
    echo '<input type="hidden" class="userName" value="'.$userData["name"].'" name="userName" />'; 
}
?>

html-console-animation-script.js

// Typed function is using the library Typedjs: https://github.com/mattboldt/typed.js/
let homeConsoleIntro = document.getElementById('consoleText');
let typed = "";
if (homeConsoleIntro) {
    typed = new Typed('#consoleText', {
        strings: [
            '^2000', 'Hello...^1000 ' + createName() + '^1000\n' +
            'My name is Martin Kaiser^1000\n' +
            "I'm a full stack developer^1000\n" +
            'Based out of beautiful Vancouver, BC^2000\n',
            'I write everything from HTML and CSS^1000, to PHP and JavaScript for frontend and backend (Node)^2000\n',
            'Okay, let me load up my site locally on your device^500\n',
            'npm install mk-amaze-web-stuff --save ^1000\n' +
            '`installing components...` ^1000\n' +
            '`Fetching from source...` ^2000\n' +
            '`ERR!!!! ENOSPC No space left on device`^1000\n' +
            '`ERR!!!! mk-amaze-web-stuff is simply to large for disk`^2000',
            'hmmmmmmmmmmm^1000 (╯°□°)╯︵ ┻━┻^500',
            'Well, go ahead and check out my online portfolio^1000\n',
            "Apps^500, Snippets^500, Websites^500, Info^500, it's all great!\n^2000",
            ''
        ],
        typeSpeed: 40,
        backSpeed: 2,
        loop: false
    });
    // Wait for animation to get 6s in before allowing hover changes in console
    let waitForAnimation = true;
    setTimeout(function() {
        waitForAnimation = false;
        console.log(waitForAnimation);
    }, 6000);
    // Arrays for menu item mouse hover responces
    let choiceResponseCat = [" are a pretty great",
        " with some tricky problem's solved",
        " with cutting edge libraries",
        " with more code than a N64 game",
        " that show my skills",
        " that expanded my code repertoire",
        ", most started with Hello World!",
        "... npm run amazing-app"
    ];
    let choiceResponseCatItem = [" has some nicely written code",
        " is a bit complicated",
        " had some tricky problem's",
        " is pretty amazing",
        " alert(complicatedCode)",
        " took some brainstorming",
        " gave me a new appreciation Stack Overflow",
        " definitely started with Hello World!",
        "... npm run amazing-app"
    ];
    let lastArrayNumCheck = 0;
    let otherResponse = "";
    let hoverText = "";
    let currentResponse = "";
    let menuSelector = "";
    let currentChoice = [", always a good choice"];
    $(".sf-menu .menu-item").mouseenter(function() {
        console.log(waitForAnimation);
        if (!waitForAnimation) {
            typed.destroy();
            if ($(this).hasClass("cat")) {
                menuSelector = "cat";
                currentChoice = choiceResponseCat;
            }
            if ($(this).hasClass("cat-item")) {
                menuSelector = "cat-item";
                currentChoice = choiceResponseCatItem;
            }
            if ($(this).hasClass("design")) {
                menuSelector = "design";
                currentChoice = [", all the other bits"];
            }
            if ($(this).hasClass("about")) {
                menuSelector = "about";
                currentChoice = [", more about me!"];
            }
            if ($(this).hasClass("other")) {
                menuSelector = "other";
                currentChoice = [", always a good choice"];
            }
            var newPhrase = Math.random() * currentChoice.length;
            if (newPhrase == lastArrayNumCheck && newPhrase !== 0) {
                newPhrase = 0;
                lastArrayNumCheck = newPhrase;
            } else if (newPhrase == 0) {
                newPhrase = 1;
                lastArrayNumCheck = newPhrase;
            }

            hoverText = $(this, menuSelector).find("a").first().text();
            currentResponse = hoverText + currentChoice[Math.floor(newPhrase)];

            typed = new Typed('#consoleText', {
                strings: [
                    currentResponse
                ],
                typeSpeed: 7,
                backSpeed: 2,
                loop: false
            });
        }

    });
};