The Code

// User will use an imput to call this function and the input value will be check to see if the input
// is a palindrome, then inform the user of the findings.
function getValues() {

    // Get the values from HTML and stage it for use by other functions
    let originalInputString = document.getElementById('originalInputString').value;

    // create a var and lowercase and replace all chars that are ^... with nothing. removing all char except the ones i expect
    normalizedString = originalInputString.toLowerCase().replace(/[^a-zA-Z0-9]/g, '');

    // pass the normalized string to be reversed and validated if its a palindrome
    let checkedResults = checkForPalindrome(normalizedString);

    // Pass bool results for is a palindrome checker and the un-normalized input from html
    displayResults(checkedResults, originalInputString);
}

// is the value passed in a palindrome?
// Step 1: Reverse the string
// Step 2: Compare reversed string against original to validate they match
// Step 3: Check for error cases
// Step 4: Return if the value was a palindrome or not.

function checkForPalindrome(normalizedString){
    // var for storing the input string value in reverse
    let reversedString = '';

    // var for storing true/false for if the input is a palindrome
    let isValidPalindrome = '';


    // make a for loop that reverses the string
    for (let i = normalizedString.length-1;i >= 0;i--) {
        reversedString += normalizedString[i];
    }

    // Validate the results against the normalized string and check against empty strings
    if (normalizedString == reversedString && normalizedString != "") {
        isValidPalindrome = true;
    } else {
        isValidPalindrome = false;
    }
    return isValidPalindrome;
}



function displayResults(checkedResults, originalInputString) {

    if (checkedResults == true) {

        swal.fire({
            background: "#dde6f4",
            title: 'Good Job!',
            backdrop: false,
            text: `"${originalInputString}" is a Palindrome`
          });

    } else {
        swal.fire({
            icon:'error',
            background: "#f8d8db",
            title: 'Oops!',
            backdrop: false,
            text: `"${originalInputString}" is NOT a Palindrome`
          });
    }
}

Code Structure

The code is structured into 3 functions that store the input from the user and run some code to determine if their input has the same value forwards as backwards.

The entry point:

`function getValues()`

Function 1:

The getValues function takes the value from the input, parses the data properly for use and uses that value to go through a series of functions to check if the value is or is not a palindrome.

Function 2:

The checkForPalindrome function takes the normalized value from getValues and creates a copy of that string, reverses that string, and then compare that reversed string to the normalized string to confirm it is a palindrome. Once we have discovered if the input is the a palindrome that information is returned back to getValues.

Function 3:

The displayResults function takes all the data we collect and uses that data to create a message that will display seemlessly to the user. That message is a javascript alert decorated using SweetAlert2 link.